From 9bbeec2234afca0eda6b6300225919cdedc218ca Mon Sep 17 00:00:00 2001 From: Lucas Garron Date: Tue, 12 Jul 2022 21:30:11 -0700 Subject: [PATCH 1/2] Avoid errors when loading the overlay code in workers. `HTMLElement` and `customElements` are not defined in e.g. web workers. However, Vite sometimes tries to inject the overlay into such workers. Ideally, it would not do so (and would e.g. find another way to notify the developer about issues). But this PR offers a change that allows such workers to run, by avoiding crashes in `overlay.ts` when it does. --- packages/vite/src/client/overlay.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/vite/src/client/overlay.ts b/packages/vite/src/client/overlay.ts index 150c570fbc8aaf..6dc3c261be1cb8 100644 --- a/packages/vite/src/client/overlay.ts +++ b/packages/vite/src/client/overlay.ts @@ -115,6 +115,9 @@ code { const fileRE = /(?:[a-zA-Z]:\\|\/).*?:\d+:\d+/g const codeframeRE = /^(?:>?\s+\d+\s+\|.*|\s+\|\s*\^.*)\r?\n/gm +// Allow `ErrorOverlay` to extend `HTMLElement` even in environments where +// `HTMLElement` was not originally defined. +const { HTMLElement = class { } } = globalThis; export class ErrorOverlay extends HTMLElement { root: ShadowRoot @@ -184,6 +187,7 @@ export class ErrorOverlay extends HTMLElement { } export const overlayId = 'vite-error-overlay' +const { customElements } = globalThis; // Ensure `customElements` is defined before the next line. if (customElements && !customElements.get(overlayId)) { customElements.define(overlayId, ErrorOverlay) } From 4c4260e36dff9dc2add336d9b67705609242b982 Mon Sep 17 00:00:00 2001 From: patak-dev Date: Fri, 15 Jul 2022 15:22:52 +0200 Subject: [PATCH 2/2] chore: format --- packages/vite/src/client/overlay.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/vite/src/client/overlay.ts b/packages/vite/src/client/overlay.ts index 6dc3c261be1cb8..6a43434b7f320c 100644 --- a/packages/vite/src/client/overlay.ts +++ b/packages/vite/src/client/overlay.ts @@ -117,7 +117,7 @@ const codeframeRE = /^(?:>?\s+\d+\s+\|.*|\s+\|\s*\^.*)\r?\n/gm // Allow `ErrorOverlay` to extend `HTMLElement` even in environments where // `HTMLElement` was not originally defined. -const { HTMLElement = class { } } = globalThis; +const { HTMLElement = class {} } = globalThis export class ErrorOverlay extends HTMLElement { root: ShadowRoot @@ -187,7 +187,7 @@ export class ErrorOverlay extends HTMLElement { } export const overlayId = 'vite-error-overlay' -const { customElements } = globalThis; // Ensure `customElements` is defined before the next line. +const { customElements } = globalThis // Ensure `customElements` is defined before the next line. if (customElements && !customElements.get(overlayId)) { customElements.define(overlayId, ErrorOverlay) }