From dd7d876f29bcaa6e9a77d8e2a74ac50f78f5f4ee Mon Sep 17 00:00:00 2001 From: Arthur Lu Date: Wed, 16 Nov 2022 16:10:31 -0800 Subject: [PATCH 1/5] add dependencies to package.json, add http-server script to package.json, add simple e2e test in main.e2e.test.js Signed-off-by: Arthur Lu --- package.json | 7 +++-- source/assets/scripts/localStorage.test.js | 9 ++++--- source/assets/scripts/main.e2e.test.js | 31 ++++++++++++++++++++++ 3 files changed, 41 insertions(+), 6 deletions(-) create mode 100644 source/assets/scripts/main.e2e.test.js diff --git a/package.json b/package.json index bd8a69c..9d0267d 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,8 @@ "lint": "eslint '**/*.js'", "fix-style": "eslint --fix **/*.js", "lintHTML": "htmlhint '**/*.html'", - "lintCSS": "stylelint '**/*.css'" + "lintCSS": "stylelint '**/*.css'", + "http-server": "http-server source &" }, "devDependencies": { "eslint": "^8.27.0", @@ -15,6 +16,8 @@ "mocha": "10", "mock-local-storage": "^1.1.23", "stylelint": "14.14.1", - "stylelint-config-standard": "^29.0.0" + "stylelint-config-standard": "^29.0.0", + "puppeteer": "18", + "http-server": "" } } diff --git a/source/assets/scripts/localStorage.test.js b/source/assets/scripts/localStorage.test.js index 65574b8..90ed2b7 100644 --- a/source/assets/scripts/localStorage.test.js +++ b/source/assets/scripts/localStorage.test.js @@ -2,11 +2,12 @@ import {strict as assert} from "node:assert"; import {describe, it, beforeEach} from "mocha"; import {saveReviewsToStorage, getReviewsFromStorage} from "./localStorage.js"; -beforeEach(() => { - localStorage.clear(); -}); - describe("test app localStorage interaction", () => { + + beforeEach(() => { + localStorage.clear(); + }); + it("get after init", () => { assert.deepEqual(getReviewsFromStorage(), []); }); diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js new file mode 100644 index 0000000..2a61fc5 --- /dev/null +++ b/source/assets/scripts/main.e2e.test.js @@ -0,0 +1,31 @@ +import {strict as assert} from "node:assert"; +import {describe, it, beforeEach} from "mocha"; +import puppeteer from 'puppeteer-core'; +import { exit } from "node:process"; + +describe("test App end to end", async () => { + + let browser; + let page; + + beforeEach(async () => { + browser = await puppeteer.launch(); + page = await browser.newPage(); + try{ + await page.goto('http://localhost:8080', {timeout: 1000}); + } + catch (error) { + console.log("❌ failed to connect to localhost webserver on port 8080") + exit(1); + } + }); + + it("page should have correct title", async () => { + assert.strictEqual(await page.title(), "Food Journal"); + }); + + afterEach(async () => { + await page.close(); + await browser.close(); + }); +}); \ No newline at end of file From cbe8da609ce33bbd6b4b3231db8dfa5b32bc0786 Mon Sep 17 00:00:00 2001 From: Arthur Lu Date: Wed, 16 Nov 2022 16:18:35 -0800 Subject: [PATCH 2/5] fix js-unittest.yml to start local server Signed-off-by: Arthur Lu --- .github/workflows/js-unittest.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/workflows/js-unittest.yml b/.github/workflows/js-unittest.yml index 4cb1359..5c07e35 100644 --- a/.github/workflows/js-unittest.yml +++ b/.github/workflows/js-unittest.yml @@ -23,5 +23,7 @@ jobs: uses: actions/checkout@v3 - name: Install dependencies run: sudo npm install + - name: Start local http server + run: sudo npm run http-server - name: Run tests run: sudo npm test \ No newline at end of file From 7abc995ffea2c142f59520c94866f07be1e1fd06 Mon Sep 17 00:00:00 2001 From: Arthur Lu Date: Wed, 16 Nov 2022 16:46:02 -0800 Subject: [PATCH 3/5] fix linting errors Signed-off-by: Arthur Lu --- source/assets/scripts/main.e2e.test.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js index 2a61fc5..a102b53 100644 --- a/source/assets/scripts/main.e2e.test.js +++ b/source/assets/scripts/main.e2e.test.js @@ -1,6 +1,6 @@ import {strict as assert} from "node:assert"; -import {describe, it, beforeEach} from "mocha"; -import puppeteer from 'puppeteer-core'; +import {describe, it, beforeEach, afterEach} from "mocha"; +import puppeteer from "puppeteer-core"; import { exit } from "node:process"; describe("test App end to end", async () => { @@ -12,10 +12,10 @@ describe("test App end to end", async () => { browser = await puppeteer.launch(); page = await browser.newPage(); try{ - await page.goto('http://localhost:8080', {timeout: 1000}); + await page.goto("http://localhost:8080", {timeout: 1000}); } catch (error) { - console.log("❌ failed to connect to localhost webserver on port 8080") + console.log("❌ failed to connect to localhost webserver on port 8080"); exit(1); } }); From d9c28096fd90c6db6c1456d0aa23a712f78e5b50 Mon Sep 17 00:00:00 2001 From: Arthur Lu Date: Wed, 16 Nov 2022 17:41:45 -0800 Subject: [PATCH 4/5] add e2e framework ADR Signed-off-by: Arthur Lu --- specs/adrs/111622-e2etesting-puppeteer.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) create mode 100644 specs/adrs/111622-e2etesting-puppeteer.md diff --git a/specs/adrs/111622-e2etesting-puppeteer.md b/specs/adrs/111622-e2etesting-puppeteer.md new file mode 100644 index 0000000..4a1d3ce --- /dev/null +++ b/specs/adrs/111622-e2etesting-puppeteer.md @@ -0,0 +1,19 @@ +# Use puppeteer for JS unit testing framework + +- Status: accept +- Deciders: Arthur Lu, Marc Reta +- Date: 11 / 16 / 22 + +## Decision Drivers + +- Need end to end testing framework which runs headlessly and quickly +- Framework should integrate well with Mocha, the existing unit testing framework +- Framework should be easy to implement end to end tests with + +## Considered Options +- puppeteer +- selenium-webdriver + +## Decision Outcome + +Chosen Option: Puppeteer for its ease of use with mocha. \ No newline at end of file From 0ebf9f8a20f024c4d6e5cf468c2585562a2dee34 Mon Sep 17 00:00:00 2001 From: Arthur Lu Date: Thu, 17 Nov 2022 11:38:05 -0800 Subject: [PATCH 5/5] fix typo in package.json Signed-off-by: Arthur Lu --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9d0267d..5da1afa 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ "fix-style": "eslint --fix **/*.js", "lintHTML": "htmlhint '**/*.html'", "lintCSS": "stylelint '**/*.css'", - "http-server": "http-server source &" + "http-server": "http-server source" }, "devDependencies": { "eslint": "^8.27.0",