From a428f8d4fada6783cdcb12926dafb08f6e94f2aa Mon Sep 17 00:00:00 2001 From: Vladimir Date: Mon, 14 Aug 2023 16:29:51 +0200 Subject: [PATCH] fix(web): correctly resolve assets in new URL (#3950) --- .../vitest/src/node/plugins/ssrReplacer.ts | 13 +------------ packages/web-worker/src/shared-worker.ts | 4 ++-- packages/web-worker/src/utils.ts | 8 ++++++++ packages/web-worker/src/worker.ts | 4 ++-- test/core/test/url-ssr.test.ts | 19 +++++++++++++++++++ test/core/test/url-web.test.ts | 13 +++++++++++++ test/web-worker/test/init.test.ts | 6 ++++-- 7 files changed, 49 insertions(+), 18 deletions(-) create mode 100644 test/core/test/url-ssr.test.ts create mode 100644 test/core/test/url-web.test.ts diff --git a/packages/vitest/src/node/plugins/ssrReplacer.ts b/packages/vitest/src/node/plugins/ssrReplacer.ts index 15fd60e42dc9..217ceff188a6 100644 --- a/packages/vitest/src/node/plugins/ssrReplacer.ts +++ b/packages/vitest/src/node/plugins/ssrReplacer.ts @@ -7,7 +7,7 @@ import { cleanUrl } from 'vite-node/utils' // import.meta.env.VITE_NAME = 'app' -> process.env.VITE_NAME = 'app' export function SsrReplacerPlugin(): Plugin { return { - name: 'vitest:env-replacer', + name: 'vitest:ssr-replacer', enforce: 'pre', transform(code, id) { if (!/\bimport\.meta\.env\b/.test(code) && !/\bimport\.meta\.url\b/.test(code)) @@ -26,17 +26,6 @@ export function SsrReplacerPlugin(): Plugin { s.overwrite(startIndex, endIndex, 'process.env') } - const urls = cleanCode.matchAll(/\bimport\.meta\.url\b/g) - - for (const env of urls) { - s ||= new MagicString(code) - - const startIndex = env.index! - const endIndex = startIndex + env[0].length - - s.overwrite(startIndex, endIndex, '__vite_ssr_import_meta__.url') - } - if (s) { return { code: s.toString(), diff --git a/packages/web-worker/src/shared-worker.ts b/packages/web-worker/src/shared-worker.ts index 7a06c85b0160..ea2427bab624 100644 --- a/packages/web-worker/src/shared-worker.ts +++ b/packages/web-worker/src/shared-worker.ts @@ -1,7 +1,7 @@ import { MessageChannel, type MessagePort as NodeMessagePort } from 'node:worker_threads' import type { InlineWorkerContext, Procedure } from './types' import { InlineWorkerRunner } from './runner' -import { debug, getRunnerOptions } from './utils' +import { debug, getFileIdFromUrl, getRunnerOptions } from './utils' interface SharedInlineWorkerContext extends Omit { onconnect: Procedure | null @@ -101,7 +101,7 @@ export function createSharedWorkerConstructor(): typeof SharedWorker { const runner = new InlineWorkerRunner(runnerOptions, context) - const id = (url instanceof URL ? url.toString() : url).replace(/^file:\/+/, '/') + const id = getFileIdFromUrl(url) this._vw_name = id diff --git a/packages/web-worker/src/utils.ts b/packages/web-worker/src/utils.ts index a955d02b9de1..75cc7ab48b16 100644 --- a/packages/web-worker/src/utils.ts +++ b/packages/web-worker/src/utils.ts @@ -80,3 +80,11 @@ export function getRunnerOptions(): any { state, } } + +export function getFileIdFromUrl(url: URL | string) { + if (!(url instanceof URL)) + url = new URL(url, self.location.origin) + if (url.protocol === 'http:' || url.protocol === 'https:') + return url.pathname + return url.toString().replace(/^file:\/+/, '/') +} diff --git a/packages/web-worker/src/worker.ts b/packages/web-worker/src/worker.ts index 805cda8508df..9453a695beec 100644 --- a/packages/web-worker/src/worker.ts +++ b/packages/web-worker/src/worker.ts @@ -1,6 +1,6 @@ import type { CloneOption, DefineWorkerOptions, InlineWorkerContext, Procedure } from './types' import { InlineWorkerRunner } from './runner' -import { createMessageEvent, debug, getRunnerOptions } from './utils' +import { createMessageEvent, debug, getFileIdFromUrl, getRunnerOptions } from './utils' export function createWorkerConstructor(options?: DefineWorkerOptions): typeof Worker { const runnerOptions = getRunnerOptions() @@ -66,7 +66,7 @@ export function createWorkerConstructor(options?: DefineWorkerOptions): typeof W const runner = new InlineWorkerRunner(runnerOptions, context) - const id = (url instanceof URL ? url.toString() : url).replace(/^file:\/+/, '/') + const id = getFileIdFromUrl(url) this._vw_name = id diff --git a/test/core/test/url-ssr.test.ts b/test/core/test/url-ssr.test.ts new file mode 100644 index 000000000000..79ac8bfef4ab --- /dev/null +++ b/test/core/test/url-ssr.test.ts @@ -0,0 +1,19 @@ +// @vitest-environment node + +import { fileURLToPath, pathToFileURL } from 'node:url' +import { dirname, resolve } from 'pathe' +import { expect, it } from 'vitest' + +it('correctly resolves new assets URL paths', () => { + const urlCss = new URL('../src/file-css.css', import.meta.url) + expect(urlCss.toString()).toBe( + pathToFileURL(resolve(dirname(fileURLToPath(import.meta.url)), '../src/file-css.css')).toString(), + ) +}) + +it('doesn\'t resolve aliases for new URL in SSR', () => { + const urlAlias = new URL('#/file-css.css', import.meta.url) + expect(urlAlias.toString()).toBe( + pathToFileURL(`${fileURLToPath(import.meta.url)}#/file-css.css`).toString().replace('%23', '#'), + ) +}) diff --git a/test/core/test/url-web.test.ts b/test/core/test/url-web.test.ts new file mode 100644 index 000000000000..2890144252cd --- /dev/null +++ b/test/core/test/url-web.test.ts @@ -0,0 +1,13 @@ +// @vitest-environment jsdom + +import { expect, it } from 'vitest' + +it('correctly resolves new assets URL paths', () => { + const urlCss = new URL('../src/file-css.css', import.meta.url) + expect(urlCss.toString()).toBe('http://localhost:3000/src/file-css.css') +}) + +it('correctly resolves aliased URL paths', () => { + const urlAlias = new URL('#/file-css.css', import.meta.url) + expect(urlAlias.toString()).toBe('http://localhost:3000/src/file-css.css') +}) diff --git a/test/web-worker/test/init.test.ts b/test/web-worker/test/init.test.ts index 8b75947feb26..d2a02bb68aa8 100644 --- a/test/web-worker/test/init.test.ts +++ b/test/web-worker/test/init.test.ts @@ -75,11 +75,13 @@ it('self injected into worker and its deps should be equal', async () => { expect.assertions(4) expect(await testSelfWorker(new MySelfWorker())).toBeTruthy() // wait for clear worker mod cache - await sleep(500) + await sleep(0) expect(await testSelfWorker(new MySelfWorker())).toBeTruthy() + await sleep(0) + expect(await testSelfWorker(new Worker(new URL('../src/selfWorker.ts', import.meta.url)))).toBeTruthy() // wait for clear worker mod cache - await sleep(500) + await sleep(0) expect(await testSelfWorker(new Worker(new URL('../src/selfWorker.ts', import.meta.url)))).toBeTruthy() })