From f453340ee69d970fbaecbc7a0f37233fc89343be Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Thu, 15 Aug 2024 12:32:18 +0900 Subject: [PATCH 1/6] test: test `server.origin` config --- .../__tests__/backend-integration.spec.ts | 24 ++++++++++++------- playground/backend-integration/vite.config.js | 8 +++++++ playground/tailwind/vite.config.ts | 5 ---- playground/test-utils.ts | 1 + 4 files changed, 25 insertions(+), 13 deletions(-) diff --git a/playground/backend-integration/__tests__/backend-integration.spec.ts b/playground/backend-integration/__tests__/backend-integration.spec.ts index 5dbfd55177d2d8..42ddabb5013119 100644 --- a/playground/backend-integration/__tests__/backend-integration.spec.ts +++ b/playground/backend-integration/__tests__/backend-integration.spec.ts @@ -1,4 +1,4 @@ -import { describe, expect, test } from 'vitest' +import { describe, expect, test, vi } from 'vitest' import { browserErrors, browserLogs, @@ -8,16 +8,13 @@ import { isServe, listAssets, page, + ports, readManifest, serverLogs, untilBrowserLogAfter, untilUpdated, } from '~utils' -const outerAssetMatch = isBuild - ? /\/dev\/assets\/logo-[-\w]{8}\.png/ - : /\/dev\/@fs\/.+?\/images\/logo\.png/ - test('should have no 404s', () => { browserLogs.forEach((msg) => { expect(msg).not.toMatch('404') @@ -26,9 +23,20 @@ test('should have no 404s', () => { describe('asset imports from js', () => { test('file outside root', async () => { - expect( - await page.textContent('.asset-reference.outside-root .asset-url'), - ).toMatch(outerAssetMatch) + await vi.waitFor(async () => { + const text = await page.textContent( + '.asset-reference.outside-root .asset-url', + ) + console.log({ text }) + if (isBuild) { + expect(text).toMatch(/\/dev\/assets\/logo-[-\w]{8}\.png/) + } else { + expect(text).toMatch( + `http://localhost:${ports['backend-integration']}/dev/@fs`, + ) + expect(text).toMatch(/\/dev\/@fs\/.+?\/images\/logo\.png/) + } + }) }) }) diff --git a/playground/backend-integration/vite.config.js b/playground/backend-integration/vite.config.js index 881eac1a14688e..417c7849b048de 100644 --- a/playground/backend-integration/vite.config.js +++ b/playground/backend-integration/vite.config.js @@ -22,6 +22,14 @@ function BackendIntegrationExample() { entrypoints.push(['bar.css', path.resolve(__dirname, './dir/foo.css')]) return { + server: { + // same port in playground/test-utils.ts + port: 5009, + strictPort: true, + // TODO: shouldn't this be automatically inferred from dev server address? + // (see "boolean or string" discussions in https://github.com/vitejs/vite/pull/4337) + origin: 'http://localhost:5009', + }, build: { manifest: true, outDir, diff --git a/playground/tailwind/vite.config.ts b/playground/tailwind/vite.config.ts index 86521cff913e97..37112cc15ff700 100644 --- a/playground/tailwind/vite.config.ts +++ b/playground/tailwind/vite.config.ts @@ -27,11 +27,6 @@ export default defineConfig({ // to make tests faster minify: false, }, - server: { - // This option caused issues with HMR, - // although it should not affect the build - origin: 'http://localhost:8080', - }, plugins: [ { name: 'delay view', diff --git a/playground/test-utils.ts b/playground/test-utils.ts index f46bc3c95389cf..4666820f850c28 100644 --- a/playground/test-utils.ts +++ b/playground/test-utils.ts @@ -46,6 +46,7 @@ export const ports = { 'css/postcss-plugins-different-dir': 5006, 'css/dynamic-import': 5007, 'css/lightningcss-proxy': 5008, + 'backend-integration': 5009, } export const hmrPorts = { 'optimize-missing-deps': 24680, From 376d4188c7905f754d9cb0a9bae83b6a5f2e632c Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Thu, 15 Aug 2024 12:38:19 +0900 Subject: [PATCH 2/6] chore: no console --- .../backend-integration/__tests__/backend-integration.spec.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/playground/backend-integration/__tests__/backend-integration.spec.ts b/playground/backend-integration/__tests__/backend-integration.spec.ts index 42ddabb5013119..f34963f3c31a14 100644 --- a/playground/backend-integration/__tests__/backend-integration.spec.ts +++ b/playground/backend-integration/__tests__/backend-integration.spec.ts @@ -27,7 +27,6 @@ describe('asset imports from js', () => { const text = await page.textContent( '.asset-reference.outside-root .asset-url', ) - console.log({ text }) if (isBuild) { expect(text).toMatch(/\/dev\/assets\/logo-[-\w]{8}\.png/) } else { From c0cea2aa8873742f13d86e8a75f65abbdb9b2688 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Thu, 15 Aug 2024 13:38:52 +0900 Subject: [PATCH 3/6] test: tweak --- .../__tests__/backend-integration.spec.ts | 9 ++++++++- playground/backend-integration/vite.config.js | 2 +- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/playground/backend-integration/__tests__/backend-integration.spec.ts b/playground/backend-integration/__tests__/backend-integration.spec.ts index f34963f3c31a14..47dbac7eb27992 100644 --- a/playground/backend-integration/__tests__/backend-integration.spec.ts +++ b/playground/backend-integration/__tests__/backend-integration.spec.ts @@ -30,11 +30,18 @@ describe('asset imports from js', () => { if (isBuild) { expect(text).toMatch(/\/dev\/assets\/logo-[-\w]{8}\.png/) } else { + // asset url is prefixed with server.origin expect(text).toMatch( - `http://localhost:${ports['backend-integration']}/dev/@fs`, + `http://localhost:${ports['backend-integration']}/dev/@fs/`, ) expect(text).toMatch(/\/dev\/@fs\/.+?\/images\/logo\.png/) } + + expect( + await page + .locator('.asset-reference.outside-root .asset-preview') + .evaluate((el: HTMLImageElement) => el.naturalWidth > 0), + ).toBe(true) }) }) }) diff --git a/playground/backend-integration/vite.config.js b/playground/backend-integration/vite.config.js index 417c7849b048de..0e991cde392401 100644 --- a/playground/backend-integration/vite.config.js +++ b/playground/backend-integration/vite.config.js @@ -26,7 +26,7 @@ function BackendIntegrationExample() { // same port in playground/test-utils.ts port: 5009, strictPort: true, - // TODO: shouldn't this be automatically inferred from dev server address? + // TODO: should this be automatically inferred from dev server address? // (see "boolean or string" discussions in https://github.com/vitejs/vite/pull/4337) origin: 'http://localhost:5009', }, From 8d1715beea14cd95c1dcbfc4465c706f654780e4 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Fri, 16 Aug 2024 10:16:23 +0900 Subject: [PATCH 4/6] test: tweak --- .../__tests__/backend-integration.spec.ts | 37 +++++++++---------- 1 file changed, 18 insertions(+), 19 deletions(-) diff --git a/playground/backend-integration/__tests__/backend-integration.spec.ts b/playground/backend-integration/__tests__/backend-integration.spec.ts index 47dbac7eb27992..320a16c2b44804 100644 --- a/playground/backend-integration/__tests__/backend-integration.spec.ts +++ b/playground/backend-integration/__tests__/backend-integration.spec.ts @@ -23,26 +23,25 @@ test('should have no 404s', () => { describe('asset imports from js', () => { test('file outside root', async () => { - await vi.waitFor(async () => { - const text = await page.textContent( - '.asset-reference.outside-root .asset-url', - ) - if (isBuild) { - expect(text).toMatch(/\/dev\/assets\/logo-[-\w]{8}\.png/) - } else { - // asset url is prefixed with server.origin - expect(text).toMatch( - `http://localhost:${ports['backend-integration']}/dev/@fs/`, - ) - expect(text).toMatch(/\/dev\/@fs\/.+?\/images\/logo\.png/) - } + // assert valid image src https://github.com/microsoft/playwright/issues/6046#issuecomment-1799585719 + await vi.waitFor(() => + page + .locator('.asset-reference.outside-root .asset-preview') + .evaluate((el: HTMLImageElement) => el.naturalWidth > 0), + ) - expect( - await page - .locator('.asset-reference.outside-root .asset-preview') - .evaluate((el: HTMLImageElement) => el.naturalWidth > 0), - ).toBe(true) - }) + const text = await page.textContent( + '.asset-reference.outside-root .asset-url', + ) + if (isBuild) { + expect(text).toMatch(/\/dev\/assets\/logo-[-\w]{8}\.png/) + } else { + // asset url is prefixed with server.origin + expect(text).toMatch( + `http://localhost:${ports['backend-integration']}/dev/@fs/`, + ) + expect(text).toMatch(/\/dev\/@fs\/.+?\/images\/logo\.png/) + } }) }) From 46700ec577c5beb2967bb73ae6a48974a09b4aba Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Fri, 16 Aug 2024 15:30:02 +0900 Subject: [PATCH 5/6] test: vi.waitUntil --- .../backend-integration/__tests__/backend-integration.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/playground/backend-integration/__tests__/backend-integration.spec.ts b/playground/backend-integration/__tests__/backend-integration.spec.ts index 320a16c2b44804..c6ac1aaf59cb91 100644 --- a/playground/backend-integration/__tests__/backend-integration.spec.ts +++ b/playground/backend-integration/__tests__/backend-integration.spec.ts @@ -24,7 +24,7 @@ test('should have no 404s', () => { describe('asset imports from js', () => { test('file outside root', async () => { // assert valid image src https://github.com/microsoft/playwright/issues/6046#issuecomment-1799585719 - await vi.waitFor(() => + await vi.waitUntil(() => page .locator('.asset-reference.outside-root .asset-preview') .evaluate((el: HTMLImageElement) => el.naturalWidth > 0), From 2e3e98a6e302a96d8135357c4cb4f3b624f86875 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BF=A0=20/=20green?= Date: Tue, 20 Aug 2024 16:30:05 +0900 Subject: [PATCH 6/6] chore: remove TODO comment --- playground/backend-integration/vite.config.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/playground/backend-integration/vite.config.js b/playground/backend-integration/vite.config.js index 0e991cde392401..f0df64975f65e6 100644 --- a/playground/backend-integration/vite.config.js +++ b/playground/backend-integration/vite.config.js @@ -26,8 +26,6 @@ function BackendIntegrationExample() { // same port in playground/test-utils.ts port: 5009, strictPort: true, - // TODO: should this be automatically inferred from dev server address? - // (see "boolean or string" discussions in https://github.com/vitejs/vite/pull/4337) origin: 'http://localhost:5009', }, build: {