From 5b98f9b2cc65d1da6a879ef47f89be58e27ecbac Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Wed, 19 Oct 2022 20:33:52 +0800 Subject: [PATCH 1/8] refactor!: use preview server for playwright testing --- template/config/playwright/playwright.config.js | 6 +++--- template/config/playwright/playwright.config.ts | 6 +++--- utils/generateReadme.ts | 3 +++ 3 files changed, 9 insertions(+), 6 deletions(-) diff --git a/template/config/playwright/playwright.config.js b/template/config/playwright/playwright.config.js index 0fadfcd12..e52e5464e 100644 --- a/template/config/playwright/playwright.config.js +++ b/template/config/playwright/playwright.config.js @@ -35,7 +35,7 @@ const config = { /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ actionTimeout: 0, /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: 'http://localhost:5173', + baseURL: 'http://localhost:4173', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -99,8 +99,8 @@ const config = { /* Run your local dev server before starting the tests */ webServer: { - command: 'npm run dev', - port: 5173, + command: 'npm run preview', + port: 4173, reuseExistingServer: !process.env.CI } } diff --git a/template/config/playwright/playwright.config.ts b/template/config/playwright/playwright.config.ts index 5bb8d7950..84ea9ea98 100644 --- a/template/config/playwright/playwright.config.ts +++ b/template/config/playwright/playwright.config.ts @@ -34,7 +34,7 @@ const config: PlaywrightTestConfig = { /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ actionTimeout: 0, /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: 'http://localhost:5173', + baseURL: 'http://localhost:4173', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -98,8 +98,8 @@ const config: PlaywrightTestConfig = { /* Run your local dev server before starting the tests */ webServer: { - command: 'npm run dev', - port: 5173, + command: 'npm run preview', + port: 4173, reuseExistingServer: !process.env.CI } } diff --git a/utils/generateReadme.ts b/utils/generateReadme.ts index 9f5d997a0..bc4ae7605 100644 --- a/utils/generateReadme.ts +++ b/utils/generateReadme.ts @@ -99,6 +99,9 @@ ${commandFor('test:e2e')} # or \`${commandFor('test:e2e:ci')}\` for headless tes # Install browsers for the first run npx playwright install +# Must build the project before end-to-end testing +${commandFor('build')} + # Runs the end-to-end tests ${commandFor('test:e2e')} # Runs the tests only on Chromium From 55f434ba8dcc63d027d69e693919c35fc08ed4cd Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Thu, 20 Oct 2022 17:12:47 +0800 Subject: [PATCH 2/8] feat!: use dev server by default and preview server on CI --- template/config/playwright/playwright.config.js | 10 +++++++--- template/config/playwright/playwright.config.ts | 10 +++++++--- 2 files changed, 14 insertions(+), 6 deletions(-) diff --git a/template/config/playwright/playwright.config.js b/template/config/playwright/playwright.config.js index e52e5464e..1494d1171 100644 --- a/template/config/playwright/playwright.config.js +++ b/template/config/playwright/playwright.config.js @@ -35,7 +35,7 @@ const config = { /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ actionTimeout: 0, /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: 'http://localhost:4173', + baseURL: 'http://localhost:5173', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -99,8 +99,12 @@ const config = { /* Run your local dev server before starting the tests */ webServer: { - command: 'npm run preview', - port: 4173, + /** + * Use the dev server by default for faster feedback loop. + * Use the preview server on CI for more realistic testing. + */ + command: process.env.CI ? 'npm run preview --port 5173' : 'npm run dev', + port: 5173, reuseExistingServer: !process.env.CI } } diff --git a/template/config/playwright/playwright.config.ts b/template/config/playwright/playwright.config.ts index 84ea9ea98..5cef696f7 100644 --- a/template/config/playwright/playwright.config.ts +++ b/template/config/playwright/playwright.config.ts @@ -34,7 +34,7 @@ const config: PlaywrightTestConfig = { /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ actionTimeout: 0, /* Base URL to use in actions like `await page.goto('/')`. */ - baseURL: 'http://localhost:4173', + baseURL: 'http://localhost:5173', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', @@ -98,8 +98,12 @@ const config: PlaywrightTestConfig = { /* Run your local dev server before starting the tests */ webServer: { - command: 'npm run preview', - port: 4173, + /** + * Use the dev server by default for faster feedback loop. + * Use the preview server on CI for more realistic testing. + */ + command: process.env.CI ? 'npm run preview --port 5173' : 'npm run dev', + port: 5173, reuseExistingServer: !process.env.CI } } From e8d86d60efeb2d7de3e8383ea898f9b456dfb82e Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Thu, 20 Oct 2022 18:49:56 +0800 Subject: [PATCH 3/8] fix: remove the explicit `--port` argument I think it is not very useful unless we use `--strictPort` here, and keeping it makes it harder for us to customize the port number on command line. --- template/base/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/base/package.json b/template/base/package.json index e89a1dad8..abc37add6 100644 --- a/template/base/package.json +++ b/template/base/package.json @@ -2,7 +2,7 @@ "scripts": { "dev": "vite", "build": "vite build", - "preview": "vite preview --port 4173" + "preview": "vite preview" }, "dependencies": { "vue": "^3.2.40" From 4c399f6f817063bea7ef4c333c28d33847894be9 Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Thu, 20 Oct 2022 18:51:27 +0800 Subject: [PATCH 4/8] docs: update the documentation to note that only CI environment needs build --- utils/generateReadme.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/utils/generateReadme.ts b/utils/generateReadme.ts index bc4ae7605..5b9eb0e71 100644 --- a/utils/generateReadme.ts +++ b/utils/generateReadme.ts @@ -99,7 +99,7 @@ ${commandFor('test:e2e')} # or \`${commandFor('test:e2e:ci')}\` for headless tes # Install browsers for the first run npx playwright install -# Must build the project before end-to-end testing +# When testing on CI, must build the project first ${commandFor('build')} # Runs the end-to-end tests From 41b78cf8a7057bfc5e1d6e6270cdadf6271db64f Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Thu, 20 Oct 2022 18:52:53 +0800 Subject: [PATCH 5/8] fix: correctly pass additional arguments to `npm run` --- template/config/playwright/playwright.config.js | 2 +- template/config/playwright/playwright.config.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/template/config/playwright/playwright.config.js b/template/config/playwright/playwright.config.js index 1494d1171..b373d27e9 100644 --- a/template/config/playwright/playwright.config.js +++ b/template/config/playwright/playwright.config.js @@ -103,7 +103,7 @@ const config = { * Use the dev server by default for faster feedback loop. * Use the preview server on CI for more realistic testing. */ - command: process.env.CI ? 'npm run preview --port 5173' : 'npm run dev', + command: process.env.CI ? 'npm run preview -- --port 5173' : 'npm run dev', port: 5173, reuseExistingServer: !process.env.CI } diff --git a/template/config/playwright/playwright.config.ts b/template/config/playwright/playwright.config.ts index 5cef696f7..8c6608256 100644 --- a/template/config/playwright/playwright.config.ts +++ b/template/config/playwright/playwright.config.ts @@ -102,7 +102,7 @@ const config: PlaywrightTestConfig = { * Use the dev server by default for faster feedback loop. * Use the preview server on CI for more realistic testing. */ - command: process.env.CI ? 'npm run preview --port 5173' : 'npm run dev', + command: process.env.CI ? 'npm run preview -- --port 5173' : 'npm run dev', port: 5173, reuseExistingServer: !process.env.CI } From 4f423c4267948de9c13ef3642a2bb3572083c96c Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Thu, 20 Oct 2022 23:44:14 +0800 Subject: [PATCH 6/8] refactor: use the `vite` command directly to simplify argument passing As `npm` and `npx` add `./node_modules/.bin` to `$PATH`, the `vite` command should be available when playwright is running. (Not sure if this works on Windows, let's wait and see the CI results.) --- template/config/playwright/playwright.config.js | 2 +- template/config/playwright/playwright.config.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/template/config/playwright/playwright.config.js b/template/config/playwright/playwright.config.js index b373d27e9..1c1ea7cc0 100644 --- a/template/config/playwright/playwright.config.js +++ b/template/config/playwright/playwright.config.js @@ -103,7 +103,7 @@ const config = { * Use the dev server by default for faster feedback loop. * Use the preview server on CI for more realistic testing. */ - command: process.env.CI ? 'npm run preview -- --port 5173' : 'npm run dev', + command: process.env.CI ? 'vite preview --port 5173' : 'vite dev', port: 5173, reuseExistingServer: !process.env.CI } diff --git a/template/config/playwright/playwright.config.ts b/template/config/playwright/playwright.config.ts index 8c6608256..44f343ed5 100644 --- a/template/config/playwright/playwright.config.ts +++ b/template/config/playwright/playwright.config.ts @@ -102,7 +102,7 @@ const config: PlaywrightTestConfig = { * Use the dev server by default for faster feedback loop. * Use the preview server on CI for more realistic testing. */ - command: process.env.CI ? 'npm run preview -- --port 5173' : 'npm run dev', + command: process.env.CI ? 'vite preview --port 5173' : 'vite dev', port: 5173, reuseExistingServer: !process.env.CI } From c3e7e1f762995344978ffa714c01b8b7f63a1ef7 Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Fri, 21 Oct 2022 00:18:52 +0800 Subject: [PATCH 7/8] fix: correctly passing additional arguments to yarn/pnpm --- utils/generateReadme.ts | 9 +++++---- utils/getCommand.ts | 10 ++++++++-- 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/utils/generateReadme.ts b/utils/generateReadme.ts index 5b9eb0e71..bbebc131a 100644 --- a/utils/generateReadme.ts +++ b/utils/generateReadme.ts @@ -25,7 +25,8 @@ export default function generateReadme({ needsVitest, needsEslint }) { - const commandFor = (scriptName) => getCommand(packageManager, scriptName) + const commandFor = (scriptName: string, args?: string) => + getCommand(packageManager, scriptName, args) let readme = `# ${projectName} @@ -105,11 +106,11 @@ ${commandFor('build')} # Runs the end-to-end tests ${commandFor('test:e2e')} # Runs the tests only on Chromium -${commandFor('test:e2e -- --project=chromium')} +${commandFor('test:e2e', '--project=chromium')} # Runs the tests of a specific file -${commandFor('test:e2e -- tests/example.spec.ts')} +${commandFor('test:e2e', 'tests/example.spec.ts')} # Runs the tests in debug mode -${commandFor('test:e2e -- --debug')} +${commandFor('test:e2e', '--debug')} \`\`\` ` } diff --git a/utils/getCommand.ts b/utils/getCommand.ts index 96d4976f7..ea3a4e198 100644 --- a/utils/getCommand.ts +++ b/utils/getCommand.ts @@ -1,7 +1,13 @@ -export default function getCommand(packageManager, scriptName) { +export default function getCommand(packageManager: string, scriptName: string, args?: string) { if (scriptName === 'install') { return packageManager === 'yarn' ? 'yarn' : `${packageManager} install` } - return packageManager === 'npm' ? `npm run ${scriptName}` : `${packageManager} ${scriptName}` + if (args) { + return packageManager === 'npm' + ? `npm run ${scriptName} -- ${args}` + : `${packageManager} ${scriptName} ${args}` + } else { + return packageManager === 'npm' ? `npm run ${scriptName}` : `${packageManager} ${scriptName}` + } } From 3bf4f5ea3dcf1ab6cc4d4206fc05e186f1203c61 Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Fri, 21 Oct 2022 13:59:26 +0800 Subject: [PATCH 8/8] chore: add comments about reusing dev server Co-authored-by: Max Schmitt --- template/config/playwright/playwright.config.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/template/config/playwright/playwright.config.ts b/template/config/playwright/playwright.config.ts index 44f343ed5..333a4dc02 100644 --- a/template/config/playwright/playwright.config.ts +++ b/template/config/playwright/playwright.config.ts @@ -101,6 +101,7 @@ const config: PlaywrightTestConfig = { /** * Use the dev server by default for faster feedback loop. * Use the preview server on CI for more realistic testing. + Playwright will re-use the local server if there is already a dev-server running. */ command: process.env.CI ? 'vite preview --port 5173' : 'vite dev', port: 5173, pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy