fix: Make Vite messages from browser to server work (#21565) (#21567)

Fixes #21564

Co-authored-by: Artur <artur@vaadin.com>

Author: vaadin-bot

flow-tests/test-dev-mode/src/main/frontend/vite-communication.ts

@@ -0,0 +1,5 @@
+// @ts-expect-error
+if (import.meta.hot) {
+    // @ts-ignore
+  window.importmetahot = import.meta.hot;
+}

flow-tests/test-dev-mode/src/main/java/com/vaadin/flow/uitest/ui/ViteCommunicationView.java

@@ -0,0 +1,54 @@
+/*
+ * Copyright 2000-2025 Vaadin Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.vaadin.flow.uitest.ui;
+
+import com.vaadin.flow.component.AttachEvent;
+import com.vaadin.flow.component.UI;
+import com.vaadin.flow.component.dependency.JsModule;
+import com.vaadin.flow.component.html.Div;
+import com.vaadin.flow.component.html.NativeButton;
+import com.vaadin.flow.component.page.Page;
+import com.vaadin.flow.router.Route;
+import com.vaadin.flow.uitest.servlet.ViewTestLayout;
+
+@Route(value = "com.vaadin.flow.uitest.ui.ViteCommunicationView", layout = ViewTestLayout.class)
+@JsModule("./vite-communication.ts")
+public class ViteCommunicationView extends Div {
+
+    @Override
+    protected void onAttach(AttachEvent attachEvent) {
+        super.onAttach(attachEvent);
+        UI ui = attachEvent.getUI();
+        Page page = ui.getPage();
+        page.executeJs(
+                """
+                        window.importmetahot.on('test-event-response', (event) => {
+                            document.querySelector('#response').innerText += 'Got event test-event-response with data ' + JSON.stringify(event) + '';
+                        });
+                        """);
+
+        NativeButton sendMessage = new NativeButton("Send message",
+                e -> ui.getPage().executeJs(
+                        "window.importmetahot.send('test-event', {foo: 'bar'});"));
+        sendMessage.setId("send");
+        Div response = new Div();
+        response.setId("response");
+
+        add(sendMessage, response);
+
+    }
+
+}

flow-tests/test-dev-mode/src/test/java/com/vaadin/flow/uitest/ui/ViteCommunicationIT.java

@@ -0,0 +1,34 @@
+/*
+ * Copyright 2000-2025 Vaadin Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.vaadin.flow.uitest.ui;
+
+import org.junit.Test;
+
+import com.vaadin.flow.component.html.testbench.DivElement;
+import com.vaadin.flow.component.html.testbench.NativeButtonElement;
+import com.vaadin.flow.testutil.ChromeBrowserTest;
+
+public class ViteCommunicationIT extends ChromeBrowserTest {
+
+    @Test
+    public void messageSentToViteAndBack() {
+        open();
+        $(NativeButtonElement.class).id("send").click();
+        waitUntil(driver -> $(DivElement.class).id("response").getText().equals(
+                "Got event test-event-response with data {\"foo\":\"bar\"}"));
+    }
+
+}

flow-tests/test-dev-mode/vite.config.ts

@@ -0,0 +1,17 @@
+import { UserConfigFn } from 'vite';
+import { overrideVaadinConfig } from './vite.generated';
+
+const customConfig: UserConfigFn = (env) => ({
+  plugins: [
+    {
+      name: 'communication-test',
+      configureServer(server) {
+        server.ws.on('test-event', (data) => {
+          server.ws.send('test-event-response', data);
+        });
+      }
+    }
+  ]
+});
+
+export default overrideVaadinConfig(customConfig);

vaadin-dev-server/src/main/java/com/vaadin/base/devserver/viteproxy/ViteWebsocketConnection.java

@@ -139,7 +139,7 @@ public CompletionStage<?> onText(WebSocket webSocket, CharSequence data,
     public void send(String message)
             throws InterruptedException, ExecutionException {
         CompletableFuture<WebSocket> send = clientWebsocket.get()
-                .sendText(message, false);
+                .sendText(message, true);
         send.get();
     }