Potential beacon problems with Chrome

[oliveryasuna]

Description of the bug

We see the following client-side error 100+ times a day:

TypeError: Illegal invocation
 at eval at Q3 (https://myurl.com/VAADIN/build/FlowClient-urjGN_YE.js:3:42383), <anonymous>(sendBeacon:8:13)
 at eval at Q3 (https://myurl.com/VAADIN/build/FlowClient-urjGN_YE.js:3:42383), <anonymous>(HTMLBodyElement.eval:13:1)
 at eval at Q3 (https://myurl.com/VAADIN/build/FlowClient-urjGN_YE.js:3:42383), <anonymous>(Object.eval:13:17)
 at /VAADIN/build/FlowClient-urjGN_YE.js(Q3:3:42444)
 at /VAADIN/build/FlowClient-urjGN_YE.js(Bg:3:22831)
 at /VAADIN/build/FlowClient-urjGN_YE.js(Xm:1:24808)
 at /VAADIN/build/FlowClient-urjGN_YE.js(om:1:19919)
 at /VAADIN/build/FlowClient-urjGN_YE.js(z.cb:3:69323)
 at /VAADIN/build/FlowClient-urjGN_YE.js(Jr:3:15280)
 at /VAADIN/build/FlowClient-urjGN_YE.js(nE:3:45560)
 at /VAADIN/build/FlowClient-urjGN_YE.js(z.C:3:69109)
 at /VAADIN/build/FlowClient-urjGN_YE.js(_r:1:41536)
 at /VAADIN/build/FlowClient-urjGN_YE.js(z.bb:3:58847)
 at /VAADIN/build/FlowClient-urjGN_YE.js(z.I:3:63223)
 at /VAADIN/build/FlowClient-urjGN_YE.js(null:3:12404)

It seems to only occur for Chrome on Windows, including the latest version.

If I remember right, Vaadin uses beacons to signal when a page is closed and destroys the UI instance. I also remember reading somewhere that Chrome is finicky with the events you can use to detect a page close. Perhaps Chrome does not allow JS code executed after a tab/window is close, so pagehide will not work?

We do not have any extra code that deals with beacons that could cause this.

The error most likely is thrown after the page is closed, so I have no idea how to reproduce it on local, since the console goes away. The only reason we noticed this is because of LogRocket, a session replay tool.

Expected behavior

No error.

Minimal reproducible example

I was unable to reproduce it in a small project.

Versions

• Vaadin Platform version: 24.3.8
• Java version: 21

[Legioth]

Does anyone have any idea on what HTMLBodyElement.eval might refer to? Seems weird that something like that would be related to sendBeacon.

[mshabarov]

Flow itself adds a listener for pagehide event, but it doesn't use HTMLBodyElement.eval from the first glance. We have to check who else (other parts of Vaadin) may call it.

[mstahv]

Maybe related? https://github.com/vaadin/flow/issues/19305