From d79c19be1455275de7b9390ec3583b2d36a9dad5 Mon Sep 17 00:00:00 2001 From: Hannah Zhu Date: Fri, 17 Jun 2022 00:18:18 -0700 Subject: [PATCH 01/11] added playwright test and github actions --- .github/workflows/playwright.yml | 41 ++++++++++++ .gitignore | 4 ++ package-lock.json | 74 +++++++++++++++++++++ package.json | 24 +++++++ playwright.config.ts | 107 +++++++++++++++++++++++++++++++ tests/playwright.spec.ts | 7 ++ 6 files changed, 257 insertions(+) create mode 100644 .github/workflows/playwright.yml create mode 100644 .gitignore create mode 100644 package-lock.json create mode 100644 package.json create mode 100644 playwright.config.ts create mode 100644 tests/playwright.spec.ts diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml new file mode 100644 index 00000000..803acdc5 --- /dev/null +++ b/.github/workflows/playwright.yml @@ -0,0 +1,41 @@ +# This is a basic workflow to help you get started with Actions + +name: Playwright Tests + +# Controls when the workflow will run +on: + # Triggers the workflow on push or pull request events but only for the "main" branch + push: + branches: [ "main" ] + pull_request: + branches: [ "main" ] + schedule: + # nightly + - cron: '0 0 * * *' + + # Allows you to run this workflow manually from the Actions tab + workflow_dispatch: + +# A workflow run is made up of one or more jobs that can run sequentially or in parallel +jobs: + # This workflow contains a single job called "build" + build: + # The type of runner that the job will run on + runs-on: ubuntu-latest + + strategy: + matrix: + node-version: [14.x, 16.x] + # See supported Node.js release schedule at https://nodejs.org/en/about/releases/ + + steps: + - uses: actions/checkout@v2 + - uses: actions/setup-node@v2 + with: + node-version: '14' + - name: Install dependencies + run: npm ci + - name: Install Playwright + run: npx playwright install --with-deps + - name: Run playwright tests + run: npm run playwright_test diff --git a/.gitignore b/.gitignore new file mode 100644 index 00000000..75e854d8 --- /dev/null +++ b/.gitignore @@ -0,0 +1,4 @@ +node_modules/ +/test-results/ +/playwright-report/ +/playwright/.cache/ diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 00000000..649ea504 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,74 @@ +{ + "name": "vanilla-basic", + "version": "1.0.0", + "lockfileVersion": 2, + "requires": true, + "packages": { + "": { + "name": "vanilla-basic", + "version": "1.0.0", + "license": "ISC", + "devDependencies": { + "@playwright/test": "^1.22.2" + } + }, + "node_modules/@playwright/test": { + "version": "1.22.2", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.22.2.tgz", + "integrity": "sha512-cCl96BEBGPtptFz7C2FOSN3PrTnJ3rPpENe+gYCMx4GNNDlN4tmo2D89y13feGKTMMAIVrXfSQ/UmaQKLy1XLA==", + "dev": true, + "dependencies": { + "@types/node": "*", + "playwright-core": "1.22.2" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=14" + } + }, + "node_modules/@types/node": { + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.0.0.tgz", + "integrity": "sha512-cHlGmko4gWLVI27cGJntjs/Sj8th9aYwplmZFwmmgYQQvL5NUsgVJG7OddLvNfLqYS31KFN0s3qlaD9qCaxACA==", + "dev": true + }, + "node_modules/playwright-core": { + "version": "1.22.2", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.22.2.tgz", + "integrity": "sha512-w/hc/Ld0RM4pmsNeE6aL/fPNWw8BWit2tg+TfqJ3+p59c6s3B6C8mXvXrIPmfQEobkcFDc+4KirNzOQ+uBSP1Q==", + "dev": true, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=14" + } + } + }, + "dependencies": { + "@playwright/test": { + "version": "1.22.2", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.22.2.tgz", + "integrity": "sha512-cCl96BEBGPtptFz7C2FOSN3PrTnJ3rPpENe+gYCMx4GNNDlN4tmo2D89y13feGKTMMAIVrXfSQ/UmaQKLy1XLA==", + "dev": true, + "requires": { + "@types/node": "*", + "playwright-core": "1.22.2" + } + }, + "@types/node": { + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.0.0.tgz", + "integrity": "sha512-cHlGmko4gWLVI27cGJntjs/Sj8th9aYwplmZFwmmgYQQvL5NUsgVJG7OddLvNfLqYS31KFN0s3qlaD9qCaxACA==", + "dev": true + }, + "playwright-core": { + "version": "1.22.2", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.22.2.tgz", + "integrity": "sha512-w/hc/Ld0RM4pmsNeE6aL/fPNWw8BWit2tg+TfqJ3+p59c6s3B6C8mXvXrIPmfQEobkcFDc+4KirNzOQ+uBSP1Q==", + "dev": true + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 00000000..6214929f --- /dev/null +++ b/package.json @@ -0,0 +1,24 @@ +{ + "name": "vanilla-basic", + "version": "1.0.0", + "description": "", + "main": "index.js", + "scripts": { + "start": "sirv ./src public --cors --single --no-clear --port 8000", + "playwright_test" : "playwright test" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/HannahZhuSWE/vanilla-basic.git" + }, + "keywords": [], + "author": "", + "license": "ISC", + "bugs": { + "url": "https://github.com/HannahZhuSWE/vanilla-basic/issues" + }, + "homepage": "https://github.com/HannahZhuSWE/vanilla-basic#readme", + "devDependencies": { + "@playwright/test": "^1.22.2" + } +} diff --git a/playwright.config.ts b/playwright.config.ts new file mode 100644 index 00000000..6df7c253 --- /dev/null +++ b/playwright.config.ts @@ -0,0 +1,107 @@ +import type { PlaywrightTestConfig } from '@playwright/test'; +import { devices } from '@playwright/test'; + +/** + * Read environment variables from file. + * https://github.com/motdotla/dotenv + */ +// require('dotenv').config(); + +/** + * See https://playwright.dev/docs/test-configuration. + */ +const config: PlaywrightTestConfig = { + testDir: './tests', + /* Maximum time one test can run for. */ + timeout: 30 * 1000, + expect: { + /** + * Maximum time expect() should wait for the condition to be met. + * For example in `await expect(locator).toHaveText();` + */ + timeout: 5000 + }, + /* Run tests in files in parallel */ + fullyParallel: true, + /* Fail the build on CI if you accidentally left test.only in the source code. */ + forbidOnly: !!process.env.CI, + /* Retry on CI only */ + retries: process.env.CI ? 2 : 0, + /* Opt out of parallel tests on CI. */ + workers: process.env.CI ? 1 : undefined, + /* Reporter to use. See https://playwright.dev/docs/test-reporters */ + reporter: 'html', + /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ + use: { + /* 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:8000', + + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + }, + + /* Configure projects for major browsers */ + projects: [ + { + name: 'chromium', + use: { + ...devices['Desktop Chrome'], + }, + }, + + { + name: 'firefox', + use: { + ...devices['Desktop Firefox'], + }, + }, + + { + name: 'webkit', + use: { + ...devices['Desktop Safari'], + }, + }, + + /* Test against mobile viewports. */ + // { + // name: 'Mobile Chrome', + // use: { + // ...devices['Pixel 5'], + // }, + // }, + // { + // name: 'Mobile Safari', + // use: { + // ...devices['iPhone 12'], + // }, + // }, + + /* Test against branded browsers. */ + // { + // name: 'Microsoft Edge', + // use: { + // channel: 'msedge', + // }, + // }, + // { + // name: 'Google Chrome', + // use: { + // channel: 'chrome', + // }, + // }, + ], + + /* Folder for test artifacts such as screenshots, videos, traces, etc. */ + // outputDir: 'test-results/', + + /* Run your local dev server before starting the tests */ + webServer: { + command: 'npm run start', + port: 8000, + } +}; + +export default config; diff --git a/tests/playwright.spec.ts b/tests/playwright.spec.ts new file mode 100644 index 00000000..a19c89de --- /dev/null +++ b/tests/playwright.spec.ts @@ -0,0 +1,7 @@ +import { test, expect } from '@playwright/test'; + +test('basic test', async ({ page }) => { + await page.goto('/'); + await page.waitForSelector('h1'); + await expect(page.locator('h1')).toContainText('Vanilla JavaScript App'); +}) \ No newline at end of file From c51547d6e0ad46b6f016dc5be1618cfbe807a342 Mon Sep 17 00:00:00 2001 From: Hannah Zhu Date: Fri, 17 Jun 2022 00:26:02 -0700 Subject: [PATCH 02/11] added install sirv to github action --- .github/workflows/playwright.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index 803acdc5..93cc2002 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -37,5 +37,7 @@ jobs: run: npm ci - name: Install Playwright run: npx playwright install --with-deps + - name: Install Sirv + run: npm install --g sirv-cli - name: Run playwright tests run: npm run playwright_test From 9c3f9cb6d9dff8fb3818b3eb8c164e28c0e3cc7c Mon Sep 17 00:00:00 2001 From: Hannah Zhu Date: Wed, 22 Jun 2022 08:38:54 -0700 Subject: [PATCH 03/11] added readme file and reverted start script --- package.json | 2 +- tests/Test.README.md | 3 +++ 2 files changed, 4 insertions(+), 1 deletion(-) create mode 100644 tests/Test.README.md diff --git a/package.json b/package.json index 6214929f..b6053ecb 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "description": "", "main": "index.js", "scripts": { - "start": "sirv ./src public --cors --single --no-clear --port 8000", + "start": "sirv ./src public", "playwright_test" : "playwright test" }, "repository": { diff --git a/tests/Test.README.md b/tests/Test.README.md new file mode 100644 index 00000000..35b863bd --- /dev/null +++ b/tests/Test.README.md @@ -0,0 +1,3 @@ +# Testing + +To run playwright tests run `npm run playwright_test`. \ No newline at end of file From c5c9b597e0558a8688bae63ca75c20b952c6e372 Mon Sep 17 00:00:00 2001 From: Hannah Zhu Date: Wed, 22 Jun 2022 08:43:21 -0700 Subject: [PATCH 04/11] changed start script and github links --- package.json | 8 ++++---- tests/Test.README.md | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index b6053ecb..da74a406 100644 --- a/package.json +++ b/package.json @@ -4,20 +4,20 @@ "description": "", "main": "index.js", "scripts": { - "start": "sirv ./src public", + "start": "sirv ./src public --cors --single --no-clear --port 8000", "playwright_test" : "playwright test" }, "repository": { "type": "git", - "url": "git+https://github.com/HannahZhuSWE/vanilla-basic.git" + "url": "git+https://github.com/staticwebdev/vanilla-basic.git" }, "keywords": [], "author": "", "license": "ISC", "bugs": { - "url": "https://github.com/HannahZhuSWE/vanilla-basic/issues" + "url": "https://github.com/staticwebdev/vanilla-basic/issues" }, - "homepage": "https://github.com/HannahZhuSWE/vanilla-basic#readme", + "homepage": "https://github.com/staticwebdev/vanilla-basic#readme", "devDependencies": { "@playwright/test": "^1.22.2" } diff --git a/tests/Test.README.md b/tests/Test.README.md index 35b863bd..39b03c0a 100644 --- a/tests/Test.README.md +++ b/tests/Test.README.md @@ -1,3 +1,3 @@ # Testing -To run playwright tests run `npm run playwright_test`. \ No newline at end of file +To run playwright tests run `npm run playwright_test`. Note for the purposes of running playwright tests a start script was made. \ No newline at end of file From 53c9b9d9d30a78cd8f85acf527254897e9369ddd Mon Sep 17 00:00:00 2001 From: HannahZhuSWE <76960450+HannahZhuSWE@users.noreply.github.com> Date: Wed, 22 Jun 2022 08:50:53 -0700 Subject: [PATCH 05/11] Update Test.README.md --- tests/Test.README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/Test.README.md b/tests/Test.README.md index 39b03c0a..a9ffe05a 100644 --- a/tests/Test.README.md +++ b/tests/Test.README.md @@ -1,3 +1,3 @@ # Testing -To run playwright tests run `npm run playwright_test`. Note for the purposes of running playwright tests a start script was made. \ No newline at end of file +To run playwright tests run `npm run playwright_test`. Note for the purposes of running playwright tests a package.json (and start script) was made. From 29f093bd2bbb8e0ca5ce5d5e9108cdffad1bb0ab Mon Sep 17 00:00:00 2001 From: Hannah Zhu Date: Wed, 22 Jun 2022 09:39:04 -0700 Subject: [PATCH 06/11] removed links from package.json and commented out stuff from playwright config --- package.json | 13 ------------- playwright.config.ts | 31 ------------------------------- 2 files changed, 44 deletions(-) diff --git a/package.json b/package.json index da74a406..2738bfb3 100644 --- a/package.json +++ b/package.json @@ -1,23 +1,10 @@ { "name": "vanilla-basic", "version": "1.0.0", - "description": "", - "main": "index.js", "scripts": { "start": "sirv ./src public --cors --single --no-clear --port 8000", "playwright_test" : "playwright test" }, - "repository": { - "type": "git", - "url": "git+https://github.com/staticwebdev/vanilla-basic.git" - }, - "keywords": [], - "author": "", - "license": "ISC", - "bugs": { - "url": "https://github.com/staticwebdev/vanilla-basic/issues" - }, - "homepage": "https://github.com/staticwebdev/vanilla-basic#readme", "devDependencies": { "@playwright/test": "^1.22.2" } diff --git a/playwright.config.ts b/playwright.config.ts index 6df7c253..3d58f3e9 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -64,39 +64,8 @@ const config: PlaywrightTestConfig = { ...devices['Desktop Safari'], }, }, - - /* Test against mobile viewports. */ - // { - // name: 'Mobile Chrome', - // use: { - // ...devices['Pixel 5'], - // }, - // }, - // { - // name: 'Mobile Safari', - // use: { - // ...devices['iPhone 12'], - // }, - // }, - - /* Test against branded browsers. */ - // { - // name: 'Microsoft Edge', - // use: { - // channel: 'msedge', - // }, - // }, - // { - // name: 'Google Chrome', - // use: { - // channel: 'chrome', - // }, - // }, ], - /* Folder for test artifacts such as screenshots, videos, traces, etc. */ - // outputDir: 'test-results/', - /* Run your local dev server before starting the tests */ webServer: { command: 'npm run start', From 06c242f89d2a06003606e571fb7b33a211157be7 Mon Sep 17 00:00:00 2001 From: HannahZhuSWE <76960450+HannahZhuSWE@users.noreply.github.com> Date: Wed, 29 Jun 2022 14:53:00 -0700 Subject: [PATCH 07/11] updated with recommendations --- .github/workflows/playwright.yml | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index 93cc2002..8f45fcee 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -25,14 +25,12 @@ jobs: strategy: matrix: - node-version: [14.x, 16.x] + node-version: [14.x, 16.x, 18.x] # See supported Node.js release schedule at https://nodejs.org/en/about/releases/ steps: - - uses: actions/checkout@v2 - - uses: actions/setup-node@v2 - with: - node-version: '14' + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 - name: Install dependencies run: npm ci - name: Install Playwright From 5c18442a475f50dcf61f7ec5400a64a98a9fd89f Mon Sep 17 00:00:00 2001 From: HannahZhuSWE <76960450+HannahZhuSWE@users.noreply.github.com> Date: Wed, 29 Jun 2022 15:19:32 -0700 Subject: [PATCH 08/11] changed pull_request to pull_request_target --- .github/workflows/playwright.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index 8f45fcee..f379da5f 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -7,7 +7,7 @@ on: # Triggers the workflow on push or pull request events but only for the "main" branch push: branches: [ "main" ] - pull_request: + pull_request_target: branches: [ "main" ] schedule: # nightly From a1905aa12f98c073ddb3d8c4e9125809e55824a8 Mon Sep 17 00:00:00 2001 From: HannahZhuSWE <76960450+HannahZhuSWE@users.noreply.github.com> Date: Wed, 29 Jun 2022 15:24:03 -0700 Subject: [PATCH 09/11] change github action to run on pull_request --- .github/workflows/playwright.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index f379da5f..8f45fcee 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -7,7 +7,7 @@ on: # Triggers the workflow on push or pull request events but only for the "main" branch push: branches: [ "main" ] - pull_request_target: + pull_request: branches: [ "main" ] schedule: # nightly From 2567d30c8d651e29fc01c20ff33fcc2d63631962 Mon Sep 17 00:00:00 2001 From: HannahZhuSWE <76960450+HannahZhuSWE@users.noreply.github.com> Date: Thu, 30 Jun 2022 11:34:50 -0700 Subject: [PATCH 10/11] updated github action to run on all branches --- .github/workflows/playwright.yml | 2 -- 1 file changed, 2 deletions(-) diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index 8f45fcee..5e9e0d93 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -6,9 +6,7 @@ name: Playwright Tests on: # Triggers the workflow on push or pull request events but only for the "main" branch push: - branches: [ "main" ] pull_request: - branches: [ "main" ] schedule: # nightly - cron: '0 0 * * *' From c74605e44f9f0a2d9ca46b86c388fb251151d477 Mon Sep 17 00:00:00 2001 From: HannahZhuSWE <76960450+HannahZhuSWE@users.noreply.github.com> Date: Thu, 30 Jun 2022 13:18:43 -0700 Subject: [PATCH 11/11] updated comments and job name in github action --- .github/workflows/playwright.yml | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index 5e9e0d93..266201f3 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -1,10 +1,8 @@ -# This is a basic workflow to help you get started with Actions - name: Playwright Tests # Controls when the workflow will run on: - # Triggers the workflow on push or pull request events but only for the "main" branch + # Triggers the workflow on push or pull request and nightly push: pull_request: schedule: @@ -14,11 +12,9 @@ on: # Allows you to run this workflow manually from the Actions tab workflow_dispatch: -# A workflow run is made up of one or more jobs that can run sequentially or in parallel jobs: - # This workflow contains a single job called "build" - build: - # The type of runner that the job will run on + playwright_tests: + # Runs on an ubuntu runner runs-on: ubuntu-latest strategy: