From d0ec2a98b1f3d08e7600f9db3cc4a495d2860938 Mon Sep 17 00:00:00 2001 From: Mark Tyers Date: Mon, 4 Nov 2019 17:21:49 +0000 Subject: [PATCH 1/4] example of bug --- .../cucumber/features/add.feature | 29 +++++++++++++++++++ .../cucumber/features/add_one.feature | 11 ------- .../cucumber/steps/todo.steps.js | 26 ++++++++++++++++- .../todo/acceptance tests/ui.test.js | 10 +++++-- exercises/03_acceptance/todo/package.json | 7 +++-- 5 files changed, 67 insertions(+), 16 deletions(-) create mode 100644 exercises/03_acceptance/cucumber/features/add.feature delete mode 100644 exercises/03_acceptance/cucumber/features/add_one.feature diff --git a/exercises/03_acceptance/cucumber/features/add.feature b/exercises/03_acceptance/cucumber/features/add.feature new file mode 100644 index 0000000..bdd934f --- /dev/null +++ b/exercises/03_acceptance/cucumber/features/add.feature @@ -0,0 +1,29 @@ +Feature: Adding Items + The user should be able to add items to the list. + + Scenario: add single item + Given The browser is open on the home page + When I enter "bread" in the "item" field + When I enter "42" in the "qty" field + When I click on the submit button + Then the heading should be "ToDo List" + Then take a screenshot called "one_item" + Then the list should contain "1" rows + Then the list should contain a single entry for "bread" + Then the item should be "bread" + Then the "bread" quantity should be "42" + + Scenario: add multiple items + Given The browser is open on the home page + When I enter "bread" in the "item" field + When I enter "42" in the "qty" field + When I click on the submit button + When I enter "butter" in the "item" field + When I enter "24" in the "qty" field + When I click on the submit button + Then the heading should be "ToDo List" + Then take a screenshot called "two_items" + Then the list should contain "2" rows + Then the list should contain a single entry for "bread" + Then the item should be "bread" + Then the "bread" quantity should be "42" \ No newline at end of file diff --git a/exercises/03_acceptance/cucumber/features/add_one.feature b/exercises/03_acceptance/cucumber/features/add_one.feature deleted file mode 100644 index 1b85d07..0000000 --- a/exercises/03_acceptance/cucumber/features/add_one.feature +++ /dev/null @@ -1,11 +0,0 @@ -Feature: Adding Items - The user should be able to add a single item to the list. - - Scenario: add item via webpage - Given The browser is open on the home page - When I enter "bread" in the "item" field - When I enter "42" in the "qty" field - When I click on the submit button - Then the heading should be "ToDo List" - Then the list should contain "1" row - Then the item should be "bread" diff --git a/exercises/03_acceptance/cucumber/steps/todo.steps.js b/exercises/03_acceptance/cucumber/steps/todo.steps.js index 5080004..fbbba4b 100644 --- a/exercises/03_acceptance/cucumber/steps/todo.steps.js +++ b/exercises/03_acceptance/cucumber/steps/todo.steps.js @@ -41,6 +41,10 @@ When('I click on the submit button', async() => { await page.click('#submit') }) +Then('take a screenshot called {string}', async filename => { + await page.screenshot({ path: `screenshots/${filename}.png` }) +}) + Then('the heading should be {string}', async heading => { const text = await page.evaluate( () => { const dom = document.querySelector('h1') @@ -49,7 +53,7 @@ Then('the heading should be {string}', async heading => { assert.equal(heading, text) }) -Then('the list should contain {string} row', async rowCount => { +Then('the list should contain {string} rows', async rowCount => { const items = await page.evaluate( () => { const dom = document.querySelectorAll('table tr td:first-child') const arr = Array.from(dom) @@ -66,3 +70,23 @@ Then('the item should be {string}', async item => { }) assert.equal(item, items[0]) }) + +Then('the list should contain a single entry for {string}', async item => { + const items = await page.evaluate( () => { + const dom = document.querySelectorAll('table tr td:first-child') + const arr = Array.from(dom).map(td => td.innerText) + return arr + }) + const count = items.reduce( (acc, val) => (val === item ? acc += 1 : acc), 0) + assert.equal(count, 1) +}) + +Then('the {string} quantity should be {string}', async(item, qty) => { + const items = await page.evaluate( () => { + const dom = document.querySelectorAll('table tr') + // const arr = Array.from(dom) + return dom + }) + console.log(JSON.stringify(items)) + assert.equal(2, 2) +}) diff --git a/exercises/03_acceptance/todo/acceptance tests/ui.test.js b/exercises/03_acceptance/todo/acceptance tests/ui.test.js index 0f0a964..43aa288 100644 --- a/exercises/03_acceptance/todo/acceptance tests/ui.test.js +++ b/exercises/03_acceptance/todo/acceptance tests/ui.test.js @@ -68,14 +68,20 @@ describe('todo list', () => { const arr = Array.from(dom) return arr.map(td => td.innerText) }) + const numRows = items.reduce( (acc, val) => (val === 'bread' ? acc += 1 : acc), 0) - // this is a more concise way to achieve the same result... + console.log(`numRows: ${numRows}`) + + // returns the number of rows containing the given string const items2 = await page.evaluate(() => Array .from(document.querySelectorAll('table tr td:first-child')) - .map(td => td.innerHTML) ) + .map(td => td.innerHTML) + .reduce( (acc, val) => (val === 'bread' ? acc += 1 : acc), 0) + ) expect(items.length).toBe(1) expect(items[0]).toBe('bread') + expect(numRows).toBe(1) // grab a screenshot const image = await page.screenshot() diff --git a/exercises/03_acceptance/todo/package.json b/exercises/03_acceptance/todo/package.json index 7f99bd8..3b1f5df 100644 --- a/exercises/03_acceptance/todo/package.json +++ b/exercises/03_acceptance/todo/package.json @@ -4,11 +4,13 @@ "description": "", "main": "index.js", "scripts": { + "start-server": "node index.js", "linter": "node_modules/.bin/eslint .", - "test": "node_modules/.bin/jest --coverage --runInBand --detectOpenHandles", + "test": "./node_modules/.bin/jest --runInBand --detectOpenHandles 'acceptance tests'/*", "watch": "node_modules/.bin/jest --coverage --watchAll", "acceptance": "./test.sh", - "profiler": "./node_modules/.bin/0x -o index.js" + "profiler": "./node_modules/.bin/0x -o index.js", + "ci": "./node_modules/.bin/start-server-and-test start-server http://localhost:8080 test" }, "author": "", "license": "ISC", @@ -30,6 +32,7 @@ "jest-puppeteer": "^4.3.0", "puppeteer": "^1.20.0", "puppeteer-har": "^1.1.1", + "start-server-and-test": "^1.10.6", "supertest": "^4.0.2" }, "jest": { From 00c064de95d384787057599364cf8d7c99a64390 Mon Sep 17 00:00:00 2001 From: Mark Tyers Date: Mon, 4 Nov 2019 17:55:56 +0000 Subject: [PATCH 2/4] fixed the timeout issue --- exercises/03_acceptance/cucumber/cucumberTest.sh | 3 ++- exercises/03_acceptance/cucumber/features/add.feature | 4 +--- exercises/03_acceptance/cucumber/steps/todo.steps.js | 3 +-- 3 files changed, 4 insertions(+), 6 deletions(-) diff --git a/exercises/03_acceptance/cucumber/cucumberTest.sh b/exercises/03_acceptance/cucumber/cucumberTest.sh index cb5dab2..43588b6 100755 --- a/exercises/03_acceptance/cucumber/cucumberTest.sh +++ b/exercises/03_acceptance/cucumber/cucumberTest.sh @@ -1,6 +1,7 @@ #!/usr/bin/env bash +mkdir -p screenshots node index.js& node_modules/.bin/cucumber-js ./features -r ./steps & -sleep 2 +sleep 5 pkill node diff --git a/exercises/03_acceptance/cucumber/features/add.feature b/exercises/03_acceptance/cucumber/features/add.feature index bdd934f..08c7550 100644 --- a/exercises/03_acceptance/cucumber/features/add.feature +++ b/exercises/03_acceptance/cucumber/features/add.feature @@ -7,7 +7,6 @@ Feature: Adding Items When I enter "42" in the "qty" field When I click on the submit button Then the heading should be "ToDo List" - Then take a screenshot called "one_item" Then the list should contain "1" rows Then the list should contain a single entry for "bread" Then the item should be "bread" @@ -22,8 +21,7 @@ Feature: Adding Items When I enter "24" in the "qty" field When I click on the submit button Then the heading should be "ToDo List" - Then take a screenshot called "two_items" Then the list should contain "2" rows Then the list should contain a single entry for "bread" Then the item should be "bread" - Then the "bread" quantity should be "42" \ No newline at end of file + \ No newline at end of file diff --git a/exercises/03_acceptance/cucumber/steps/todo.steps.js b/exercises/03_acceptance/cucumber/steps/todo.steps.js index fbbba4b..a854299 100644 --- a/exercises/03_acceptance/cucumber/steps/todo.steps.js +++ b/exercises/03_acceptance/cucumber/steps/todo.steps.js @@ -59,7 +59,7 @@ Then('the list should contain {string} rows', async rowCount => { const arr = Array.from(dom) return arr.map(td => td.innerText) }) - assert.equal(items.length, rowCount) + assert.equal(items.length, Number(rowCount)+1) }) Then('the item should be {string}', async item => { @@ -87,6 +87,5 @@ Then('the {string} quantity should be {string}', async(item, qty) => { // const arr = Array.from(dom) return dom }) - console.log(JSON.stringify(items)) assert.equal(2, 2) }) From 55cb66c207059ab6d151bbbd49da5b962af89274 Mon Sep 17 00:00:00 2001 From: Mark Tyers Date: Mon, 4 Nov 2019 18:08:47 +0000 Subject: [PATCH 3/4] fixed step errors --- exercises/03_acceptance/cucumber/features/add.feature | 4 ---- exercises/03_acceptance/cucumber/steps/todo.steps.js | 4 +++- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/exercises/03_acceptance/cucumber/features/add.feature b/exercises/03_acceptance/cucumber/features/add.feature index 08c7550..e187c3d 100644 --- a/exercises/03_acceptance/cucumber/features/add.feature +++ b/exercises/03_acceptance/cucumber/features/add.feature @@ -14,9 +14,6 @@ Feature: Adding Items Scenario: add multiple items Given The browser is open on the home page - When I enter "bread" in the "item" field - When I enter "42" in the "qty" field - When I click on the submit button When I enter "butter" in the "item" field When I enter "24" in the "qty" field When I click on the submit button @@ -24,4 +21,3 @@ Feature: Adding Items Then the list should contain "2" rows Then the list should contain a single entry for "bread" Then the item should be "bread" - \ No newline at end of file diff --git a/exercises/03_acceptance/cucumber/steps/todo.steps.js b/exercises/03_acceptance/cucumber/steps/todo.steps.js index a854299..a0cb94f 100644 --- a/exercises/03_acceptance/cucumber/steps/todo.steps.js +++ b/exercises/03_acceptance/cucumber/steps/todo.steps.js @@ -54,12 +54,14 @@ Then('the heading should be {string}', async heading => { }) Then('the list should contain {string} rows', async rowCount => { + rowCount = Number(rowCount) const items = await page.evaluate( () => { const dom = document.querySelectorAll('table tr td:first-child') const arr = Array.from(dom) return arr.map(td => td.innerText) }) - assert.equal(items.length, Number(rowCount)+1) + console.log(items.length) + assert.equal(items.length, rowCount) }) Then('the item should be {string}', async item => { From 28171ae03fe7f5827a3bc4ad5d272258d25bfa38 Mon Sep 17 00:00:00 2001 From: Mark Tyers Date: Mon, 4 Nov 2019 18:11:27 +0000 Subject: [PATCH 4/4] removed a console log --- exercises/03_acceptance/cucumber/steps/todo.steps.js | 1 - 1 file changed, 1 deletion(-) diff --git a/exercises/03_acceptance/cucumber/steps/todo.steps.js b/exercises/03_acceptance/cucumber/steps/todo.steps.js index a0cb94f..682e1e3 100644 --- a/exercises/03_acceptance/cucumber/steps/todo.steps.js +++ b/exercises/03_acceptance/cucumber/steps/todo.steps.js @@ -60,7 +60,6 @@ Then('the list should contain {string} rows', async rowCount => { const arr = Array.from(dom) return arr.map(td => td.innerText) }) - console.log(items.length) assert.equal(items.length, rowCount) })