Vite proxy connection error - Bad subprotocol syntax

[MarcinVaadin]

Description of the bug

After starting multimodule application, exception as below is logged in console after 60 s of idle.

2024-11-28T14:25:37.290+01:00 ERROR 67271 --- [nio-8090-exec-9] c.v.b.d.viteproxy.ViteWebsocketProxy     : Error creating Vite proxy connection

java.lang.IllegalArgumentException: Bad subprotocol syntax: 
	at java.net.http/jdk.internal.net.http.websocket.OpeningHandshake.illegal(OpeningHandshake.java:358) ~[java.net.http:na]
	at java.net.http/jdk.internal.net.http.websocket.OpeningHandshake.createRequestSubprotocols(OpeningHandshake.java:156) ~[java.net.http:na]
	at java.net.http/jdk.internal.net.http.websocket.OpeningHandshake.<init>(OpeningHandshake.java:131) ~[java.net.http:na]
	at java.net.http/jdk.internal.net.http.websocket.WebSocketImpl.newInstanceAsync(WebSocketImpl.java:139) ~[java.net.http:na]
	at java.net.http/jdk.internal.net.http.websocket.BuilderImpl.buildAsync(BuilderImpl.java:120) ~[java.net.http:na]
	at com.vaadin.base.devserver.viteproxy.ViteWebsocketConnection.<init>(ViteWebsocketConnection.java:76) ~[vaadin-dev-server-24.6.0.beta4.jar:na]
	at com.vaadin.base.devserver.viteproxy.ViteWebsocketProxy.<init>(ViteWebsocketProxy.java:53) ~[vaadin-dev-server-24.6.0.beta4.jar:na]
	at com.vaadin.base.devserver.viteproxy.ViteWebsocketEndpoint.onOpen(ViteWebsocketEndpoint.java:96) ~[vaadin-dev-server-24.6.0.beta4.jar:na]
	at org.apache.tomcat.websocket.server.WsHttpUpgradeHandler.init(WsHttpUpgradeHandler.java:131) ~[tomcat-embed-websocket-10.1.33.jar:10.1.33]
	at org.apache.coyote.AbstractProtocol$ConnectionHandler.process(AbstractProtocol.java:947) ~[tomcat-embed-core-10.1.33.jar:10.1.33]
	at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1741) ~[tomcat-embed-core-10.1.33.jar:10.1.33]
	at org.apache.tomcat.util.net.SocketProcessorBase.run(SocketProcessorBase.java:52) ~[tomcat-embed-core-10.1.33.jar:10.1.33]
	at org.apache.tomcat.util.threads.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1190) ~[tomcat-embed-core-10.1.33.jar:10.1.33]
	at org.apache.tomcat.util.threads.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:659) ~[tomcat-embed-core-10.1.33.jar:10.1.33]
	at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:63) ~[tomcat-embed-core-10.1.33.jar:10.1.33]
	at java.base/java.lang.Thread.run(Thread.java:833) ~[na:na]

Expected behavior

Should not happen

Minimal reproducible example

Tested on copilot/tests/multimodule application, will try to recreate same project in private repo.

Versions

Hilla: 24.6.0.beta3
Flow: 24.6.0.beta4
Vaadin: 24.6.0.beta1
Copilot: 24.6-SNAPSHOT
Frontend Hotswap: Enabled, using Vite
OS: aarch64 Mac OS X 15.1.1
Java: Oracle Corporation 18.0.1.1
Browser: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36
Java Hotswap: Hotswap is not enabled
IDE Plugin: 1.4.1 IntelliJ

[mcollovati]

Probably related to this change in Vite 6.0.1
vitejs/vite@7f9f8c6

Most likely, Vaadin ViteWebsocketEndpoint should also have vite-ping in subprotocols list.

[mcollovati]

========================= ViteWebsocketConnection subprotocol 
[http-nio-8888-exec-9] ERROR com.vaadin.base.devserver.viteproxy.ViteWebsocketProxy - Error creating Vite proxy connection
java.lang.IllegalArgumentException: Bad subprotocol syntax: 
	at java.net.http/jdk.internal.net.http.websocket.OpeningHandshake.illegal(OpeningHandshake.java:358)
	at java.net.http/jdk.internal.net.http.websocket.OpeningHandshake.createRequestSubprotocols(OpeningHandshake.java:156)
	at java.net.http/jdk.internal.net.http.websocket.OpeningHandshake.<init>(OpeningHandshake.java:131)
	at java.net.http/jdk.internal.net.http.websocket.WebSocketImpl.newInstanceAsync(WebSocketImpl.java:139)
	at java.net.http/jdk.internal.net.http.websocket.BuilderImpl.buildAsync(BuilderImpl.java:120)
	at com.vaadin.base.devserver.viteproxy.ViteWebsocketConnection.<init>(ViteWebsocketConnection.java:77)
	at com.vaadin.base.devserver.viteproxy.ViteWebsocketProxy.<init>(ViteWebsocketProxy.java:53)
	at com.vaadin.base.devserver.viteproxy.ViteWebsocketEndpoint.onOpen(ViteWebsocketEndpoint.java:96)
	at org.apache.tomcat.websocket.server.WsHttpUpgradeHandler.init(WsHttpUpgradeHandler.java:131)
	at org.apache.coyote.AbstractProtocol$ConnectionHandler.process(AbstractProtocol.java:947)
	at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1741)
	at org.apache.tomcat.util.net.SocketProcessorBase.run(SocketProcessorBase.java:52)
	at org.apache.tomcat.util.threads.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1190)
	at org.apache.tomcat.util.threads.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:659)
	at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:63)
	at java.base/java.lang.Thread.run(Thread.java:840)
========================= ViteWebsocketConnection subprotocol vite-hmr
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - [vite] (client) ✨ new dependencies optimized: @preact/signals-react/runtime
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - [vite] (client) ✨ optimized dependencies changed. reloading
========================= ViteWebsocketConnection subprotocol vite-hmr

However, adding the vite-ping subprotocol to the list, there is no more error but

[http-nio-8888-exec-1] INFO org.springframework.web.servlet.DispatcherServlet - Completed initialization in 1 ms
========================= ViteWebsocketConnection subprotocol vite-ping

------------------ Starting Frontend compilation. ------------------
[ForkJoinPool.commonPool-worker-1] INFO com.vaadin.base.devserver.AbstractDevServerRunner - Running Vite to compile frontend resources. This may take a moment, please stand by...
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - @vaadin/bundles npm package is not found, Vaadin component dependency bundles are disabled.
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - 
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker -   VITE v6.0.1  ready in 1419 ms

----------------- Frontend compiled successfully. -----------------

[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - 
[ForkJoinPool.commonPool-worker-1] INFO com.vaadin.base.devserver.AbstractDevServerRunner - Started Vite. Time: 1856ms
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker -   ➜  Local:   http://127.0.0.1:39681/VAADIN/
[ForkJoinPool.commonPool-worker-2] INFO com.vaadin.base.devserver.DevModeHandlerManagerImpl - Application running at http://localhost:8888/
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - Comment replacement failed to change anything
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - 
[dev-server-output] INFO com.vaadin.base.devserver.DevServerOutputTracker - [TypeScript] Found 0 errors. Watching for file changes.
========================= ViteWebsocketConnection subprotocol vite-hmr
========================= ViteWebsocketConnection subprotocol vite-hmr

[mcollovati]

@MarcinVaadin I'm not able to reproduce with the 60 seconds idle time, but only at startup if the connections happen while Vite is still compiling.
Do you mind trying to the changes in #20578 locally and let me know if it fixes the issue?