Hi,
I have a react typescript project which I am using Stimulsoft Reports js with to run reports. Everything works fine with React version 17.0.2 but when I upgrade to the lastest version 18.2.0 the css isn't working correctly.
There seems to be two issues:
The first one with the latest version it is replacing the <body> tag with the report rather than my report div I have set. I use the following:
viewer.renderHtml('viewer');
return (
<div id="viewer">
</div>
)
But instead of just replacing the above div it is replacing the <body> so I'm missing my layout page details.
The 2nd issue is with the ribbon. For some reason, it doesn't seem to be picking up the css properly. When I click on one of the dropdowns for example, to save the report, the menu item appears at the bottom of the report rather than under the menu item. See attachments.
With the older version I had to set the below css as I use a layout page so I needed to move the dropdown menu for it to display properly, but this doesn't work now.
.stiJsViewerParentMenu {
left: 331px;
top: 81px;
}
I'm using the latest stimulsoft packages: "stimulsoft-reports-js": "2022.3.3".
Is there something I can add to fix these issues? In the meantime, I've downgraded back to react 17.0.2.
Report CSS not working properly with React version 18.2.0
Report CSS not working properly with React version 18.2.0
- Attachments
-
- Stimulsoft Ribbon with react 18.png (10.93 KiB) Viewed 536 times
-
- Stimulsoft Ribbon dropdown with react 18.png (37.17 KiB) Viewed 536 times
-
- Stimulsoft Ribbin with react 17.png (20.71 KiB) Viewed 536 times
-
Max Shamanov
- Posts: 790
- Joined: Tue Sep 07, 2021 10:11 am
Re: Report CSS not working properly with React version 18.2.0
Hello,
We couldn't reproduce the issue on our samples.
Please send us a sample project that reproduces the issue.
Thank you.
We couldn't reproduce the issue on our samples.
Please send us a sample project that reproduces the issue.
Thank you.