- ABP Framework version: v8.0.2
- UI Type: Blazor Server
- Database System: EF Core SQL Server
- Tiered (for MVC) or Auth Server Separated (for Angular): yes
- Exception message and full stack trace:
- Steps to reproduce the issue:
When using .Net 8 Blazor enhanced load navigation for menu, it does not replace the entire lpx-scroll-container contents nor replace the div for ps__rail-y, ps__rail-x. The # of pixels scrolled for a single mouse wheel click increases by 288 px each time the navigation changes. After several back/forth navigations the scroll wheel simply goes to the top of the screen or the bottom of the screen. Inspecting the HTML shows multiple divs with ps__rail-y and ps__rail-x.
This seems to be an interaction with ABP (leptonX / perfectscroll) with the .Net 8 Blazor enhanced navigation and form handling https://github.com/dotnet/aspnetcore/issues/51692 which patches the DOM with the new content.
If we set the forceLoad flag to true on the NavigateTo call then the scrolling works fine but there is an undesired flash on the screen as it reloads the entire page.
As per https://github.com/dotnet/aspnetcore/issues/51692 Microsoft doesn't intend to fix this until possibly .Net 9, but suggests using the 'data-permanent' attribute to indicate DOM elements that should be replaced.
Is there any way to mark the divs for ps__rail-y and ps__rail-x with this attribute so they are replaced when the DOM is patched? and/or do you have any other suggestions on how to resolve this.
2 Answer(s)
-
0
Hi,
I created an internal issue, we will check this.
-
0
PerfectScrollbar is too buggy on Blazor since DOM is updated dynamically. we decide removed PS for Blazor content.