Skip to content

refactor!: run cypress headlessly by default; add test:*:dev commands #183

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Oct 21, 2022
Merged

refactor!: run cypress headlessly by default; add test:*:dev commands #183

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5edce77
fix: remove the explicit `--port` argument
haoqunjiang Oct 20, 2022
833757a
refactor!: run cypress headlessly by default; add `test:*:dev` commands
haoqunjiang Oct 20, 2022
7743afb
test: update test script as the script name changes
haoqunjiang Oct 20, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 6 additions & 24 deletions scripts/test.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,39 +19,21 @@ await $`pnpm install`

for (const projectName of projects) {
cd(path.resolve(playgroundDir, projectName))

if (projectName.includes('vitest')) {
console.log(`Running unit tests in ${projectName}`)
await $`pnpm test:unit`
}

cd(path.resolve(playgroundDir, projectName))

const packageJSON = require(path.resolve(playgroundDir, projectName, 'package.json'));

console.log(`Building ${projectName}`)
await $`pnpm build`

if ('cypress' in packageJSON.devDependencies) {
console.log(`Running e2e tests in ${projectName}`)
await $`pnpm test:e2e:ci`
}

if ('@playwright/test' in packageJSON.devDependencies) {
await $`pnpm playwright install --with-deps`
}

if ('test:e2e' in packageJSON.scripts) {
console.log(`Running e2e tests in ${projectName}`)
await $`pnpm test:e2e`
}

if ('test:unit:ci' in packageJSON.scripts) {
// Without Vitest, the project will use Cypress Component Testing for unit testing
// Cypress Component Testing is flaky in CI environment, so we need to tolerate the errors.
try {
await $`pnpm test:unit:ci`
} catch (e) {
console.error(`Component Testing in ${projectName} fails:`)
console.error(e)
process.exit(1)
}
} else if ('test:unit' in packageJSON.scripts) {
if ('test:unit' in packageJSON.scripts) {
console.log(`Running unit tests in ${projectName}`)
await $`pnpm test:unit`
}
Expand Down
2 changes: 1 addition & 1 deletion template/base/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview --port 4173"
"preview": "vite preview"
},
"dependencies": {
"vue": "^3.2.40"
Expand Down
4 changes: 2 additions & 2 deletions template/config/cypress-ct/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"scripts": {
"test:unit": "cypress open --component",
"test:unit:ci": "cypress run --component --quiet --reporter spec"
"test:unit": "cypress run --component",
"test:unit:dev": "cypress open --component"
},
"dependencies": {
"vue": "^3.2.40"
Expand Down
4 changes: 2 additions & 2 deletions template/config/cypress/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"scripts": {
"test:e2e": "start-server-and-test preview http://localhost:4173/ 'cypress open --e2e'",
"test:e2e:ci": "start-server-and-test preview http://localhost:4173/ 'cypress run --e2e'"
"test:e2e": "start-server-and-test preview :4173 'cypress run --e2e'",
"test:e2e:dev": "start-server-and-test 'vite dev --port 4173' :4173 'cypress open --e2e'"
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I chose to force the dev server to run on 4173 instead of 5173 as in the playwright PR #182 because start-server-and-test doesn't have an option like reuseExistingServer, therefore has a higher chance of port collisions during dev.

},
"devDependencies": {
"cypress": "^10.10.0",
Expand Down
13 changes: 11 additions & 2 deletions utils/generateReadme.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ ${commandFor('test:unit')}
### Run Headed Component Tests with [Cypress Component Testing](https://on.cypress.io/component)

\`\`\`sh
${commandFor('test:unit')} # or \`${commandFor('test:unit:ci')}\` for headless testing
${commandFor('test:unit:dev')} # or \`${commandFor('test:unit')}\` for headless testing
\`\`\`
`
}
Expand All @@ -84,9 +84,18 @@ ${commandFor('test:unit')} # or \`${commandFor('test:unit:ci')}\` for headless t
npmScriptsDescriptions += `
### Run End-to-End Tests with [Cypress](https://www.cypress.io/)

\`\`\`sh
${commandFor('test:e2e:dev')}
\`\`\`

This runs the end-to-end tests against the Vite development server.
It is much faster than the production build.

But it's still recommended to test the production build with \`test:e2e\` before deploying (e.g. in CI environments):

\`\`\`sh
${commandFor('build')}
${commandFor('test:e2e')} # or \`${commandFor('test:e2e:ci')}\` for headless testing
${commandFor('test:e2e')}
\`\`\`
`
}
Expand Down