From 51b1e00b7b893983f6fa86063bf80ba2afe6ea4a Mon Sep 17 00:00:00 2001
From: Paulo <commonzenpython@gmail.com>
Date: Mon, 17 Aug 2026 13:08:35 +0200
Subject: [PATCH] noVNC as real ESM, one module shape for every bundler
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

@novnc/novnc 1.5.0 ships only Babel CommonJS, and the bundlers disagree
about what its default import means: dev and vitest unwrap exports.default
to the class, while the production build follows Node semantics and hands
back the whole exports object — so the deployed login window died at
new RFB() with 'zi.default is not a constructor'.

1.7.0 is type: module with an exports map pointing the bare specifier at
core/rfb.js. Real ESM, no interop anywhere: the bare import resolves the
class identically in dev, vitest, and the build.
---
 frontend/package-lock.json                  | 13 +++++--------
 frontend/package.json                       |  2 +-
 frontend/src/novnc.d.ts                     |  2 +-
 frontend/src/pages/LoginWindowPage.test.tsx |  2 +-
 frontend/src/pages/LoginWindowPage.tsx      |  2 +-
 5 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 40bcd410..0201fa58 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -8,7 +8,7 @@
       "name": "frontend",
       "version": "0.0.0",
       "dependencies": {
-        "@novnc/novnc": "1.5.0",
+        "@novnc/novnc": "1.7.0",
         "@tanstack/react-query": "^5.101.4",
         "lucide-react": "^1.27.0",
         "react": "^19.2.8",
@@ -820,13 +820,10 @@
       }
     },
     "node_modules/@novnc/novnc": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/@novnc/novnc/-/novnc-1.5.0.tgz",
-      "integrity": "sha512-4yGHOtUCnEJUCsgEt/L78eeJu00kthurLBWXFiaXfonNx0pzbs6R/3gJb1byZe6iAE8V9MF0syQb0xIL8MSOtQ==",
-      "license": "MPL-2.0",
-      "engines": {
-        "node": ">=12.0.0"
-      }
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/@novnc/novnc/-/novnc-1.7.0.tgz",
+      "integrity": "sha512-ucEJOx4T2avIRCleodk7YobZj5O2Ga2AeLfQ69A/yjG9HHba2+PDgwSkN3FttrmG+70ZGx21sElNFouK13RzyA==",
+      "license": "MPL-2.0"
     },
     "node_modules/@oxc-project/types": {
       "version": "0.139.0",
diff --git a/frontend/package.json b/frontend/package.json
index 017366cb..a7c3007f 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -13,7 +13,7 @@
     "types:openapi": "openapi-typescript http://127.0.0.1:8000/openapi.json -o src/api/openapi.ts"
   },
   "dependencies": {
-    "@novnc/novnc": "1.5.0",
+    "@novnc/novnc": "1.7.0",
     "@tanstack/react-query": "^5.101.4",
     "lucide-react": "^1.27.0",
     "react": "^19.2.8",
diff --git a/frontend/src/novnc.d.ts b/frontend/src/novnc.d.ts
index 5685d991..3cd5e5b0 100644
--- a/frontend/src/novnc.d.ts
+++ b/frontend/src/novnc.d.ts
@@ -1,4 +1,4 @@
-declare module '@novnc/novnc/lib/rfb' {
+declare module '@novnc/novnc' {
   export default class RFB extends EventTarget {
     constructor(target: HTMLElement, url: string)
     scaleViewport: boolean
diff --git a/frontend/src/pages/LoginWindowPage.test.tsx b/frontend/src/pages/LoginWindowPage.test.tsx
index 3f1d0f05..049f4ebf 100644
--- a/frontend/src/pages/LoginWindowPage.test.tsx
+++ b/frontend/src/pages/LoginWindowPage.test.tsx
@@ -8,7 +8,7 @@ const rfbState = vi.hoisted(() => ({
   instances: [] as Array<EventTarget & { url: string; disconnect: ReturnType<typeof vi.fn> }>,
 }))
 
-vi.mock('@novnc/novnc/lib/rfb', () => {
+vi.mock('@novnc/novnc', () => {
   class FakeRFB extends EventTarget {
     url: string
     scaleViewport = false
diff --git a/frontend/src/pages/LoginWindowPage.tsx b/frontend/src/pages/LoginWindowPage.tsx
index 54140ce6..7b6b810c 100644
--- a/frontend/src/pages/LoginWindowPage.tsx
+++ b/frontend/src/pages/LoginWindowPage.tsx
@@ -1,5 +1,5 @@
 import { useEffect, useRef, useState } from 'react'
-import RFB from '@novnc/novnc/lib/rfb'
+import RFB from '@novnc/novnc'
 
 import { api } from '../api/client'
 import { Page } from '../components/Page'