Cucumber Updates

exercises/03_acceptance/cucumber/features/add_one.feature

@@ -6,4 +6,11 @@ Feature: Adding Items
 		When I add "bread" with the quantity "17"
 		Then that data exists in memory
 
-
+	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"

exercises/03_acceptance/cucumber/steps/add_one.steps.js

@@ -23,15 +23,8 @@ const todo = require('../modules/todo.js')
 			assert.equal(currentData.qty, 17)
 		});
 
-/*
-STARTING CODE TO HELP WITH "nextFeature.devel"
-
-Copy the contents of nextFeature.devel into add_one.feature, 
-then come back to this file and implement the features one by one. 
-
-There is already some setup code, so you only need to focus on the tests. 
-
-
+// Scenario: add item via webpage
+//Setup Code
 const puppeteer = require('puppeteer')
 
 const PAGE = 'http://localhost:8080'
@@ -43,6 +36,11 @@ const delayMS = 5
 let page 
 let browser
 
+let rows = -1 //test 6 && 
+//-1 because we don't count the heading row 
+let headingToCheck = "" //test 5
+let itemValue = "" //test 7
+
 async function initialize() {
 	console.log("Launching browser")
 	browser = await puppeteer.launch({ headless: true, slowMo: delayMS, args: ['--disable-gpu', `--no-sandbox`,	 '--disable-dev-shm-usage'] })
@@ -56,28 +54,65 @@ async function initialize() {
 }
 
 async function addToPage(field, value){
-	// add puppeteer code 
-	console.log("In development!")
+	await page.click("#" + field) //field represents the id attribute in html
+	await page.keyboard.type(value)
 }
 
 async function pressSubmit(){
-	// add puppeteer code 
-	console.log("In development!")
+	await page.click("#submit")
+}
+
+async function parseHTML(html)
+{
+	let startOfHeading = 0
+	for (let i = 0; i < html.length -4; i++)
+	{
+		let nextWord = html.slice(i, i+4)
+		if (nextWord == "<h1>")
+		{
+			startOfHeading = i+4
+		}
+
+		if (nextWord == "</h1")
+		{
+			headingToCheck = html.slice(startOfHeading, i) //test 5
+		}
+
+		if (nextWord == "<tr>")
+		{
+			rows += 1 //useful for test 6
+			itemValue = html.slice(i+8, i+13) //useful for test 7
+		}
+	}
 }
 
 // Scenario: add item via webpage
+//Tests
 	Given('The browser is open on the home page', async function () {
+		//If you get a CONNECTION_REFUSED make sure your website is running in a separate terminal
 		await initialize()
 	  });
 
 	When('I enter {string} in the {string} field', async function (value, field) {
+		//make sure you set the "id" field in your html tags you want to add to
 		await addToPage(field, value); 
 	  });
 
 	When('I click on the submit button', async () => {
 		await pressSubmit()
 	})
 
+	Then('the heading should be {string}', async function (neededHeading) {
+		let html = await page.content()
+		await parseHTML(html) //deciphers page content, sets variables
+		assert.equal(headingToCheck, neededHeading)
+	  });
+
+	Then('the list should contain {string} row', function (amount) {
+		assert.equal(rows, amount) //we count rows in parseHTML
+	  });
+
+	Then('the item should be {string}', function (neededValue) {
+		assert.equal(itemValue, neededValue) //we find itemValue in parseHTML
+	  });
 
-})
-*/

exercises/03_acceptance/cucumber/views/home.hbs

@@ -24,10 +24,10 @@
 		{{/if}}
 		<form method="post" action="/">
 			Item:
-			<input type="text" name="item" />
+			<input type="text" name="item" id="item" />
 			Qty:
-			<input type="text" name="qty" />
-			<input type="submit" value="Add Item" />
+			<input type="text" name="qty" id="qty" />
+			<input type="submit" value="Add Item" id ="submit"/>
 		</form>
 	</body>
 </html>