Vaadin 24.5.0 migration issue

Flow
1

For some unknown reason, the routing is not working after the upgrade. The route paths are jumping to some random path. The view is different from the route path. The highlighted navigation path is different from what is rendered. I do not know what is causing this issue. I updagraded from V24.3.3 to V24.5.0 and started seeing this error and it is the same with V24.5.2 as well.

Since it happens randomly I’m unable to recreate it with some examples.

2

image
image1016×715 60.3 KB

From the picture 1 and 2 are corrent but 3 is not. It is completely for a different view. IDK how this view is getting here when there is no relationship between the route path and the view

3

This is likely caused by changes in routing between 24.3 and 24.4/24.5 (React Router is used now by default). My guess is that the unexpected content is the content of a previous page, which wasn’t automatically deleted after navigation.
We fixed a bunch of similar bugs in 24.4/24.5, but this one might be a new one or regression.

Could you please try to set up vaadin.react.enable=false (application.properties) or <reactEnable>false</reactEnable> for Vaadin plugin to fallback to old routing with vaadin-router and check if it solves this issue?
Also, we’d appreciate if you create a new issue in Vaadin Flow Github repo and give us a minimal reproducible example.
Thanks!

4

I’ve applied this change vaadin.react.enable=false in application.properties but the issue still remains. I see some random errors like java.lang.UnsupportedOperationException: Unexpected message id from the client. Expected sync id: 90, got 91. more details logged on DEBUG level. and Ignored RPC for invocation handler 'com.vaadin.flow.server.communication.rpc.MapSyncRpcHandler' from the client side for an inert node id='971' element with tag'vaadin-combo-box' Component: 'com.vaadin.flow.component.combobox.ComboBox' Route: 'holon'. I do not know whether these are creating those issues or not.

Sometimes the page is completely changed to a different URL outside of localhost:8080. It goes to the initial page of the tab when it was opened.

5

Another strange thing is, it is happening with Chrome and Edge only. When I tested with Firefox, it works as expected. No page/view hijacking.

6

Thanks for the additional context. “Unexpected message id” is likely unrelated, it may cause page reloading, but likely not the unexpected extra content.
Different browser outcome makes this even more tricky.
Could you please create a bug report here Sign in to GitHub · GitHub and possibly give us a minimal reproducible example project?

Also, do you get any warnings/errors in browser console when this happens, anything related to react-router?

7

I have exactly the same problems

8

I don’t know what is causing this issue. I downloaded a fresh blank project from start.vaadin.com and added one of my view there and it started happening there too. Here is a video showing the issue

Created an issue as well : Vaadin 24.5.0 migration issue · Issue #20435 · vaadin/flow · GitHub