From 467828d388d2d19b99c3efbb60ed8056f5900a39 Mon Sep 17 00:00:00 2001
From: rheabhutada02 <83424582+rheabhutada02@users.noreply.github.com>
Date: Wed, 16 Nov 2022 15:48:10 -0800
Subject: [PATCH 01/35] Rename 11822-sprint1day2.md to 110822-sprint1day2.md

---
 admin/meetings/{11822-sprint1day2.md => 110822-sprint1day2.md} | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename admin/meetings/{11822-sprint1day2.md => 110822-sprint1day2.md} (100%)

diff --git a/admin/meetings/11822-sprint1day2.md b/admin/meetings/110822-sprint1day2.md
similarity index 100%
rename from admin/meetings/11822-sprint1day2.md
rename to admin/meetings/110822-sprint1day2.md

From 41905a219b40fdd73ef88c7336c067ad9b6ec4f2 Mon Sep 17 00:00:00 2001
From: rheabhutada02 <83424582+rheabhutada02@users.noreply.github.com>
Date: Wed, 16 Nov 2022 15:54:50 -0800
Subject: [PATCH 02/35] updated checkin6.md

---
 admin/meetings/checkin6.md | 33 +++++++++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 admin/meetings/checkin6.md

diff --git a/admin/meetings/checkin6.md b/admin/meetings/checkin6.md
new file mode 100644
index 0000000..0c37037
--- /dev/null
+++ b/admin/meetings/checkin6.md
@@ -0,0 +1,33 @@
+# Meeting Minutes (11/16/2022)
+## Team 29: Hackers1995
+## Meeting Topic: Weekly TA Catchup with Gagan
+We are meeting with Gagan to discuss Checkpoint 1 and Sprint 2 resolutions.
+
+## Attendance
+1. Rhea Bhutada
+2. George Dubinin
+3. Gagan Gopalaiah
+4. Kara Hoagland
+
+## Meeting Details
+- When: 11/16/2022 at 3:30PM
+- Where: Zoom
+
+## Agenda:
+
+## Discussion Points by Gagan
+- Updated Gagan on Sprint 1
+  - looked at Girhub actions
+  - looked at the published page so far
+  - discussed retrospective
+- Upcoming Assignments
+  - we have to come up with a video on the status of our app
+  - ramp up the styling part, so u can brag about the design of the app
+  - this video is supposed to encourage healthy competition
+- Other Concerns
+  - JSDocs - not primary concern right now
+  - GitHub Pages vs. Netlify
+    - Gagan sees Netlify as more professional and not to difficult to implement
+
+## End Time
+- 11/09/2022 at 3:45PM

From 56dceb5edb200cfa82bd1df2a05574b67d71abf5 Mon Sep 17 00:00:00 2001
From: rheabhutada02 <83424582+rheabhutada02@users.noreply.github.com>
Date: Wed, 16 Nov 2022 15:55:18 -0800
Subject: [PATCH 03/35] Rename checkin6.md to 111622-checkin6.md

---
 admin/meetings/{checkin6.md => 111622-checkin6.md} | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename admin/meetings/{checkin6.md => 111622-checkin6.md} (100%)

diff --git a/admin/meetings/checkin6.md b/admin/meetings/111622-checkin6.md
similarity index 100%
rename from admin/meetings/checkin6.md
rename to admin/meetings/111622-checkin6.md

From dd7d876f29bcaa6e9a77d8e2a74ac50f78f5f4ee Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Wed, 16 Nov 2022 16:10:31 -0800
Subject: [PATCH 04/35] 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 <learthurgo@gmail.com>
---
 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 <learthurgo@gmail.com>
Date: Wed, 16 Nov 2022 16:18:35 -0800
Subject: [PATCH 05/35] fix js-unittest.yml to start local server

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 .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 <learthurgo@gmail.com>
Date: Wed, 16 Nov 2022 16:46:02 -0800
Subject: [PATCH 06/35] fix linting errors

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 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 <learthurgo@gmail.com>
Date: Wed, 16 Nov 2022 17:41:45 -0800
Subject: [PATCH 07/35] add e2e framework ADR

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 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 <learthurgo@gmail.com>
Date: Thu, 17 Nov 2022 11:38:05 -0800
Subject: [PATCH 08/35] fix typo in package.json

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 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",

From 85dc0544c707333af9ccd789036dab985cb11f23 Mon Sep 17 00:00:00 2001
From: Sanjit Joseph <78522615+sm-joseph@users.noreply.github.com>
Date: Thu, 17 Nov 2022 12:19:26 -0800
Subject: [PATCH 09/35] Add star rating system to main page

---
 source/static/ReviewCard.css | 46 ++++++++++++++++++++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/source/static/ReviewCard.css b/source/static/ReviewCard.css
index 2c69f0b..20feb3a 100644
--- a/source/static/ReviewCard.css
+++ b/source/static/ReviewCard.css
@@ -81,3 +81,49 @@ main {
   background-color: rgb(254 171 171);
   border-color: red;
 }
+
+.hidden, 
+.rating:not(:checked) > input { /* Hide radio circles while star rating */
+display: none;
+}
+
+/* Unchecked stars */
+.rating:not(:checked) > label {
+  /* Make stars line up sideways and not vertically */
+  float:right; 
+
+  /* Hide label text */
+  width:1em;
+  overflow:hidden;
+  white-space:nowrap;
+
+  font-size:200%;
+  line-height:1.2;
+  color:#b3b3cc; 
+}
+
+.rating:not(:checked) > label:before {
+  content:'★';
+}
+
+/* Checked star color */
+.rating > input:checked ~ label {
+  color: #FFBF00;
+}
+
+.rating:not(:checked) > label:hover,
+.rating:not(:checked) > label:hover ~ label {
+  color: orangered;
+}
+
+.rating > input:checked + label:hover,
+.rating > input:checked + label:hover ~ label,
+.rating > input:checked ~ label:hover,
+.rating > input:checked ~ label:hover ~ label,
+.rating > label:hover ~ input:checked ~ label {
+  color: orangered;
+}
+
+.rating > label:active {
+  position:relative;
+}

From cf551f932b1499b2fdfd051db6151d67397e2c27 Mon Sep 17 00:00:00 2001
From: rheabhutada02 <83424582+rheabhutada02@users.noreply.github.com>
Date: Thu, 17 Nov 2022 12:25:18 -0800
Subject: [PATCH 10/35] updated name ReviewDetails.html ReviewDetails.js

---
 source/ReviewDetails.html              | 6 +++---
 source/assets/scripts/ReviewDetails.js | 6 +++---
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/source/ReviewDetails.html b/source/ReviewDetails.html
index 6c1080b..74b6365 100644
--- a/source/ReviewDetails.html
+++ b/source/ReviewDetails.html
@@ -19,8 +19,8 @@
 </head>
 <body>
   <main>
-    <button type="button" id="update">Update</button>
-    <button type="button" id="delete" class="danger">Delete</button>
+    <button type="button" id="update-btn">Update</button>
+    <button type="button" id="delete-btn" class="danger">Delete</button>
   </main>
     <!----> <form id="update-food-entry" class="hidden">
       <fieldset>
@@ -67,7 +67,7 @@
           <div class='tag-container' id="tag-container-form">
   
           </div>
-          <button type="button" id="tagAdd">Add Tag</button>
+          <button type="button" id="tag-add-btn">Add Tag</button>
         </label>
   
       </fieldset>
diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js
index 6819bb9..8447ebe 100644
--- a/source/assets/scripts/ReviewDetails.js
+++ b/source/assets/scripts/ReviewDetails.js
@@ -10,7 +10,7 @@ function init(){
 }
 
 function setupDelete(){
-	let deleteBtn = document.getElementById("delete");
+	let deleteBtn = document.getElementById("delete-btn");
 	let reviews = getReviewsFromStorage();
 	let current = JSON.parse(sessionStorage.getItem("current"));
 	deleteBtn.addEventListener("click", function(){
@@ -35,7 +35,7 @@ function setupDelete(){
 }
 
 function setupUpdate(){
-	let updateBtn = document.getElementById("update");
+	let updateBtn = document.getElementById("update-btn");
 	let reviews = getReviewsFromStorage();
 	let current = JSON.parse(sessionStorage.getItem("current"));
 	let form = document.getElementById("update-food-entry");
@@ -104,7 +104,7 @@ function setupUpdate(){
 
 			});
 
-			let tagAddBtn = document.getElementById("tagAdd");
+			let tagAddBtn = document.getElementById("tag-add-btn");
 			tagAddBtn.addEventListener("click", ()=> {
 				let tagField = document.getElementById("tag-form");
 				if (tagField.value.length > 0) {

From f9074a2bc6d62237b65591e68ea61fa2b1f6bd29 Mon Sep 17 00:00:00 2001
From: Sanjit Joseph <78522615+sm-joseph@users.noreply.github.com>
Date: Thu, 17 Nov 2022 12:31:51 -0800
Subject: [PATCH 11/35] Attempt CSS linting fix

---
 source/static/ReviewCard.css | 30 +++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/source/static/ReviewCard.css b/source/static/ReviewCard.css
index 20feb3a..33b8dc1 100644
--- a/source/static/ReviewCard.css
+++ b/source/static/ReviewCard.css
@@ -82,33 +82,33 @@ main {
   border-color: red;
 }
 
-.hidden, 
+.hidden,
 .rating:not(:checked) > input { /* Hide radio circles while star rating */
-display: none;
+  display: none;
 }
 
 /* Unchecked stars */
 .rating:not(:checked) > label {
   /* Make stars line up sideways and not vertically */
-  float:right; 
+  float: right; 
 
   /* Hide label text */
-  width:1em;
-  overflow:hidden;
-  white-space:nowrap;
+  width: 1em;
+  overflow: hidden;
+  white-space: nowrap;
 
-  font-size:200%;
-  line-height:1.2;
-  color:#b3b3cc; 
+  font-size: 200%;
+  line-height: 1.2;
+  color: #b3b3cc;
 }
 
 .rating:not(:checked) > label:before {
-  content:'★';
+  content: "★";
 }
 
 /* Checked star color */
 .rating > input:checked ~ label {
-  color: #FFBF00;
+  color: #ffbf00;
 }
 
 .rating:not(:checked) > label:hover,
@@ -116,6 +116,10 @@ display: none;
   color: orangered;
 }
 
+.rating > label:active {
+  position: relative;
+}
+
 .rating > input:checked + label:hover,
 .rating > input:checked + label:hover ~ label,
 .rating > input:checked ~ label:hover,
@@ -123,7 +127,3 @@ display: none;
 .rating > label:hover ~ input:checked ~ label {
   color: orangered;
 }
-
-.rating > label:active {
-  position:relative;
-}

From c66f43f6e97a9b8504ebf3b74d098eb9763cf02d Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Thu, 17 Nov 2022 12:32:38 -0800
Subject: [PATCH 12/35] add empty crud e2e tests

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 source/assets/scripts/main.e2e.test.js | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index a102b53..3a2841b 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -8,7 +8,7 @@ describe("test App end to end", async () => {
 	let browser;
 	let page;
 
-	beforeEach(async () => {
+	before(async () => {
 		browser = await puppeteer.launch();
 		page = await browser.newPage();
 		try{
@@ -24,7 +24,23 @@ describe("test App end to end", async () => {
 		assert.strictEqual(await page.title(), "Food Journal");
 	});
 
-	afterEach(async () => {
+	it("test create review functinality", async () => {
+		
+	});
+
+	it("test read review functinality", async () => {
+		
+	});
+
+	it("test update review functinality", async () => {
+		
+	});
+
+	it("test delete review functinality", async () => {
+		
+	});
+
+	after(async () => {
 		await page.close();
 		await browser.close();
 	});

From 004e5cc2a23ecffadd4a0014ce999b9ddac14c02 Mon Sep 17 00:00:00 2001
From: Sanjit Joseph <78522615+sm-joseph@users.noreply.github.com>
Date: Thu, 17 Nov 2022 12:44:19 -0800
Subject: [PATCH 13/35] Attempt CSS linting fix - v2

---
 source/static/ReviewCard.css | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/source/static/ReviewCard.css b/source/static/ReviewCard.css
index 33b8dc1..87b5958 100644
--- a/source/static/ReviewCard.css
+++ b/source/static/ReviewCard.css
@@ -90,19 +90,24 @@ main {
 /* Unchecked stars */
 .rating:not(:checked) > label {
   /* Make stars line up sideways and not vertically */
-  float: right; 
+  float: right;
 
   /* Hide label text */
   width: 1em;
   overflow: hidden;
   white-space: nowrap;
 
+  /* Star default color and size */
   font-size: 200%;
   line-height: 1.2;
   color: #b3b3cc;
 }
 
-.rating:not(:checked) > label:before {
+.rating > label:active {
+  position: relative;
+}
+
+.rating:not(:checked) > label::before {
   content: "★";
 }
 
@@ -116,13 +121,9 @@ main {
   color: orangered;
 }
 
-.rating > label:active {
-  position: relative;
-}
-
 .rating > input:checked + label:hover,
-.rating > input:checked + label:hover ~ label,
 .rating > input:checked ~ label:hover,
+.rating > input:checked + label:hover ~ label,
 .rating > input:checked ~ label:hover ~ label,
 .rating > label:hover ~ input:checked ~ label {
   color: orangered;

From 1518fda7661e97827bbf92a9cccb79e46778d72d Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Thu, 17 Nov 2022 13:54:58 -0800
Subject: [PATCH 14/35] add e2e tests for update and delete, fix package.json
 commadns for lint and fix-style

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 package.json                           |  2 +-
 source/assets/scripts/main.e2e.test.js | 80 +++++++++++++++++++++++++-
 2 files changed, 79 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 5da1afa..dc36239 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
   "type": "module",
   "scripts": {
     "test": "mocha --recursive --require mock-local-storage './{,!(node_modules)/**}/*.test.js'",
-    "lint": "eslint '**/*.js'",
+    "lint": "eslint **/*.js",
     "fix-style": "eslint --fix **/*.js",
     "lintHTML": "htmlhint '**/*.html'",
     "lintCSS": "stylelint '**/*.css'",
diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 3a2841b..5106813 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -1,5 +1,5 @@
 import {strict as assert} from "node:assert";
-import {describe, it, beforeEach, afterEach} from "mocha";
+import {describe, it, before, after} from "mocha";
 import puppeteer from "puppeteer-core";
 import { exit } from "node:process";
 
@@ -33,11 +33,87 @@ describe("test App end to end", async () => {
 	});
 
 	it("test update review functinality", async () => {
+		// Get the only review card and click it
+		let review_card = await page.$("review-card");
+		await review_card.click();
+
+		// Set text fields
+		await page.$eval("#mealImg", el => el.value = "updated src");
+		await page.$eval("#imgAlt", el => el.value = "updated alt");
+		await page.$eval("#mealName", el => el.value = "updated name");
+		await page.$eval("#comments", el => el.value = "updated comment");
+		await page.$eval("#restaurant", el => el.value = "updated restaurant");
+
+		// Get all tag elements and click them to delete them
+		let tag_items = await page.$$(".tag");
+		for(let i = 0; i < tag_items.length; i++){
+			await tag_items.click();
+		}
+
+		// Get the button needed to add new tags
+		let tag_btn = await page.$("#tag-add-btn");
+		for(let i = 0; i < 5; i++){
+			await page.$eval("#tag-form", (el, value) => el.value = `tag -${value}`, i);
+			tag_btn.click();
+		}
+
+		// Select a new rating of 1 star
+		let rating_select = await page.$("#s1");
+		rating_select.click();
+
+		// Click the submit button to save updates
+		let submit_btn = await page.$("submit.btn");
+		submit_btn.click();
+
+		// Get the review card again and get its shadowRoot
+		review_card = await page.$("review-card");
+		let shadowRoot = await review_card.getProperty("shadowRoot");
+
+		// Get the review image and check src and alt
+		let img = await shadowRoot.$("#a-mealImg");
+		let imgSrc = await img.getProperty("src");
+		let imgAlt = await img.getProperty("alt");
+		// Check src and alt
+		assert.strictEqual(await imgSrc.jsonValue(), "updated src");
+		assert.strictEqual(await imgAlt.jsonValue(), "updated alt");
+
+		// Get the title, comment, and restaurant
+		let title = await shadowRoot.$("#a-mealName");
+		let title_text = await title.getProperty("innerText");
+		let comment = await shadowRoot.$("a-comments");
+		let comment_text = await comment.getProperty("innerText");
+		let restaurant = await shadowRoot.$("#a-restaurant");
+		let restaurant_text = await restaurant.getProperty("innerText");
+		// Check title, comment, and restaurant
+		assert.strictEqual(await title_text.jsonValue(), "updated name");
+		assert.strictEqual(await comment_text.jsonValue(), "updated comment");
+		assert.strictEqual(await restaurant_text.jsonValue(), "updated restaurant");
 		
+		// Check tags
+		let tags = shadowRoot.$(".tag");
+		for(let i = 0; i < tags.length; i++){
+			let tag_text = await tags[i].getProperty("innerText");
+			assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+		}
+
+		// Check stars
+		let stars = await shadowRoot.$("a-rating");
+		let stars_src = await stars.getProperty("src");
+		assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/1-star.svg");
 	});
 
 	it("test delete review functinality", async () => {
-		
+		// Get the only review card and click it
+		let review_card = await page.$("review-card");
+		await review_card.click();
+
+		// Get the delete button and click it
+		let delete_btn = await page.$("delete-btn");
+		await delete_btn.click();
+
+		// Check that the card was correctly removed (there should be no remaining cards)
+		review_card = await page.$("review-card");
+		assert.strictEqual(review_card, null);
 	});
 
 	after(async () => {

From c45aec116bb3bf082a10b01335ad39bd3ae85a01 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Thu, 17 Nov 2022 15:32:37 -0800
Subject: [PATCH 15/35] fix e2e test for create, split create test into two
 parts, split other test templates into two parts

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 source/assets/scripts/main.e2e.test.js | 72 ++++++++++++++++++++++----
 1 file changed, 61 insertions(+), 11 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 5106813..fde5d2e 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -24,19 +24,31 @@ describe("test App end to end", async () => {
 		assert.strictEqual(await page.title(), "Food Journal");
 	});
 
-	it("test create review functinality", async () => {
+	it("test create review functionality on details page", async () => {
 		
 	});
 
-	it("test read review functinality", async () => {
+	it("test create review functionality on home page", async () => {
 		
 	});
 
-	it("test update review functinality", async () => {
+	it("test read review functionality on details page", async () => {
+		
+	});
+
+	it("test read review functionality on home page", async () => {
+		
+	});
+
+	it("test update review functionality on details page", async () => {
 		// Get the only review card and click it
 		let review_card = await page.$("review-card");
 		await review_card.click();
 
+		// Click the button to show update form
+		let update_btn = await page.$("update-btn");
+		await update_btn.click();
+
 		// Set text fields
 		await page.$eval("#mealImg", el => el.value = "updated src");
 		await page.$eval("#imgAlt", el => el.value = "updated alt");
@@ -61,9 +73,47 @@ describe("test App end to end", async () => {
 		let rating_select = await page.$("#s1");
 		rating_select.click();
 
-		// Click the submit button to save updates
-		let submit_btn = await page.$("submit.btn");
-		submit_btn.click();
+		// Click the save button to save updates
+		let save_btn = await page.$("#save-btn");
+		save_btn.click();
+
+		// Get the review image and check src and alt
+		let img = await page.$("#d-mealImg");
+		let imgSrc = await img.getProperty("src");
+		let imgAlt = await img.getProperty("alt");
+		// Check src and alt
+		assert.strictEqual(await imgSrc.jsonValue(), "updated src");
+		assert.strictEqual(await imgAlt.jsonValue(), "updated alt");
+
+		// Get the title, comment, and restaurant
+		let title = await page.$("#d-mealName");
+		let title_text = await title.getProperty("innerText");
+		let comment = await page.$("#d-comments");
+		let comment_text = await comment.getProperty("innerText");
+		let restaurant = await page.$("#d-restaurant");
+		let restaurant_text = await restaurant.getProperty("innerText");
+		// Check title, comment, and restaurant
+		assert.strictEqual(await title_text.jsonValue(), "updated name");
+		assert.strictEqual(await comment_text.jsonValue(), "updated comment");
+		assert.strictEqual(await restaurant_text.jsonValue(), "updated restaurant");
+		
+		// Check tags
+		let tags = page.$(".tag");
+		for(let i = 0; i < tags.length; i++){
+			let tag_text = await tags[i].getProperty("innerText");
+			assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+		}
+
+		// Check stars
+		let stars = await page.$("#d-rating");
+		let stars_src = await stars.getProperty("src");
+		assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/1-star.svg");
+	});
+
+	it("test update review funcionality on home page", async () => {
+		// Click the button to return to the home page
+		let home_btn = await page.$("#home-btn");
+		home_btn.click();
 
 		// Get the review card again and get its shadowRoot
 		review_card = await page.$("review-card");
@@ -80,7 +130,7 @@ describe("test App end to end", async () => {
 		// Get the title, comment, and restaurant
 		let title = await shadowRoot.$("#a-mealName");
 		let title_text = await title.getProperty("innerText");
-		let comment = await shadowRoot.$("a-comments");
+		let comment = await shadowRoot.$("#a-comments");
 		let comment_text = await comment.getProperty("innerText");
 		let restaurant = await shadowRoot.$("#a-restaurant");
 		let restaurant_text = await restaurant.getProperty("innerText");
@@ -97,22 +147,22 @@ describe("test App end to end", async () => {
 		}
 
 		// Check stars
-		let stars = await shadowRoot.$("a-rating");
+		let stars = await shadowRoot.$("#a-rating");
 		let stars_src = await stars.getProperty("src");
 		assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/1-star.svg");
 	});
 
-	it("test delete review functinality", async () => {
+	it("test delete review functionality", async () => {
 		// Get the only review card and click it
 		let review_card = await page.$("review-card");
 		await review_card.click();
 
 		// Get the delete button and click it
-		let delete_btn = await page.$("delete-btn");
+		let delete_btn = await page.$("#delete-btn");
 		await delete_btn.click();
 
 		// Check that the card was correctly removed (there should be no remaining cards)
-		review_card = await page.$("review-card");
+		review_card = await page.$("#review-card");
 		assert.strictEqual(review_card, null);
 	});
 

From 6c00246e2d4a0c10819ea6f337cdd9d5e87958f1 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Thu, 17 Nov 2022 15:33:12 -0800
Subject: [PATCH 16/35] fix linting issues

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 source/assets/scripts/main.e2e.test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index fde5d2e..9471747 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -116,7 +116,7 @@ describe("test App end to end", async () => {
 		home_btn.click();
 
 		// Get the review card again and get its shadowRoot
-		review_card = await page.$("review-card");
+		let review_card = await page.$("review-card");
 		let shadowRoot = await review_card.getProperty("shadowRoot");
 
 		// Get the review image and check src and alt

From 35f44049a263d598ce5a89376c3d1922fc1d62a7 Mon Sep 17 00:00:00 2001
From: rheabhutada02 <83424582+rheabhutada02@users.noreply.github.com>
Date: Thu, 17 Nov 2022 18:45:53 -0800
Subject: [PATCH 17/35] updated crud features to work better

Co-authored-by: look-its-ashton <look-its-ashton@users.noreply.github.com>
Co-authored-by: Kara Hoagland <KH-Cl@users.noreply.github.com>
Co-authored-by: Gavyn Ezell <ezellgavyn@gmail.com>
---
 source/CreatePage.html                 |  8 +--
 source/ReviewDetails.html              |  1 +
 source/assets/scripts/CreatePage.js    | 78 ++++++++++++++++++++++++++
 source/assets/scripts/ReviewCard.js    | 39 +++++--------
 source/assets/scripts/ReviewDetails.js | 68 ++++++++++------------
 source/assets/scripts/localStorage.js  | 18 ++++--
 source/assets/scripts/main.js          | 14 +++--
 source/index.html                      |  6 +-
 8 files changed, 150 insertions(+), 82 deletions(-)
 create mode 100644 source/assets/scripts/CreatePage.js

diff --git a/source/CreatePage.html b/source/CreatePage.html
index 64dfe78..bc37e7a 100644
--- a/source/CreatePage.html
+++ b/source/CreatePage.html
@@ -14,12 +14,13 @@
   <!-- Main Stylesheets & Scripts -->
   <!-- Temporarily commented out reset.css due to furthur discussion needed on the values of the default config-->
   <!-- <link rel="stylesheet" href="/static/reset.css" /> -->
-  <link rel="stylesheet" href="./static/CreatePage.css" />
-  <script src="assets/scripts/main.js" type="module"></script>
+  <link rel="stylesheet" href="./static/ReviewCard.css" />
+  <script src="./assets/scripts/CreatePage.js" type="module"></script>
 
 </head>
 
 <body>
+  <input type="button" value="Home" id="home-btn" onclick="window.location.assign('./index.html')">
   <form id="new-food-entry">
     <fieldset>
       <legend>Pic:</legend>
@@ -69,8 +70,7 @@
       </label>
 
     </fieldset>
-    <button type="submit" value="Submit">Add Review</button>
-    <button type="button" class="danger">Clear Review Journal</button>
+    <button type="submit" id="save-btn" value="Submit">Save Review</button>
   </form>
 </body>
 
diff --git a/source/ReviewDetails.html b/source/ReviewDetails.html
index 74b6365..c790b4e 100644
--- a/source/ReviewDetails.html
+++ b/source/ReviewDetails.html
@@ -19,6 +19,7 @@
 </head>
 <body>
   <main>
+    <input type="button" value="Home" id="home-btn" onclick="window.location.assign('./index.html')">
     <button type="button" id="update-btn">Update</button>
     <button type="button" id="delete-btn" class="danger">Delete</button>
   </main>
diff --git a/source/assets/scripts/CreatePage.js b/source/assets/scripts/CreatePage.js
new file mode 100644
index 0000000..f334be6
--- /dev/null
+++ b/source/assets/scripts/CreatePage.js
@@ -0,0 +1,78 @@
+window.addEventListener("DOMContentLoaded", init);
+
+function init() {
+    // get next id
+
+    // creates the key
+    initFormHandler();
+    
+}
+
+function initFormHandler() {
+
+	//accessing form components
+	let tagContainer = document.getElementById("tag-container-form");
+	let form = document.querySelector("form");
+  
+	form.addEventListener("submit", function(e){
+	/*
+    *  User submits the form for their review.
+    *  We create reviewCard and put in storage
+    */
+		e.preventDefault();
+		let formData = new FormData(form);
+		let reviewObject = {};
+		for (let [key, value] of formData) {
+			console.log(`${key}`);
+			console.log(`${value}`);
+			if (`${key}` !== "tag-form") {
+				reviewObject[`${key}`] = `${value}`;
+			}
+		}
+		reviewObject["tags"] = [];
+
+		let tags = document.querySelectorAll(".tag");
+		for(let i = 0; i < tags.length; i ++) {
+			reviewObject["tags"].push(tags[i].innerHTML);
+			tagContainer.removeChild(tags[i]);
+		}
+
+		//grabbing the nextID, and putting our review object in storage associated with the ID
+		let nextReviewId = JSON.parse(localStorage.getItem("nextID"));
+		reviewObject["reviewID"] = nextReviewId;
+
+        localStorage.setItem("review"+nextReviewId, JSON.stringify(reviewObject));
+		sessionStorage.setItem("currID", JSON.stringify(nextReviewId));
+
+        //updating our activeIDS list
+        let tempIdArr = JSON.parse(localStorage.getItem("activeIDS"));
+        tempIdArr.push(nextReviewId);
+        localStorage.setItem("activeIDS", JSON.stringify(tempIdArr));
+        
+        
+        //increment nextID for next review creation
+        nextReviewId++;
+		localStorage.setItem("nextID", JSON.stringify(nextReviewId));
+
+		window.location.assign('./ReviewDetails.html');
+        
+	});
+
+	let tagAddBtn = document.getElementById("tagAdd");
+	tagAddBtn.addEventListener("click", ()=> {
+		let tagField = document.getElementById("tag-form");
+		if (tagField.value.length > 0) {
+			let tagLabel = document.createElement("label");
+			tagLabel.innerHTML = tagField.value;
+			tagLabel.setAttribute("class","tag");
+			tagLabel.addEventListener("click",()=> {
+				tagContainer.removeChild(tagLabel);
+			});
+      
+			tagContainer.append(tagLabel);
+			tagField.value = "";
+
+		}
+	});
+
+}
diff --git a/source/assets/scripts/ReviewCard.js b/source/assets/scripts/ReviewCard.js
index 07df6a6..d7bd1ce 100644
--- a/source/assets/scripts/ReviewCard.js
+++ b/source/assets/scripts/ReviewCard.js
@@ -6,7 +6,6 @@ class ReviewCard extends HTMLElement {
 	constructor() {
 		super(); 
 
-
 		let shadowEl = this.attachShadow({mode:"open"});
 
 		let articleEl = document.createElement("article");
@@ -88,9 +87,9 @@ class ReviewCard extends HTMLElement {
 		//attach event listener to each recipe-card
 		this.addEventListener("click", (event) => {
 			console.log(event.target);
-			console.log(event.target.data);
+			console.log(event.target.reviewId);
 			//Option 1: sending current data to second html page using localStorage (could also just store index)
-			sessionStorage.setItem("current", JSON.stringify(event.target.data));
+			sessionStorage.setItem("currID", JSON.stringify(event.target.data.reviewID));
 			window.location.assign("./ReviewDetails.html");
 			/*
       //Option 2: sending current data to second html page using string query w/ url (currently not storing value)
@@ -133,12 +132,18 @@ class ReviewCard extends HTMLElement {
 		let articleEl = this.shadowEl.querySelector("article");
     
 		// setting the article elements for the review card
+    this.reviewID = data["reviewID"];
 
 		//image setup
 		let mealImg = document.createElement("img");
 		mealImg.setAttribute("id", "a-mealImg");
-		mealImg.setAttribute("src",data["mealImg"]);
 		mealImg.setAttribute("alt",data["imgAlt"]);
+    if(data["mealImg"] != ""){
+      mealImg.setAttribute("src",data["mealImg"]);
+    }
+    else{
+      mealImg.setAttribute("src", "./assets/images/icons/plate_with_cutlery.png");
+    }
 
 		//meal name setup
 		let mealLabel = document.createElement("label");
@@ -147,26 +152,6 @@ class ReviewCard extends HTMLElement {
 		mealLabel.innerHTML = data["mealName"];
 
 		//restaurant name setup
-		/*
-    //review page link
-    //giving it functionality to save the review card's info to session storage for loading the review page
-    let reviewLink = document.createElement('a');
-    reviewLink.setAttribute('href','./review.html')
-    reviewLink.innerHTML = 'review page'
-    reviewLink.addEventListener('click', () => {
-      sessionStorage.clear();
-      let currReview = {
-        "imgSrc": data['imgSrc'],
-        "imgAlt": data['imgAlt'],
-        "mealName": data['mealName'],
-        "restaurant": data['restaurant'],
-        "comments": data['comments'],
-        "rating": data['rating'],
-        "tags": data['tags']                
-      }
-      sessionStorage.setItem('currReview', JSON.stringify(currReview));
-    });
-*/
 		let restaurantLabel = document.createElement("label");
 		restaurantLabel.setAttribute("id", "a-restaurant");
 		restaurantLabel.setAttribute("class","restaurant-name");
@@ -197,14 +182,15 @@ class ReviewCard extends HTMLElement {
 			for (let i = 0; i < data["tags"].length; i++) {
 				let newTag = document.createElement("label");
 				newTag.setAttribute("class","tag");
-				newTag.innerHTML = data["tags"][i] + "   ";
+				newTag.innerHTML = data["tags"][i];
 				tagContainer.append(newTag);
 			}
 		}
 
+    //adding final ID to data!
+
 		articleEl.append(mealImg);
 		articleEl.append(mealLabel);
-		//articleEl.append(reviewLink)
 		articleEl.append(restaurantLabel);
 		articleEl.append(ratingDiv);
 		articleEl.append(tagContainer);
@@ -237,6 +223,7 @@ class ReviewCard extends HTMLElement {
 		let dataContainer = {};
     
 		// getting the article elements for the review card
+    dataContainer["reviewID"] = this.reviewID;
 
 		//get image
 		let mealImg = this.shadowEl.getElementById("a-mealImg");
diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js
index 8447ebe..70a0b2d 100644
--- a/source/assets/scripts/ReviewDetails.js
+++ b/source/assets/scripts/ReviewDetails.js
@@ -11,23 +11,18 @@ function init(){
 
 function setupDelete(){
 	let deleteBtn = document.getElementById("delete-btn");
-	let reviews = getReviewsFromStorage();
-	let current = JSON.parse(sessionStorage.getItem("current"));
+	let currID = JSON.parse(sessionStorage.getItem("currID"));
+	let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
 	deleteBtn.addEventListener("click", function(){
 		if(window.confirm("Are you sure you want to delete this entry?")){
-			//delete function
-			if(current){
-				console.log(current);
-				for(let i = 0; i < reviews.length; i++){
-					console.log(reviews[i]);
-					if(reviews[i]["mealName"] == current["mealName"] && reviews[i]["restaurant"] == current["restaurant"]){
-						console.log("match found");
-						reviews.splice(i,1);
-						saveReviewsToStorage(reviews);
-						sessionStorage.removeItem("current");
-						window.location.assign("./index.html");
-						break;
-					}
+			for (let i in activeIDS) {
+				if (activeIDS[i] == currID) {
+					activeIDS.splice(i,1);
+					localStorage.setItem('activeIDS', JSON.stringify(activeIDS));
+					sessionStorage.removeItem('currID');
+					localStorage.removeItem(`review${currID}`);
+					window.location.assign("./index.html");
+					break;
 				}
 			}
 		}
@@ -36,30 +31,31 @@ function setupDelete(){
 
 function setupUpdate(){
 	let updateBtn = document.getElementById("update-btn");
-	let reviews = getReviewsFromStorage();
-	let current = JSON.parse(sessionStorage.getItem("current"));
+	let currID = JSON.parse(sessionStorage.getItem("currID"));
+	let currReview = JSON.parse(localStorage.getItem(`review${currID}`));
 	let form = document.getElementById("update-food-entry");
 	updateBtn.addEventListener("click", function(){
 		//update function
-		if(current){
-			console.log(current);
+		if(currReview){
 			form.style.display = "block";
 			let tagContainer = document.getElementById("tag-container-form");
-			console.log(document.querySelectorAll("#update-food-entry input"));
 
 			//Set value of each input element to current's values
-			document.getElementById("mealImg").defaultValue = current["mealImg"];
-			document.getElementById("imgAlt").defaultValue = current["imgAlt"];
-			document.getElementById("mealName").defaultValue = current["mealName"];
-			document.getElementById("comments").textContent = current["comments"];
-			document.getElementById("rating-" + `${current["rating"]}`).checked = true;
-			document.getElementById("restaurant").defaultValue = current["restaurant"];
+			document.getElementById("mealImg").defaultValue = currReview["mealImg"];
+			document.getElementById("imgAlt").defaultValue = currReview["imgAlt"];
+			document.getElementById("mealName").defaultValue = currReview["mealName"];
+			document.getElementById("comments").textContent = currReview["comments"];
+			document.getElementById("s" + `${currReview["rating"]}`).checked = true;
+			document.getElementById("restaurant").defaultValue = currReview["restaurant"];
 
-			if(current["tags"]){
-				for (let i = 0; i < current["tags"].length; i++) {
+			if(currReview["tags"]){
+				while (tagContainer.firstChild) {
+					tagContainer.removeChild(tagContainer.firstChild);
+				}
+				for (let i = 0; i < currReview["tags"].length; i++) {
 					let newTag = document.createElement("label");
 					newTag.setAttribute("class","tag");
-					newTag.innerHTML = current["tags"][i] + "   ";
+					newTag.innerHTML = currReview["tags"][i];
 					newTag.addEventListener("click",()=> {
 						tagContainer.removeChild(newTag);
 					});
@@ -89,16 +85,10 @@ function setupUpdate(){
 					tagContainer.removeChild(tags[i]);
 				}
 
-				for(let i = 0; i < reviews.length; i++){
-					console.log(reviews[i]);
-					if(reviews[i]["mealName"] == current["mealName"] && reviews[i]["restaurant"] == current["restaurant"]){
-						console.log("match found");
-						reviews.splice(i,1,newData);
-						saveReviewsToStorage(reviews);
-						sessionStorage.setItem("current", JSON.stringify(newData));
-						break;
-					}
-				}
+				newData["reviewID"] = currID;
+
+
+				localStorage.setItem("review"+currID, JSON.stringify(newData));
 
 				form.style.display = "none";
 
diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js
index 48fc891..f160d1d 100644
--- a/source/assets/scripts/localStorage.js
+++ b/source/assets/scripts/localStorage.js
@@ -2,11 +2,19 @@
  * @returns {Array<Object>} An array of reviews found in localStorage
  */
 export function getReviewsFromStorage() {
-	let result = JSON.parse(localStorage.getItem("reviews"));
-	if (result) {
-		return result;
+	if (!(localStorage.getItem("activeIDS"))) {
+		// we wanna init the active ID array and start the nextID count
+		localStorage.setItem("activeIDS", JSON.stringify([]));
+		localStorage.setItem("nextID",  JSON.stringify(0));
 	}
-	return new Array(0);
+	//iterate thru activeIDS
+	let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
+	let reviews = []
+	for (let i = 0; i < activeIDS.length; i++) {
+		let currReview = JSON.parse(localStorage.getItem('review'+activeIDS[i]));
+		reviews.push(currReview);
+	}
+	return reviews;
 }
 
 /**
@@ -15,5 +23,5 @@ export function getReviewsFromStorage() {
  * @param {Array<Object>} reviews An array of reviews
  */
 export function saveReviewsToStorage(reviews) {
-	localStorage.setItem("reviews", JSON.stringify(reviews));
+	localStorage.setItem(`review${reviewId}`, JSON.stringify(reviews));
 }
diff --git a/source/assets/scripts/main.js b/source/assets/scripts/main.js
index 9d37c44..0c76db4 100644
--- a/source/assets/scripts/main.js
+++ b/source/assets/scripts/main.js
@@ -13,6 +13,7 @@ function init() {
 	initFormHandler();
 }
 
+
 /**
  * @param {Array<Object>} reviews An array of reviews
  */
@@ -33,14 +34,14 @@ function addReviewsToDocument(reviews) {
  */
 function initFormHandler() {
 
-	/*
 	//btn to create form (could be its own function?)
-	let createBtn = document.getElementById("create");
+	let createBtn = document.getElementById("create-btn");
 	createBtn.addEventListener("click", function(){
 		window.location.assign("./CreatePage.html");
-	});*/
-
+	});
+	
 	//accessing form components
+	/*
 	let tagContainer = document.getElementById("tag-container-form");
 	let form = document.querySelector("form");
   
@@ -48,7 +49,6 @@ function initFormHandler() {
 	/*
     *  User submits the form for their review.
     *  We create reviewCard and put in storage
-    */
 		let formData = new FormData(form);
 		let reviewObject = {};
 		for (let [key, value] of formData) {
@@ -74,6 +74,9 @@ function initFormHandler() {
 		let mainEl = document.querySelector("main");
 		mainEl.append(newReview);
 
+		// TODO: assign an ID to be used for referencing this object form the activeIDs array and the tag arrays
+		let ID = localStorage.nextID;
+
 		let storedReviews = getReviewsFromStorage();
 		storedReviews.push(reviewObject);
 		saveReviewsToStorage(storedReviews);
@@ -115,5 +118,6 @@ function initFormHandler() {
 
 		}
 	});
+	*/
 
 }
diff --git a/source/index.html b/source/index.html
index 4418ea0..c83fe94 100644
--- a/source/index.html
+++ b/source/index.html
@@ -22,8 +22,8 @@
   <main>
     <!-- Add Food Entries Here -->
   </main>
-  <!--<button type="button" id="create">CREATE</button>-->
-  <!----> <form id="new-food-entry">
+  <button type="button" id="create-btn"><a href='./CreatePage.html'></a>CREATE</button>
+  <!-- <form id="new-food-entry">
     <fieldset>
       <legend>Pic:</legend>
       <label for="mealImage">
@@ -74,6 +74,6 @@
     </fieldset>
     <button type="submit" value="Submit">Add Review</button>
     <button type="button" class="danger">Clear Review Journal</button>
-  </form> <!---->
+  </form> -->
 </body>
 </html>

From 6493fbd17197aff98519726fa5b2422681880465 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 07:13:53 +0000
Subject: [PATCH 18/35] modularize localStorage calls into localStorage.js in
 preparation for unit testing

---
 source/assets/scripts/CreatePage.js    |  18 +--
 source/assets/scripts/ReviewDetails.js | 147 ++++++++++++-------------
 source/assets/scripts/localStorage.js  |  78 ++++++++++---
 source/assets/scripts/main.js          |   4 +-
 4 files changed, 139 insertions(+), 108 deletions(-)

diff --git a/source/assets/scripts/CreatePage.js b/source/assets/scripts/CreatePage.js
index f334be6..fca6dc5 100644
--- a/source/assets/scripts/CreatePage.js
+++ b/source/assets/scripts/CreatePage.js
@@ -1,3 +1,5 @@
+import { newReviewToStorage } from "./localStorage.js";
+
 window.addEventListener("DOMContentLoaded", init);
 
 function init() {
@@ -37,23 +39,9 @@ function initFormHandler() {
 			tagContainer.removeChild(tags[i]);
 		}
 
-		//grabbing the nextID, and putting our review object in storage associated with the ID
-		let nextReviewId = JSON.parse(localStorage.getItem("nextID"));
-		reviewObject["reviewID"] = nextReviewId;
-
-        localStorage.setItem("review"+nextReviewId, JSON.stringify(reviewObject));
+		let nextReviewId = newReviewToStorage(reviewObject);
 		sessionStorage.setItem("currID", JSON.stringify(nextReviewId));
 
-        //updating our activeIDS list
-        let tempIdArr = JSON.parse(localStorage.getItem("activeIDS"));
-        tempIdArr.push(nextReviewId);
-        localStorage.setItem("activeIDS", JSON.stringify(tempIdArr));
-        
-        
-        //increment nextID for next review creation
-        nextReviewId++;
-		localStorage.setItem("nextID", JSON.stringify(nextReviewId));
-
 		window.location.assign('./ReviewDetails.html');
         
 	});
diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js
index 70a0b2d..f2545fa 100644
--- a/source/assets/scripts/ReviewDetails.js
+++ b/source/assets/scripts/ReviewDetails.js
@@ -1,5 +1,5 @@
 //reviewDetails.js
-import {getReviewsFromStorage, saveReviewsToStorage} from "./localStorage.js";
+import {deleteReviewFromStorage, getReviewFromStorage, updateReviewToStorage} from "./localStorage.js";
 
 // Run the init() function when the page has loaded
 window.addEventListener("DOMContentLoaded", init);
@@ -12,19 +12,11 @@ function init(){
 function setupDelete(){
 	let deleteBtn = document.getElementById("delete-btn");
 	let currID = JSON.parse(sessionStorage.getItem("currID"));
-	let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
 	deleteBtn.addEventListener("click", function(){
 		if(window.confirm("Are you sure you want to delete this entry?")){
-			for (let i in activeIDS) {
-				if (activeIDS[i] == currID) {
-					activeIDS.splice(i,1);
-					localStorage.setItem('activeIDS', JSON.stringify(activeIDS));
-					sessionStorage.removeItem('currID');
-					localStorage.removeItem(`review${currID}`);
-					window.location.assign("./index.html");
-					break;
-				}
-			}
+			deleteReviewFromStorage(currID);
+			sessionStorage.removeItem('currID');
+			window.location.assign("./index.html");
 		}
 	});
 }
@@ -32,83 +24,82 @@ function setupDelete(){
 function setupUpdate(){
 	let updateBtn = document.getElementById("update-btn");
 	let currID = JSON.parse(sessionStorage.getItem("currID"));
-	let currReview = JSON.parse(localStorage.getItem(`review${currID}`));
+	let currReview = getReviewFromStorage(currID);
 	let form = document.getElementById("update-food-entry");
 	updateBtn.addEventListener("click", function(){
 		//update function
-		if(currReview){
-			form.style.display = "block";
-			let tagContainer = document.getElementById("tag-container-form");
 
-			//Set value of each input element to current's values
-			document.getElementById("mealImg").defaultValue = currReview["mealImg"];
-			document.getElementById("imgAlt").defaultValue = currReview["imgAlt"];
-			document.getElementById("mealName").defaultValue = currReview["mealName"];
-			document.getElementById("comments").textContent = currReview["comments"];
-			document.getElementById("s" + `${currReview["rating"]}`).checked = true;
-			document.getElementById("restaurant").defaultValue = currReview["restaurant"];
+		form.style.display = "block";
+		form.classList.remove("hidden");
+		let tagContainer = document.getElementById("tag-container-form");
 
-			if(currReview["tags"]){
-				while (tagContainer.firstChild) {
-					tagContainer.removeChild(tagContainer.firstChild);
-				}
-				for (let i = 0; i < currReview["tags"].length; i++) {
-					let newTag = document.createElement("label");
-					newTag.setAttribute("class","tag");
-					newTag.innerHTML = currReview["tags"][i];
-					newTag.addEventListener("click",()=> {
-						tagContainer.removeChild(newTag);
-					});
-					tagContainer.append(newTag);
+		//Set value of each input element to current's values
+		document.getElementById("mealImg").defaultValue = currReview["mealImg"];
+		document.getElementById("imgAlt").defaultValue = currReview["imgAlt"];
+		document.getElementById("mealName").defaultValue = currReview["mealName"];
+		document.getElementById("comments").textContent = currReview["comments"];
+		document.getElementById("s" + `${currReview["rating"]}`).checked = true;
+		document.getElementById("restaurant").defaultValue = currReview["restaurant"];
+
+		if(currReview["tags"]){
+			while (tagContainer.firstChild) {
+				tagContainer.removeChild(tagContainer.firstChild);
+			}
+			for (let i = 0; i < currReview["tags"].length; i++) {
+				let newTag = document.createElement("label");
+				newTag.setAttribute("class","tag");
+				newTag.innerHTML = currReview["tags"][i];
+				newTag.addEventListener("click",()=> {
+					tagContainer.removeChild(newTag);
+				});
+				tagContainer.append(newTag);
+			}
+		}
+		//Take formdata values as newData when submit
+		form.addEventListener("submit", function(){
+			/*
+			*  User submits the form for their review.
+			*  We create reviewCard and put in storage
+			*/
+			let formData = new FormData(form);
+			let newData = {};
+			for (let [key, value] of formData) {
+				console.log(`${key}`);
+				console.log(`${value}`);
+				if (`${key}` !== "tag-form") {
+					newData[`${key}`] = `${value}`;
 				}
 			}
-			//Take formdata values as newData when submit
-			form.addEventListener("submit", function(){
-				/*
-                *  User submits the form for their review.
-                *  We create reviewCard and put in storage
-                */
-				let formData = new FormData(form);
-				let newData = {};
-				for (let [key, value] of formData) {
-					console.log(`${key}`);
-					console.log(`${value}`);
-					if (`${key}` !== "tag-form") {
-						newData[`${key}`] = `${value}`;
-					}
-				}
-				newData["tags"] = [];
-            
-				let tags = document.querySelectorAll(".tag");
-				for(let i = 0; i < tags.length; i ++) {
-					newData["tags"].push(tags[i].innerHTML);
-					tagContainer.removeChild(tags[i]);
-				}
+			newData["tags"] = [];
+		
+			let tags = document.querySelectorAll(".tag");
+			for(let i = 0; i < tags.length; i ++) {
+				newData["tags"].push(tags[i].innerHTML);
+				tagContainer.removeChild(tags[i]);
+			}
 
-				newData["reviewID"] = currID;
+			newData["reviewID"] = currID;
 
+			updateReviewToStorage(currID, newData);
 
-				localStorage.setItem("review"+currID, JSON.stringify(newData));
+			form.style.display = "none";
 
-				form.style.display = "none";
+		});
 
-			});
-
-			let tagAddBtn = document.getElementById("tag-add-btn");
-			tagAddBtn.addEventListener("click", ()=> {
-				let tagField = document.getElementById("tag-form");
-				if (tagField.value.length > 0) {
-					let tagLabel = document.createElement("label");
-					tagLabel.innerHTML = tagField.value;
-					tagLabel.setAttribute("class","tag");
-					tagLabel.addEventListener("click",()=> {
-						tagContainer.removeChild(tagLabel);
-					});
-                
-					tagContainer.append(tagLabel);
-					tagField.value = "";
-				}
-			});
-		}
+		let tagAddBtn = document.getElementById("tag-add-btn");
+		tagAddBtn.addEventListener("click", ()=> {
+			let tagField = document.getElementById("tag-form");
+			if (tagField.value.length > 0) {
+				let tagLabel = document.createElement("label");
+				tagLabel.innerHTML = tagField.value;
+				tagLabel.setAttribute("class","tag");
+				tagLabel.addEventListener("click",()=> {
+					tagContainer.removeChild(tagLabel);
+				});
+			
+				tagContainer.append(tagLabel);
+				tagField.value = "";
+			}
+		});
 	});
 }
diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js
index f160d1d..62b834d 100644
--- a/source/assets/scripts/localStorage.js
+++ b/source/assets/scripts/localStorage.js
@@ -1,7 +1,68 @@
 /**
- * @returns {Array<Object>} An array of reviews found in localStorage
+ * Creates a new review to storage and performs related meta tasks
+ * @param {Object} review to store
+ * @return {number} ID of the newly added review
  */
-export function getReviewsFromStorage() {
+export function newReviewToStorage(review){
+	//grabbing the nextID, and putting our review object in storage associated with the ID
+	let nextReviewId = JSON.parse(localStorage.getItem("nextID"));
+	review["reviewID"] = nextReviewId;
+
+	// set the review entry to the review object
+	localStorage.setItem(`review${nextReviewId}`, JSON.stringify(review));
+	
+	//updating our activeIDS list
+	let tempIdArr = JSON.parse(localStorage.getItem("activeIDS"));
+	tempIdArr.push(nextReviewId);
+	localStorage.setItem("activeIDS", JSON.stringify(tempIdArr));
+	
+	//increment nextID for next review creation
+	nextReviewId++;
+	localStorage.setItem("nextID", JSON.stringify(nextReviewId));
+
+	return nextReviewId;
+}
+
+/**
+ * Gets a single review by ID from storage
+ * @param {string} ID of the review to get
+ * @returns {Object} review object corresponding to param ID
+ */
+export function getReviewFromStorage(ID){
+	return JSON.parse(localStorage.getItem(`review${ID}`));
+}
+
+/**
+ * Updates a single review by ID to storage
+ * @param {string} ID of review to update
+ * @param {Object} review to store
+ */
+export function updateReviewToStorage(ID, review){
+	// set the review entry with ID to the review object
+	localStorage.setItem(`review${ID}`, JSON.stringify(review));
+}
+
+/**
+ * Deletes a review by ID from storage
+ * @param {string} ID of the review to delete
+ */
+export function deleteReviewFromStorage(ID){
+	let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
+
+	for (let i in activeIDS) {
+		if (activeIDS[i] == ID) {
+			activeIDS.splice(i,1);
+			localStorage.setItem('activeIDS', JSON.stringify(activeIDS));
+			localStorage.removeItem(`review${ID}`)
+			return;
+		}
+	}
+
+	console.error(`could not find review${ID} in localStorage`);
+}
+
+// legacy function
+export function getAllReviewsFromStorage() {
 	if (!(localStorage.getItem("activeIDS"))) {
 		// we wanna init the active ID array and start the nextID count
 		localStorage.setItem("activeIDS", JSON.stringify([]));
@@ -11,17 +72,8 @@ export function getReviewsFromStorage() {
 	let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
 	let reviews = []
 	for (let i = 0; i < activeIDS.length; i++) {
-		let currReview = JSON.parse(localStorage.getItem('review'+activeIDS[i]));
+		let currReview = JSON.parse(localStorage.getItem(`review${activeIDS[i]}`));
 		reviews.push(currReview);
 	}
 	return reviews;
-}
-
-/**
- * Takes in an array of reviews, converts it to a string, and then
- * saves that string to 'reviews' in localStorage
- * @param {Array<Object>} reviews An array of reviews
- */
-export function saveReviewsToStorage(reviews) {
-	localStorage.setItem(`review${reviewId}`, JSON.stringify(reviews));
-}
+}
\ No newline at end of file
diff --git a/source/assets/scripts/main.js b/source/assets/scripts/main.js
index 0c76db4..331492e 100644
--- a/source/assets/scripts/main.js
+++ b/source/assets/scripts/main.js
@@ -1,12 +1,12 @@
 // main.js
-import {getReviewsFromStorage, saveReviewsToStorage} from "./localStorage.js";
+import {getAllReviewsFromStorage} from "./localStorage.js";
 
 // Run the init() function when the page has loaded
 window.addEventListener("DOMContentLoaded", init);
 
 function init() {
 	// Get the reviews from localStorage
-	let reviews = getReviewsFromStorage();
+	let reviews = getAllReviewsFromStorage();
 	// Add each reviews to the <main> element
 	addReviewsToDocument(reviews);
 	// Add the event listeners to the form elements

From 5e833386687d511ce074c7bf248ebaa2fe0c4b64 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 07:51:08 +0000
Subject: [PATCH 19/35] update unit tests to match new localStorage
 implementations

---
 source/assets/scripts/localStorage.test.js | 113 ++++++++++++++++-----
 1 file changed, 86 insertions(+), 27 deletions(-)

diff --git a/source/assets/scripts/localStorage.test.js b/source/assets/scripts/localStorage.test.js
index 90ed2b7..94730d1 100644
--- a/source/assets/scripts/localStorage.test.js
+++ b/source/assets/scripts/localStorage.test.js
@@ -1,49 +1,108 @@
 import {strict as assert} from "node:assert";
 import {describe, it, beforeEach} from "mocha";
-import {saveReviewsToStorage, getReviewsFromStorage} from "./localStorage.js";
+import {newReviewToStorage, getReviewFromStorage, updateReviewToStorage, deleteReviewFromStorage, getAllReviewsFromStorage} from "./localStorage.js";
 
 describe("test app localStorage interaction", () => {
 	
-	beforeEach(() => {
+	before(() => {
 		localStorage.clear();
+		localStorage.setItem("activeIDS", JSON.stringify([]));
+		localStorage.setItem("nextID", JSON.stringify(0));
 	});
 
-	it("get after init", () => {
-		assert.deepEqual(getReviewsFromStorage(), []);
+	it("test localStorage state after init", () => {
+		assert.deepEqual(getAllReviewsFromStorage(), []);
+		assert.deepEqual(JSON.parse(localStorage.getItem("activeIDS")), []);
+		assert.strictEqual(JSON.parse(localStorage.getItem("nextID")), 0);
 	});
-	it("store one then get", () => {
-		let reviews = [{
+
+	it("test localStorage state after adding one review", () => {
+		let review = {
 			"imgSrc": "sample src",
 			"imgAlt": "sample alt",
 			"mealName": "sample name",
 			"restaurant": "sample restaurant",
 			"rating": 5,
 			"tags": ["tag 1", "tag  2", "tag 3"]
-		}];
+		};
 
-		saveReviewsToStorage(reviews);
-		assert.deepEqual(getReviewsFromStorage(), reviews);
+		newReviewToStorage(review);
+
+		review.reviewID = 0;
+
+		assert.deepEqual(getAllReviewsFromStorage(), [review]);
+		assert.deepEqual(getReviewFromStorage(0), review);
+		assert.deepEqual(JSON.parse(localStorage.getItem("activeIDS")), [0]);
+		assert.strictEqual(JSON.parse(localStorage.getItem("nextID")), 1);
 	});
-	it("repeated store one more and get", () => {
-		let reviews = [];
 
-		assert.deepEqual(getReviewsFromStorage(), reviews);
+	it("test localStorage state during adding 999 reviews", () => {
+		let reviews = getAllReviewsFromStorage();
+		let ids = [0];
+
+		for(let i = 1; i < 1000; i++){
+			ids.push(i);
+			let new_review = {
+				"imgSrc": `sample src ${i}`,
+				"imgAlt": `sample alt ${i}`,
+				"mealName": `sample name ${i}`,
+				"restaurant": `sample restaurant ${i}`,
+				"rating": i,
+				"tags": [`tag ${3*i}`, `tag ${3*i + 1}`, `tag ${3*i + 2}`]
+			}
+
+			newReviewToStorage(new_review);
+
+			new_review.reviewID = i;
+			reviews.push(new_review);
+
+			assert.deepEqual(getAllReviewsFromStorage(), reviews);
+			assert.deepEqual(getReviewFromStorage(i), new_review);
+			assert.deepEqual(JSON.parse(localStorage.getItem("activeIDS")), ids);
+			assert.strictEqual(JSON.parse(localStorage.getItem("nextID")), (i+1));
+		}
+	}).timeout(5000);
+
+	it("test localStorage state during updating 1000 reviews", () => {
+		let reviews = getAllReviewsFromStorage();
+		let ids = JSON.parse(localStorage.getItem("activeIDS"));
 
 		for(let i = 0; i < 1000; i++){
-			reviews = getReviewsFromStorage();
-			
-			reviews.push(
-				{
-					"imgSrc": `sample src ${i}`,
-					"imgAlt": `sample alt ${i}`,
-					"mealName": `sample name ${i}`,
-					"restaurant": `sample restaurant ${i}`,
-					"rating": i,
-					"tags": [`tag ${3*i}`, `tag ${3*i + 1}`, `tag ${3*i + 2}`]
-				}
-			);
-			saveReviewsToStorage(reviews);
-			assert.deepEqual(getReviewsFromStorage(), reviews);
+			let new_review = {
+				"imgSrc": `updated sample src ${i}`,
+				"imgAlt": `updated sample alt ${i}`,
+				"mealName": `updated sample name ${i}`,
+				"restaurant": `updated sample restaurant ${i}`,
+				"rating": i*2+i,
+				"tags": [`tag ${3*i}`, `tag ${3*i + 1}`, `tag ${3*i + 2}`]
+			}
+			new_review.reviewID = i;
+
+			reviews[i] = new_review;
+
+			updateReviewToStorage(i, new_review);
+
+			assert.deepEqual(getAllReviewsFromStorage(), reviews);
+			assert.deepEqual(getReviewFromStorage(i), new_review);
+			assert.deepEqual(JSON.parse(localStorage.getItem("activeIDS")), ids);
+			assert.strictEqual(JSON.parse(localStorage.getItem("nextID")), 1000);
 		}
-	}).timeout(10000);
+	}).timeout(5000);
+
+	it("test localStorage state during deleting 1000 reviews", () => {
+		let reviews = getAllReviewsFromStorage();
+		let ids = JSON.parse(localStorage.getItem("activeIDS"));
+
+		for(let i = 999; i >= 0; i--){
+			deleteReviewFromStorage(i);
+			ids.pop();
+			reviews.pop();
+
+			assert.deepEqual(getAllReviewsFromStorage(), reviews);
+			assert.deepEqual(JSON.parse(localStorage.getItem("activeIDS")), ids);
+			assert.strictEqual(JSON.parse(localStorage.getItem("nextID")), 1000);
+		}
+	}).timeout(5000);
+
+	after(() => {});
 });

From 89b7319dd86166a594123ac94d936070b666bee3 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 07:52:43 +0000
Subject: [PATCH 20/35] cleanup unused html and js code

---
 source/assets/scripts/ReviewPage.js | 13 -----
 source/assets/scripts/main.js       | 81 -----------------------------
 source/review.html                  | 16 ------
 3 files changed, 110 deletions(-)
 delete mode 100644 source/assets/scripts/ReviewPage.js
 delete mode 100644 source/review.html

diff --git a/source/assets/scripts/ReviewPage.js b/source/assets/scripts/ReviewPage.js
deleted file mode 100644
index 89cd440..0000000
--- a/source/assets/scripts/ReviewPage.js
+++ /dev/null
@@ -1,13 +0,0 @@
-// Run the init() function when the page has loaded
-window.addEventListener("DOMContentLoaded", init);
-
-function init() {
-	let result = sessionStorage.getItem("currReview");
-
-	let main = document.querySelector("main");
-    
-	main.innerHTML = result;
-	let p = document.createElement("p");
-	p.innerHTML = JSON.parse(result)["comments"];
-	main.append(p);
-}
diff --git a/source/assets/scripts/main.js b/source/assets/scripts/main.js
index 331492e..c402faf 100644
--- a/source/assets/scripts/main.js
+++ b/source/assets/scripts/main.js
@@ -39,85 +39,4 @@ function initFormHandler() {
 	createBtn.addEventListener("click", function(){
 		window.location.assign("./CreatePage.html");
 	});
-	
-	//accessing form components
-	/*
-	let tagContainer = document.getElementById("tag-container-form");
-	let form = document.querySelector("form");
-  
-	form.addEventListener("submit", function(){
-	/*
-    *  User submits the form for their review.
-    *  We create reviewCard and put in storage
-		let formData = new FormData(form);
-		let reviewObject = {};
-		for (let [key, value] of formData) {
-			console.log(`${key}`);
-			console.log(`${value}`);
-			if (`${key}` !== "tag-form") {
-				reviewObject[`${key}`] = `${value}`;
-			}
-		}
-		reviewObject["tags"] = [];
-
-		let tags = document.querySelectorAll(".tag");
-		for(let i = 0; i < tags.length; i ++) {
-			reviewObject["tags"].push(tags[i].innerHTML);
-			tagContainer.removeChild(tags[i]);
-		}
-    
-
-		let newReview = document.createElement("review-card");
-		newReview.data = reviewObject;
-
-		//TODO: want to append it to whatever the box is in layout 
-		let mainEl = document.querySelector("main");
-		mainEl.append(newReview);
-
-		// TODO: assign an ID to be used for referencing this object form the activeIDs array and the tag arrays
-		let ID = localStorage.nextID;
-
-		let storedReviews = getReviewsFromStorage();
-		storedReviews.push(reviewObject);
-		saveReviewsToStorage(storedReviews);
-		document.getElementById("new-food-entry").reset();
-	});
-
-	// DEV-MODE: for testing purposes 
-	let clearBtn = document.querySelector(".danger");
-	clearBtn.addEventListener("click", function() {
-		localStorage.clear();
-		let mainEl = document.querySelector("main");
-		while (mainEl.firstChild) {
-			mainEl.removeChild(mainEl.firstChild);
-		}
-		let deleteTags = document.querySelectorAll(".tag");
-		for(let i = 0; i < deleteTags.length; i ++) {
-			tagContainer.removeChild(deleteTags[i]);
-		}
-    
-		//clears reviews AS WELL as resets form
-		document.getElementById("new-food-entry").reset();
-     
-     
-	});
-
-	let tagAddBtn = document.getElementById("tagAdd");
-	tagAddBtn.addEventListener("click", ()=> {
-		let tagField = document.getElementById("tag-form");
-		if (tagField.value.length > 0) {
-			let tagLabel = document.createElement("label");
-			tagLabel.innerHTML = tagField.value;
-			tagLabel.setAttribute("class","tag");
-			tagLabel.addEventListener("click",()=> {
-				tagContainer.removeChild(tagLabel);
-			});
-      
-			tagContainer.append(tagLabel);
-			tagField.value = "";
-
-		}
-	});
-	*/
-
 }
diff --git a/source/review.html b/source/review.html
deleted file mode 100644
index b9894ad..0000000
--- a/source/review.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Food Journal</title>
-    
-    <script src="assets/scripts/reviewpage.js" type="module"></script>
-</head>
-<body>
-    <h1>Current Review:</h1>
-    <main>
-    </main>
-</body>
-</html>
\ No newline at end of file

From 3422f584f98dc9f6f74786a261a7ef0c1a0f537d Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 07:56:07 +0000
Subject: [PATCH 21/35] fix linting in js

---
 source/assets/scripts/CreatePage.js        |  8 ++++----
 source/assets/scripts/ReviewCard.js        | 18 +++++++++---------
 source/assets/scripts/ReviewDetails.js     |  2 +-
 source/assets/scripts/localStorage.js      |  6 +++---
 source/assets/scripts/localStorage.test.js |  6 +++---
 5 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/source/assets/scripts/CreatePage.js b/source/assets/scripts/CreatePage.js
index fca6dc5..c5c641f 100644
--- a/source/assets/scripts/CreatePage.js
+++ b/source/assets/scripts/CreatePage.js
@@ -3,10 +3,10 @@ import { newReviewToStorage } from "./localStorage.js";
 window.addEventListener("DOMContentLoaded", init);
 
 function init() {
-    // get next id
+	// get next id
 
-    // creates the key
-    initFormHandler();
+	// creates the key
+	initFormHandler();
     
 }
 
@@ -42,7 +42,7 @@ function initFormHandler() {
 		let nextReviewId = newReviewToStorage(reviewObject);
 		sessionStorage.setItem("currID", JSON.stringify(nextReviewId));
 
-		window.location.assign('./ReviewDetails.html');
+		window.location.assign("./ReviewDetails.html");
         
 	});
 
diff --git a/source/assets/scripts/ReviewCard.js b/source/assets/scripts/ReviewCard.js
index d7bd1ce..70a0660 100644
--- a/source/assets/scripts/ReviewCard.js
+++ b/source/assets/scripts/ReviewCard.js
@@ -132,18 +132,18 @@ class ReviewCard extends HTMLElement {
 		let articleEl = this.shadowEl.querySelector("article");
     
 		// setting the article elements for the review card
-    this.reviewID = data["reviewID"];
+		this.reviewID = data["reviewID"];
 
 		//image setup
 		let mealImg = document.createElement("img");
 		mealImg.setAttribute("id", "a-mealImg");
 		mealImg.setAttribute("alt",data["imgAlt"]);
-    if(data["mealImg"] != ""){
-      mealImg.setAttribute("src",data["mealImg"]);
-    }
-    else{
-      mealImg.setAttribute("src", "./assets/images/icons/plate_with_cutlery.png");
-    }
+		if(data["mealImg"] != ""){
+			mealImg.setAttribute("src",data["mealImg"]);
+		}
+		else{
+			mealImg.setAttribute("src", "./assets/images/icons/plate_with_cutlery.png");
+		}
 
 		//meal name setup
 		let mealLabel = document.createElement("label");
@@ -187,7 +187,7 @@ class ReviewCard extends HTMLElement {
 			}
 		}
 
-    //adding final ID to data!
+		//adding final ID to data!
 
 		articleEl.append(mealImg);
 		articleEl.append(mealLabel);
@@ -223,7 +223,7 @@ class ReviewCard extends HTMLElement {
 		let dataContainer = {};
     
 		// getting the article elements for the review card
-    dataContainer["reviewID"] = this.reviewID;
+		dataContainer["reviewID"] = this.reviewID;
 
 		//get image
 		let mealImg = this.shadowEl.getElementById("a-mealImg");
diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js
index f2545fa..b07282b 100644
--- a/source/assets/scripts/ReviewDetails.js
+++ b/source/assets/scripts/ReviewDetails.js
@@ -15,7 +15,7 @@ function setupDelete(){
 	deleteBtn.addEventListener("click", function(){
 		if(window.confirm("Are you sure you want to delete this entry?")){
 			deleteReviewFromStorage(currID);
-			sessionStorage.removeItem('currID');
+			sessionStorage.removeItem("currID");
 			window.location.assign("./index.html");
 		}
 	});
diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js
index 62b834d..20be650 100644
--- a/source/assets/scripts/localStorage.js
+++ b/source/assets/scripts/localStorage.js
@@ -52,8 +52,8 @@ export function deleteReviewFromStorage(ID){
 	for (let i in activeIDS) {
 		if (activeIDS[i] == ID) {
 			activeIDS.splice(i,1);
-			localStorage.setItem('activeIDS', JSON.stringify(activeIDS));
-			localStorage.removeItem(`review${ID}`)
+			localStorage.setItem("activeIDS", JSON.stringify(activeIDS));
+			localStorage.removeItem(`review${ID}`);
 			return;
 		}
 	}
@@ -70,7 +70,7 @@ export function getAllReviewsFromStorage() {
 	}
 	//iterate thru activeIDS
 	let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
-	let reviews = []
+	let reviews = [];
 	for (let i = 0; i < activeIDS.length; i++) {
 		let currReview = JSON.parse(localStorage.getItem(`review${activeIDS[i]}`));
 		reviews.push(currReview);
diff --git a/source/assets/scripts/localStorage.test.js b/source/assets/scripts/localStorage.test.js
index 94730d1..0ed85c4 100644
--- a/source/assets/scripts/localStorage.test.js
+++ b/source/assets/scripts/localStorage.test.js
@@ -1,5 +1,5 @@
 import {strict as assert} from "node:assert";
-import {describe, it, beforeEach} from "mocha";
+import {describe, it, before, after} from "mocha";
 import {newReviewToStorage, getReviewFromStorage, updateReviewToStorage, deleteReviewFromStorage, getAllReviewsFromStorage} from "./localStorage.js";
 
 describe("test app localStorage interaction", () => {
@@ -49,7 +49,7 @@ describe("test app localStorage interaction", () => {
 				"restaurant": `sample restaurant ${i}`,
 				"rating": i,
 				"tags": [`tag ${3*i}`, `tag ${3*i + 1}`, `tag ${3*i + 2}`]
-			}
+			};
 
 			newReviewToStorage(new_review);
 
@@ -75,7 +75,7 @@ describe("test app localStorage interaction", () => {
 				"restaurant": `updated sample restaurant ${i}`,
 				"rating": i*2+i,
 				"tags": [`tag ${3*i}`, `tag ${3*i + 1}`, `tag ${3*i + 2}`]
-			}
+			};
 			new_review.reviewID = i;
 
 			reviews[i] = new_review;

From 425bc45453fa26e5f3458795dbdd7c864a368e7d Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 09:23:54 +0000
Subject: [PATCH 22/35] fix unit test action stall issue

---
 .github/workflows/js-unittest.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/js-unittest.yml b/.github/workflows/js-unittest.yml
index 5c07e35..918ce70 100644
--- a/.github/workflows/js-unittest.yml
+++ b/.github/workflows/js-unittest.yml
@@ -24,6 +24,6 @@ jobs:
       - name: Install dependencies
         run: sudo npm install
       - name: Start local http server
-        run: sudo npm run http-server
+        run: sudo npm run http-server & 
       - name: Run tests
         run: sudo npm test
\ No newline at end of file

From 5f84e700d177c7d5c7a8267e553d15501f944df4 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 12:34:59 -0800
Subject: [PATCH 23/35] update e2e test layout

---
 package.json                           |   6 +-
 source/assets/scripts/main.e2e.test.js | 288 +++++++++++++------------
 2 files changed, 158 insertions(+), 136 deletions(-)

diff --git a/package.json b/package.json
index dc36239..5dfc756 100644
--- a/package.json
+++ b/package.json
@@ -13,11 +13,11 @@
   "devDependencies": {
     "eslint": "^8.27.0",
     "htmlhint": "1.1.4",
+    "http-server": "",
     "mocha": "10",
     "mock-local-storage": "^1.1.23",
+    "puppeteer": "^18.2.1",
     "stylelint": "14.14.1",
-    "stylelint-config-standard": "^29.0.0",
-    "puppeteer": "18",
-    "http-server": ""
+    "stylelint-config-standard": "^29.0.0"
   }
 }
diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 9471747..d2b9753 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -20,150 +20,172 @@ describe("test App end to end", async () => {
 		}
 	});
 
-	it("page should have correct title", async () => {
-		assert.strictEqual(await page.title(), "Food Journal");
+	describe("test simple properties", async () => {
+		it("page should have correct title", async () => {
+			assert.strictEqual(await page.title(), "Food Journal");
+		});
 	});
 
-	it("test create review functionality on details page", async () => {
+	describe("test create 1 new review", async () => {
+		it("create 1 new review", async () => {
+
+		});
+
+		it("check details page", async () => {
 		
+		});
+	
+		it("check home page", async () => {
+			
+		});
 	});
 
-	it("test create review functionality on home page", async () => {
-		
+	describe("test read 1 review after refresh", async () => {
+		it("refresh page", async () => {
+
+		});
+
+		it("check details page", async () => {
+			
+		});
+
+		it("check home page", async () => {
+			
+		});
 	});
 
-	it("test read review functionality on details page", async () => {
-		
+	describe("test update 1 review", async () => {
+
+		it("update 1 review", async () => {
+			// Get the only review card and click it
+			let review_card = await page.$("review-card");
+			await review_card.click();
+
+			// Click the button to show update form
+			let update_btn = await page.$("update-btn");
+			await update_btn.click();
+
+			// Set text fields
+			await page.$eval("#mealImg", el => el.value = "updated src");
+			await page.$eval("#imgAlt", el => el.value = "updated alt");
+			await page.$eval("#mealName", el => el.value = "updated name");
+			await page.$eval("#comments", el => el.value = "updated comment");
+			await page.$eval("#restaurant", el => el.value = "updated restaurant");
+
+			// Get all tag elements and click them to delete them
+			let tag_items = await page.$$(".tag");
+			for(let i = 0; i < tag_items.length; i++){
+				await tag_items.click();
+			}
+
+			// Get the button needed to add new tags
+			let tag_btn = await page.$("#tag-add-btn");
+			for(let i = 0; i < 5; i++){
+				await page.$eval("#tag-form", (el, value) => el.value = `tag -${value}`, i);
+				tag_btn.click();
+			}
+
+			// Select a new rating of 1 star
+			let rating_select = await page.$("#s1");
+			rating_select.click();
+
+			// Click the save button to save updates
+			let save_btn = await page.$("#save-btn");
+			save_btn.click();
+		});
+
+		it("check details page", async () => {
+			// Get the review image and check src and alt
+			let img = await page.$("#d-mealImg");
+			let imgSrc = await img.getProperty("src");
+			let imgAlt = await img.getProperty("alt");
+			// Check src and alt
+			assert.strictEqual(await imgSrc.jsonValue(), "updated src");
+			assert.strictEqual(await imgAlt.jsonValue(), "updated alt");
+
+			// Get the title, comment, and restaurant
+			let title = await page.$("#d-mealName");
+			let title_text = await title.getProperty("innerText");
+			let comment = await page.$("#d-comments");
+			let comment_text = await comment.getProperty("innerText");
+			let restaurant = await page.$("#d-restaurant");
+			let restaurant_text = await restaurant.getProperty("innerText");
+			// Check title, comment, and restaurant
+			assert.strictEqual(await title_text.jsonValue(), "updated name");
+			assert.strictEqual(await comment_text.jsonValue(), "updated comment");
+			assert.strictEqual(await restaurant_text.jsonValue(), "updated restaurant");
+			
+			// Check tags
+			let tags = page.$(".tag");
+			for(let i = 0; i < tags.length; i++){
+				let tag_text = await tags[i].getProperty("innerText");
+				assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+			}
+
+			// Check stars
+			let stars = await page.$("#d-rating");
+			let stars_src = await stars.getProperty("src");
+			assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/1-star.svg");
+		});
+
+		it("check home page", async () => {
+			// Click the button to return to the home page
+			let home_btn = await page.$("#home-btn");
+			home_btn.click();
+
+			// Get the review card again and get its shadowRoot
+			let review_card = await page.$("review-card");
+			let shadowRoot = await review_card.getProperty("shadowRoot");
+
+			// Get the review image and check src and alt
+			let img = await shadowRoot.$("#a-mealImg");
+			let imgSrc = await img.getProperty("src");
+			let imgAlt = await img.getProperty("alt");
+			// Check src and alt
+			assert.strictEqual(await imgSrc.jsonValue(), "updated src");
+			assert.strictEqual(await imgAlt.jsonValue(), "updated alt");
+
+			// Get the title, comment, and restaurant
+			let title = await shadowRoot.$("#a-mealName");
+			let title_text = await title.getProperty("innerText");
+			let comment = await shadowRoot.$("#a-comments");
+			let comment_text = await comment.getProperty("innerText");
+			let restaurant = await shadowRoot.$("#a-restaurant");
+			let restaurant_text = await restaurant.getProperty("innerText");
+			// Check title, comment, and restaurant
+			assert.strictEqual(await title_text.jsonValue(), "updated name");
+			assert.strictEqual(await comment_text.jsonValue(), "updated comment");
+			assert.strictEqual(await restaurant_text.jsonValue(), "updated restaurant");
+			
+			// Check tags
+			let tags = shadowRoot.$(".tag");
+			for(let i = 0; i < tags.length; i++){
+				let tag_text = await tags[i].getProperty("innerText");
+				assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+			}
+
+			// Check stars
+			let stars = await shadowRoot.$("#a-rating");
+			let stars_src = await stars.getProperty("src");
+			assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/1-star.svg");
+		});
+
 	});
 
-	it("test read review functionality on home page", async () => {
-		
-	});
+	describe("test delete 1 review", () => {
+		it("delete 1 review", async () => {
+			// Get the only review card and click it
+			let review_card = await page.$("review-card");
+			await review_card.click();
 
-	it("test update review functionality on details page", async () => {
-		// Get the only review card and click it
-		let review_card = await page.$("review-card");
-		await review_card.click();
+			// Get the delete button and click it
+			let delete_btn = await page.$("#delete-btn");
+			await delete_btn.click();
 
-		// Click the button to show update form
-		let update_btn = await page.$("update-btn");
-		await update_btn.click();
-
-		// Set text fields
-		await page.$eval("#mealImg", el => el.value = "updated src");
-		await page.$eval("#imgAlt", el => el.value = "updated alt");
-		await page.$eval("#mealName", el => el.value = "updated name");
-		await page.$eval("#comments", el => el.value = "updated comment");
-		await page.$eval("#restaurant", el => el.value = "updated restaurant");
-
-		// Get all tag elements and click them to delete them
-		let tag_items = await page.$$(".tag");
-		for(let i = 0; i < tag_items.length; i++){
-			await tag_items.click();
-		}
-
-		// Get the button needed to add new tags
-		let tag_btn = await page.$("#tag-add-btn");
-		for(let i = 0; i < 5; i++){
-			await page.$eval("#tag-form", (el, value) => el.value = `tag -${value}`, i);
-			tag_btn.click();
-		}
-
-		// Select a new rating of 1 star
-		let rating_select = await page.$("#s1");
-		rating_select.click();
-
-		// Click the save button to save updates
-		let save_btn = await page.$("#save-btn");
-		save_btn.click();
-
-		// Get the review image and check src and alt
-		let img = await page.$("#d-mealImg");
-		let imgSrc = await img.getProperty("src");
-		let imgAlt = await img.getProperty("alt");
-		// Check src and alt
-		assert.strictEqual(await imgSrc.jsonValue(), "updated src");
-		assert.strictEqual(await imgAlt.jsonValue(), "updated alt");
-
-		// Get the title, comment, and restaurant
-		let title = await page.$("#d-mealName");
-		let title_text = await title.getProperty("innerText");
-		let comment = await page.$("#d-comments");
-		let comment_text = await comment.getProperty("innerText");
-		let restaurant = await page.$("#d-restaurant");
-		let restaurant_text = await restaurant.getProperty("innerText");
-		// Check title, comment, and restaurant
-		assert.strictEqual(await title_text.jsonValue(), "updated name");
-		assert.strictEqual(await comment_text.jsonValue(), "updated comment");
-		assert.strictEqual(await restaurant_text.jsonValue(), "updated restaurant");
-		
-		// Check tags
-		let tags = page.$(".tag");
-		for(let i = 0; i < tags.length; i++){
-			let tag_text = await tags[i].getProperty("innerText");
-			assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
-		}
-
-		// Check stars
-		let stars = await page.$("#d-rating");
-		let stars_src = await stars.getProperty("src");
-		assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/1-star.svg");
-	});
-
-	it("test update review funcionality on home page", async () => {
-		// Click the button to return to the home page
-		let home_btn = await page.$("#home-btn");
-		home_btn.click();
-
-		// Get the review card again and get its shadowRoot
-		let review_card = await page.$("review-card");
-		let shadowRoot = await review_card.getProperty("shadowRoot");
-
-		// Get the review image and check src and alt
-		let img = await shadowRoot.$("#a-mealImg");
-		let imgSrc = await img.getProperty("src");
-		let imgAlt = await img.getProperty("alt");
-		// Check src and alt
-		assert.strictEqual(await imgSrc.jsonValue(), "updated src");
-		assert.strictEqual(await imgAlt.jsonValue(), "updated alt");
-
-		// Get the title, comment, and restaurant
-		let title = await shadowRoot.$("#a-mealName");
-		let title_text = await title.getProperty("innerText");
-		let comment = await shadowRoot.$("#a-comments");
-		let comment_text = await comment.getProperty("innerText");
-		let restaurant = await shadowRoot.$("#a-restaurant");
-		let restaurant_text = await restaurant.getProperty("innerText");
-		// Check title, comment, and restaurant
-		assert.strictEqual(await title_text.jsonValue(), "updated name");
-		assert.strictEqual(await comment_text.jsonValue(), "updated comment");
-		assert.strictEqual(await restaurant_text.jsonValue(), "updated restaurant");
-		
-		// Check tags
-		let tags = shadowRoot.$(".tag");
-		for(let i = 0; i < tags.length; i++){
-			let tag_text = await tags[i].getProperty("innerText");
-			assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
-		}
-
-		// Check stars
-		let stars = await shadowRoot.$("#a-rating");
-		let stars_src = await stars.getProperty("src");
-		assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/1-star.svg");
-	});
-
-	it("test delete review functionality", async () => {
-		// Get the only review card and click it
-		let review_card = await page.$("review-card");
-		await review_card.click();
-
-		// Get the delete button and click it
-		let delete_btn = await page.$("#delete-btn");
-		await delete_btn.click();
-
-		// Check that the card was correctly removed (there should be no remaining cards)
-		review_card = await page.$("#review-card");
-		assert.strictEqual(review_card, null);
+			// Check that the card was correctly removed (there should be no remaining cards)
+			review_card = await page.$("#review-card");
+			assert.strictEqual(review_card, null);
+		});
 	});
 
 	after(async () => {

From f6a9fb7fc52b1b521b15084e5369fc6282fc1b27 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 14:08:19 -0800
Subject: [PATCH 24/35] remove implied init from localStorage unit tests

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 source/assets/scripts/localStorage.test.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/source/assets/scripts/localStorage.test.js b/source/assets/scripts/localStorage.test.js
index 0ed85c4..8f87ce0 100644
--- a/source/assets/scripts/localStorage.test.js
+++ b/source/assets/scripts/localStorage.test.js
@@ -6,8 +6,6 @@ describe("test app localStorage interaction", () => {
 	
 	before(() => {
 		localStorage.clear();
-		localStorage.setItem("activeIDS", JSON.stringify([]));
-		localStorage.setItem("nextID", JSON.stringify(0));
 	});
 
 	it("test localStorage state after init", () => {

From 9cf7baf3e526eace3d9dc1db8fefae8f039f280f Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 14:43:59 -0800
Subject: [PATCH 25/35] remove commented form from index

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 source/index.html | 52 -----------------------------------------------
 1 file changed, 52 deletions(-)

diff --git a/source/index.html b/source/index.html
index c83fe94..b8d4438 100644
--- a/source/index.html
+++ b/source/index.html
@@ -23,57 +23,5 @@
     <!-- Add Food Entries Here -->
   </main>
   <button type="button" id="create-btn"><a href='./CreatePage.html'></a>CREATE</button>
-  <!-- <form id="new-food-entry">
-    <fieldset>
-      <legend>Pic:</legend>
-      <label for="mealImage">
-        Source:
-        <input type="text" id="mealImg" name="mealImg">
-      </label>
-      <label for="image-alt">
-        Alt Text:
-        <input type="text" id="imgAlt" name="imgAlt">
-      </label>
-    </fieldset>
-    <fieldset>
-
-      <legend> Meal: </legend>
-      <label for="Meal: ">Meal:
-        <input type="text" id="mealName" name="mealName" required>
-      </label>
-      <label for="comments">Comments: 
-        <br>
-        <textarea name="comments" id="comments"></textarea>
-      </label>
-    </fieldset>
-    
-    <fieldset class="rating">
-      <legend> Rating: </legend>
-      <input type="radio" id="s5" name="rating" value="5"/> <label for="s5"> 5 stars </label>
-      <input type="radio" id="s4" name="rating" value="4"/> <label for="s4"> 4 stars </label>
-      <input type="radio" id="s3" name="rating" value="3"/> <label for="s3"> 3 stars </label>
-      <input type="radio" id="s2" name="rating" value="2"/> <label for="s2"> 2 stars </label>
-      <input type="radio" id="s1" name="rating" value="1"/> <label for="s1"> 1 star </label>
-    </fieldset>
-
-    <fieldset>
-      <legend>Other Info:</legend>
-      <label for="restaurant">
-        Restaurant:
-        <input type="text" id="restaurant" name="restaurant" required>
-      </label>
-      <label for="tag-form">
-        Tags:
-        <input type="text" id="tag-form" name="tag-form">
-        <div class='tag-container' id="tag-container-form">
-
-        </div>
-        <button type="button" id="tagAdd">Add Tag</button>
-      </label>
-
-    </fieldset>
-    <button type="submit" value="Submit">Add Review</button>
-    <button type="button" class="danger">Clear Review Journal</button>
-  </form> -->
 </body>
 </html>

From baa722b55e407c84ad6f0df45d946ff3d64adf34 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 15:15:20 -0800
Subject: [PATCH 26/35] remove unused files

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 .../assets/images/1_spooky-ghost-cookies.jpeg | Bin 6801 -> 0 bytes
 .../2_frightfully-easy-ghost-cookies.jpeg     | Bin 4986 -> 0 bytes
 .../3_ingredient-ghost-halloween-cookies.jpeg | Bin 8829 -> 0 bytes
 source/reviews.json                           |  19 ------------------
 4 files changed, 19 deletions(-)
 delete mode 100644 source/assets/images/1_spooky-ghost-cookies.jpeg
 delete mode 100644 source/assets/images/2_frightfully-easy-ghost-cookies.jpeg
 delete mode 100644 source/assets/images/3_ingredient-ghost-halloween-cookies.jpeg
 delete mode 100644 source/reviews.json

diff --git a/source/assets/images/1_spooky-ghost-cookies.jpeg b/source/assets/images/1_spooky-ghost-cookies.jpeg
deleted file mode 100644
index aa5a1ede5c6ff00ba604f42424c48858efc72c80..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 6801
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
IV{d-`4^O_!sQ>@~

diff --git a/source/assets/images/2_frightfully-easy-ghost-cookies.jpeg b/source/assets/images/2_frightfully-easy-ghost-cookies.jpeg
deleted file mode 100644
index 38b34e8a1c8a138d990e2eeb75b5b7d2fe86829c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4986
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

diff --git a/source/assets/images/3_ingredient-ghost-halloween-cookies.jpeg b/source/assets/images/3_ingredient-ghost-halloween-cookies.jpeg
deleted file mode 100644
index 2bca5e0ddb2dc15edfbb14be9e5cd695a6898ca2..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 8829
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
MGN#FM^nU(-0GIBt#Q*>R

diff --git a/source/reviews.json b/source/reviews.json
deleted file mode 100644
index 0f36b32..0000000
--- a/source/reviews.json
+++ /dev/null
@@ -1,19 +0,0 @@
-[
-   {
-      "imgSrc": "https://cdn.vox-cdn.com/thumbor/Cj5J-5WqSCjlC2tWCOXEB536CJY=/0x0:1810x1182/1200x800/filters:focal(761x447:1049x735)/cdn.vox-cdn.com/uploads/chorus_image/image/69422966/Tacos_Lined_Up.0.png",
-      "imgAlt": "tacos pic",
-      "mealName": "Birria Tacos",
-      "restaurant": "Mike's Red Tacos",
-      "rating": 5,
-      "tags": ["delicious", "#worthit","omg"]
-   },
-   {
-      "imgSrc": "https://www.redwormcomposting.com/images/worm-burrito.JPG",
-      "imgAlt": "wolftown pic",
-      "mealName": "Carnitas Burrito",
-      "restaurant": "Wolftown UCSD",
-      "rating": 0,
-      "tags": ["gross", "why","no"]
-
-   }
-]

From 82be561bfe7597212a428ffa2f583982dbe6c768 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 19:21:53 -0800
Subject: [PATCH 27/35] add wait for page navigation to applicable tests

---
 source/assets/scripts/main.e2e.test.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index d2b9753..620ca20 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -61,6 +61,8 @@ describe("test App end to end", async () => {
 			let review_card = await page.$("review-card");
 			await review_card.click();
 
+			await page.waitForNavigation();
+
 			// Click the button to show update form
 			let update_btn = await page.$("update-btn");
 			await update_btn.click();
@@ -133,6 +135,8 @@ describe("test App end to end", async () => {
 			let home_btn = await page.$("#home-btn");
 			home_btn.click();
 
+			await page.waitForNavigation();
+
 			// Get the review card again and get its shadowRoot
 			let review_card = await page.$("review-card");
 			let shadowRoot = await review_card.getProperty("shadowRoot");

From cac2b0bf07e0dd2c8417a13679df264beddd31a7 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 20:36:10 -0800
Subject: [PATCH 28/35] populate part of add review, various bug fixes, TODO:
 resolve issue with star selectors

---
 source/assets/scripts/main.e2e.test.js | 50 ++++++++++++++++++++------
 1 file changed, 40 insertions(+), 10 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 620ca20..b8dd3f2 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -12,7 +12,7 @@ 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: 5000});
 		}
 		catch (error) {
 			console.log("❌ failed to connect to localhost webserver on port 8080");
@@ -28,7 +28,32 @@ describe("test App end to end", async () => {
 
 	describe("test create 1 new review", async () => {
 		it("create 1 new review", async () => {
+			// Click the button to show update form
+			let create_btn = await page.$("#create-btn");
+			await create_btn.click();
+			await page.waitForNavigation();
 
+			// Set text fields
+			await page.$eval("#mealImg", el => el.value = "sample src");
+			await page.$eval("#imgAlt", el => el.value = "sample alt");
+			await page.$eval("#mealName", el => el.value = "sample name");
+			await page.$eval("#comments", el => el.value = "sample comment");
+			await page.$eval("#restaurant", el => el.value = "sample restaurant");
+
+			// Get the button needed to add new tags
+			let tag_btn = await page.$("#tag-add-btn");
+			for(let i = 0; i < 5; i++){
+				await page.$eval("#tag-form", (el, value) => el.value = `tag ${value}`, i);
+				await tag_btn.click();
+			}
+			
+			// Select a new rating of 1 star
+			let rating_select = await page.$("#s1");
+			rating_select.click();
+
+			// Click the save button to save updates
+			page.click("#save-btn");
+			await page.waitForNavigation();
 		});
 
 		it("check details page", async () => {
@@ -36,7 +61,11 @@ describe("test App end to end", async () => {
 		});
 	
 		it("check home page", async () => {
-			
+			// Click the button to return to the home page
+			let home_btn = await page.$("#home-btn");
+			home_btn.click();
+
+			await page.waitForNavigation();
 		});
 	});
 
@@ -57,14 +86,15 @@ describe("test App end to end", async () => {
 	describe("test update 1 review", async () => {
 
 		it("update 1 review", async () => {
+
 			// Get the only review card and click it
 			let review_card = await page.$("review-card");
+			console.log(JSON.stringify(review_card));
 			await review_card.click();
-
 			await page.waitForNavigation();
 
 			// Click the button to show update form
-			let update_btn = await page.$("update-btn");
+			let update_btn = await page.$("#update-btn");
 			await update_btn.click();
 
 			// Set text fields
@@ -83,17 +113,17 @@ describe("test App end to end", async () => {
 			// Get the button needed to add new tags
 			let tag_btn = await page.$("#tag-add-btn");
 			for(let i = 0; i < 5; i++){
-				await page.$eval("#tag-form", (el, value) => el.value = `tag -${value}`, i);
-				tag_btn.click();
+				await page.$eval("#tag-form", (el, value) => el.value = `updated tag -${value}`, i);
+				await tag_btn.click();
 			}
-
+			
 			// Select a new rating of 1 star
 			let rating_select = await page.$("#s1");
 			rating_select.click();
 
 			// Click the save button to save updates
-			let save_btn = await page.$("#save-btn");
-			save_btn.click();
+			page.click("#save-btn");
+			await page.waitForNavigation();
 		});
 
 		it("check details page", async () => {
@@ -121,7 +151,7 @@ describe("test App end to end", async () => {
 			let tags = page.$(".tag");
 			for(let i = 0; i < tags.length; i++){
 				let tag_text = await tags[i].getProperty("innerText");
-				assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+				assert.strictEqual(await tag_text.jsonValue(), `updated tag -${i}`);
 			}
 
 			// Check stars

From 65815998e9801b1d4075a7225decefa8a7638a16 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 20:37:33 -0800
Subject: [PATCH 29/35] fix create new review star selection

---
 source/assets/scripts/main.e2e.test.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index b8dd3f2..3ce874f 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -117,8 +117,8 @@ describe("test App end to end", async () => {
 				await tag_btn.click();
 			}
 			
-			// Select a new rating of 1 star
-			let rating_select = await page.$("#s1");
+			// Select a new rating of 5 stars
+			let rating_select = await page.$("#s5");
 			rating_select.click();
 
 			// Click the save button to save updates

From 274a05fdc231008de058c4277e109ebe12c34cab Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 20:43:55 -0800
Subject: [PATCH 30/35] convert page.click() to button.click()

---
 source/assets/scripts/main.e2e.test.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 3ce874f..43817ff 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -52,7 +52,8 @@ describe("test App end to end", async () => {
 			rating_select.click();
 
 			// Click the save button to save updates
-			page.click("#save-btn");
+			let save_btn = await page.$("#save-btn");
+			save_btn.click();
 			await page.waitForNavigation();
 		});
 
@@ -122,7 +123,8 @@ describe("test App end to end", async () => {
 			rating_select.click();
 
 			// Click the save button to save updates
-			page.click("#save-btn");
+			let save_btn = await page.$("#save-btn");
+			save_btn.click();
 			await page.waitForNavigation();
 		});
 
@@ -164,7 +166,6 @@ describe("test App end to end", async () => {
 			// Click the button to return to the home page
 			let home_btn = await page.$("#home-btn");
 			home_btn.click();
-
 			await page.waitForNavigation();
 
 			// Get the review card again and get its shadowRoot
@@ -211,10 +212,12 @@ describe("test App end to end", async () => {
 			// Get the only review card and click it
 			let review_card = await page.$("review-card");
 			await review_card.click();
+			await page.waitForNavigation();
 
 			// Get the delete button and click it
 			let delete_btn = await page.$("#delete-btn");
 			await delete_btn.click();
+			await page.waitForNavigation();
 
 			// Check that the card was correctly removed (there should be no remaining cards)
 			review_card = await page.$("#review-card");

From d5be6a2e4d23536ddf91245dc191a77d228813ea Mon Sep 17 00:00:00 2001
From: Marc <mreta0002@gmail.com>
Date: Fri, 18 Nov 2022 23:08:54 -0800
Subject: [PATCH 31/35] Check details & homepage for create & read

---
 source/assets/scripts/main.e2e.test.js | 157 ++++++++++++++++++++++++-
 1 file changed, 153 insertions(+), 4 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 43817ff..e3e3d74 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -58,29 +58,178 @@ describe("test App end to end", async () => {
 		});
 
 		it("check details page", async () => {
-		
+			// click review card
+			let review_card = await page.$("review-card");
+			console.log(JSON.stringify(review_card));
+			await review_card.click();
+			await page.waitForNavigation();
+
+			// Get the review image and check src and alt
+			let img = await page.$("#d-mealImg");
+			let imgSrc = await img.getProperty("src");
+			let imgAlt = await img.getProperty("alt");
+			// Check src and alt
+			assert.strictEqual(await imgSrc.jsonValue(), "sample src");
+			assert.strictEqual(await imgAlt.jsonValue(), "sample alt");
+
+			// Get the title, comment, and restaurant
+			let title = await page.$("#d-mealName");
+			let title_text = await title.getProperty("innerText");
+			let comment = await page.$("#d-comments");
+			let comment_text = await comment.getProperty("innerText");
+			let restaurant = await page.$("#d-restaurant");
+			let restaurant_text = await restaurant.getProperty("innerText");
+
+			// Check title, comment, and restaurant
+			assert.strictEqual(await title_text.jsonValue(), "sample name");
+			assert.strictEqual(await comment_text.jsonValue(), "sample comment");
+			assert.strictEqual(await restaurant_text.jsonValue(), "sample restaurant");
+
+			// Check tags
+			let tags = page.$(".tag");
+			for(let i = 0; i < tags.length; i++){
+				let tag_text = await tags[i].getProperty("innerText");
+				assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+			}
+
+			// Check stars
+			let stars = await page.$("#d-rating");
+			let stars_src = await stars.getProperty("src");
+			assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/5-star.svg");
 		});
 	
 		it("check home page", async () => {
 			// Click the button to return to the home page
 			let home_btn = await page.$("#home-btn");
 			home_btn.click();
-
 			await page.waitForNavigation();
+
+			// Get the review card again and get its shadowRoot
+			let review_card = await page.$("review-card");
+			let shadowRoot = await review_card.getProperty("shadowRoot");
+
+			// Get the review image and check src and alt
+			let img = await shadowRoot.$("#a-mealImg");
+			let imgSrc = await img.getProperty("src");
+			let imgAlt = await img.getProperty("alt");
+			// Check src and alt
+			assert.strictEqual(await imgSrc.jsonValue(), "sample src");
+			assert.strictEqual(await imgAlt.jsonValue(), "sample alt");
+
+			// Get the title, comment, and restaurant
+			let title = await shadowRoot.$("#a-mealName");
+			let title_text = await title.getProperty("innerText");
+			let comment = await shadowRoot.$("#a-comments");
+			let comment_text = await comment.getProperty("innerText");
+			let restaurant = await shadowRoot.$("#a-restaurant");
+			let restaurant_text = await restaurant.getProperty("innerText");
+			// Check title, comment, and restaurant
+			assert.strictEqual(await title_text.jsonValue(), "sample name");
+			assert.strictEqual(await comment_text.jsonValue(), "sample comment");
+			assert.strictEqual(await restaurant_text.jsonValue(), "sample restaurant");
+			
+			// Check tags
+			let tags = shadowRoot.$(".tag");
+			for(let i = 0; i < tags.length; i++){
+				let tag_text = await tags[i].getProperty("innerText");
+				assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+			}
+
+			// Check stars
+			let stars = await shadowRoot.$("#a-rating");
+			let stars_src = await stars.getProperty("src");
+			assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/5-star.svg");
 		});
 	});
 
 	describe("test read 1 review after refresh", async () => {
 		it("refresh page", async () => {
-
+			// Reload the page
+			await page.reload({ waitUntil: ["networkidle0", "domcontentloaded"] });
 		});
 
 		it("check details page", async () => {
-			
+			// click review card
+			let review_card = await page.$("review-card");
+			console.log(JSON.stringify(review_card));
+			await review_card.click();
+			await page.waitForNavigation();
+
+			// Get the review image and check src and alt
+			let img = await page.$("#d-mealImg");
+			let imgSrc = await img.getProperty("src");
+			let imgAlt = await img.getProperty("alt");
+			// Check src and alt
+			assert.strictEqual(await imgSrc.jsonValue(), "sample src");
+			assert.strictEqual(await imgAlt.jsonValue(), "sample alt");
+
+			// Get the title, comment, and restaurant
+			let title = await page.$("#d-mealName");
+			let title_text = await title.getProperty("innerText");
+			let comment = await page.$("#d-comments");
+			let comment_text = await comment.getProperty("innerText");
+			let restaurant = await page.$("#d-restaurant");
+			let restaurant_text = await restaurant.getProperty("innerText");
+
+			// Check title, comment, and restaurant
+			assert.strictEqual(await title_text.jsonValue(), "sample name");
+			assert.strictEqual(await comment_text.jsonValue(), "sample comment");
+			assert.strictEqual(await restaurant_text.jsonValue(), "sample restaurant");
+
+			// Check tags
+			let tags = page.$(".tag");
+			for(let i = 0; i < tags.length; i++){
+				let tag_text = await tags[i].getProperty("innerText");
+				assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+			}
+
+			// Check stars
+			let stars = await page.$("#d-rating");
+			let stars_src = await stars.getProperty("src");
+			assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/5-star.svg");
 		});
 
 		it("check home page", async () => {
+			// Click the button to return to the home page
+			let home_btn = await page.$("#home-btn");
+			home_btn.click();
+			await page.waitForNavigation();
+
+			// Get the review card again and get its shadowRoot
+			let review_card = await page.$("review-card");
+			let shadowRoot = await review_card.getProperty("shadowRoot");
+
+			// Get the review image and check src and alt
+			let img = await shadowRoot.$("#a-mealImg");
+			let imgSrc = await img.getProperty("src");
+			let imgAlt = await img.getProperty("alt");
+			// Check src and alt
+			assert.strictEqual(await imgSrc.jsonValue(), "sample src");
+			assert.strictEqual(await imgAlt.jsonValue(), "sample alt");
+
+			// Get the title, comment, and restaurant
+			let title = await shadowRoot.$("#a-mealName");
+			let title_text = await title.getProperty("innerText");
+			let comment = await shadowRoot.$("#a-comments");
+			let comment_text = await comment.getProperty("innerText");
+			let restaurant = await shadowRoot.$("#a-restaurant");
+			let restaurant_text = await restaurant.getProperty("innerText");
+			// Check title, comment, and restaurant
+			assert.strictEqual(await title_text.jsonValue(), "sample name");
+			assert.strictEqual(await comment_text.jsonValue(), "sample comment");
+			assert.strictEqual(await restaurant_text.jsonValue(), "sample restaurant");
 			
+			// Check tags
+			let tags = shadowRoot.$(".tag");
+			for(let i = 0; i < tags.length; i++){
+				let tag_text = await tags[i].getProperty("innerText");
+				assert.strictEqual(await tag_text.jsonValue(), `tag -${i}`);
+			}
+
+			// Check stars
+			let stars = await shadowRoot.$("#a-rating");
+			let stars_src = await stars.getProperty("src");
+			assert.strictEqual(await stars_src.jsonValue(), "./assets/images/icons/5-star.svg");
 		});
 	});
 

From ef5dccfd1aae7cabeb1d806854c6dcd4f517b8b6 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Fri, 18 Nov 2022 23:26:51 -0800
Subject: [PATCH 32/35] temp fix issue with root user

---
 source/assets/scripts/main.e2e.test.js | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 43817ff..8ac6e0e 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -9,14 +9,23 @@ describe("test App end to end", async () => {
 	let page;
 
 	before(async () => {
-		browser = await puppeteer.launch();
-		page = await browser.newPage();
-		try{
-			await page.goto("http://localhost:8080", {timeout: 5000});
+		let root;
+		try {
+			root =  process.getuid() == 0;
 		}
 		catch (error) {
-			console.log("❌ failed to connect to localhost webserver on port 8080");
-			exit(1);
+			root = false;
+		}
+
+		browser = await puppeteer.launch({args: root ? ['--no-sandbox'] : undefined});
+		page = await browser.newPage();
+		try{
+			await page.goto("http://localhost:8080", {timeout: 1000});
+			await console.log(`✔ connected to localhost webserver as ${root ? "root" : "user"}`);
+		}
+		catch (error) {
+			await console.log("❌ failed to connect to localhost webserver on port 8080");
+			await exit(1);
 		}
 	});
 

From 20afab9b1f16a51e74f1a4b1672cf33e7abf5a25 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Sat, 19 Nov 2022 10:21:43 -0800
Subject: [PATCH 33/35] remove create test review card reference

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 source/assets/scripts/main.e2e.test.js | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index 5e5d2e2..acbe038 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -67,12 +67,6 @@ describe("test App end to end", async () => {
 		});
 
 		it("check details page", async () => {
-			// click review card
-			let review_card = await page.$("review-card");
-			console.log(JSON.stringify(review_card));
-			await review_card.click();
-			await page.waitForNavigation();
-
 			// Get the review image and check src and alt
 			let img = await page.$("#d-mealImg");
 			let imgSrc = await img.getProperty("src");

From c5229c7bc1fcce588217199f8d84d703b2392f54 Mon Sep 17 00:00:00 2001
From: rheabhutada02 <83424582+rheabhutada02@users.noreply.github.com>
Date: Sat, 19 Nov 2022 10:45:28 -0800
Subject: [PATCH 34/35] Updated ReviewDetails.js

---
 source/assets/scripts/ReviewDetails.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js
index b07282b..2f560f7 100644
--- a/source/assets/scripts/ReviewDetails.js
+++ b/source/assets/scripts/ReviewDetails.js
@@ -29,7 +29,7 @@ function setupUpdate(){
 	updateBtn.addEventListener("click", function(){
 		//update function
 
-		form.style.display = "block";
+		//form.style.display = "block";
 		form.classList.remove("hidden");
 		let tagContainer = document.getElementById("tag-container-form");
 

From 7035fa46eef9504223c55cc0613b547c7be4e111 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Sat, 19 Nov 2022 11:42:30 -0800
Subject: [PATCH 35/35] fixes to tag-add-btn, fixes to tests with rating
 selection

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
---
 source/CreatePage.html                 | 12 ++++++------
 source/ReviewDetails.html              | 10 +++++-----
 source/assets/scripts/CreatePage.js    |  2 +-
 source/assets/scripts/main.e2e.test.js | 16 ++++++++--------
 4 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/source/CreatePage.html b/source/CreatePage.html
index bc37e7a..1fbd60c 100644
--- a/source/CreatePage.html
+++ b/source/CreatePage.html
@@ -47,11 +47,11 @@
 
     <fieldset class="rating">
       <legend> Rating: </legend>
-      <input type="radio" id="s5" name="rating" value="5"/> <label for="s5"> 5 stars </label>
-      <input type="radio" id="s4" name="rating" value="4"/> <label for="s4"> 4 stars </label>
-      <input type="radio" id="s3" name="rating" value="3"/> <label for="s3"> 3 stars </label>
-      <input type="radio" id="s2" name="rating" value="2"/> <label for="s2"> 2 stars </label>
-      <input type="radio" id="s1" name="rating" value="1"/> <label for="s1"> 1 star </label>
+      <input type="radio" id="s5" name="rating" value="5"/> <label for="s5" id="s5-select"> 5 stars </label>
+      <input type="radio" id="s4" name="rating" value="4"/> <label for="s4" id="s4-select"> 4 stars </label>
+      <input type="radio" id="s3" name="rating" value="3"/> <label for="s3" id="s3-select"> 3 stars </label>
+      <input type="radio" id="s2" name="rating" value="2"/> <label for="s2" id="s2-select"> 2 stars </label>
+      <input type="radio" id="s1" name="rating" value="1"/> <label for="s1" id="s1-select"> 1 star </label>
     </fieldset>
 
     <fieldset>
@@ -66,7 +66,7 @@
         <div class='tag-container' id="tag-container-form">
 
         </div>
-        <button type="button" id="tagAdd">Add Tag</button>
+        <button type="button" id="tag-add-btn">Add Tag</button>
       </label>
 
     </fieldset>
diff --git a/source/ReviewDetails.html b/source/ReviewDetails.html
index c790b4e..8c457aa 100644
--- a/source/ReviewDetails.html
+++ b/source/ReviewDetails.html
@@ -49,11 +49,11 @@
       
       <fieldset class="rating">
         <legend> Rating: </legend>
-        <input type="radio" id="s5" name="rating" value="5"/> <label for="s5"> 5 stars </label>
-        <input type="radio" id="s4" name="rating" value="4"/> <label for="s4"> 4 stars </label>
-        <input type="radio" id="s3" name="rating" value="3"/> <label for="s3"> 3 stars </label>
-        <input type="radio" id="s2" name="rating" value="2"/> <label for="s2"> 2 stars </label>
-        <input type="radio" id="s1" name="rating" value="1"/> <label for="s1"> 1 star </label>
+        <input type="radio" id="s5" name="rating" value="5"/> <label for="s5" id="s5-select"> 5 stars </label>
+        <input type="radio" id="s4" name="rating" value="4"/> <label for="s4" id="s4-select"> 4 stars </label>
+        <input type="radio" id="s3" name="rating" value="3"/> <label for="s3" id="s3-select"> 3 stars </label>
+        <input type="radio" id="s2" name="rating" value="2"/> <label for="s2" id="s2-select"> 2 stars </label>
+        <input type="radio" id="s1" name="rating" value="1"/> <label for="s1" id="s1-select"> 1 star </label>
       </fieldset>
 
       <fieldset>
diff --git a/source/assets/scripts/CreatePage.js b/source/assets/scripts/CreatePage.js
index c5c641f..af666c7 100644
--- a/source/assets/scripts/CreatePage.js
+++ b/source/assets/scripts/CreatePage.js
@@ -46,7 +46,7 @@ function initFormHandler() {
         
 	});
 
-	let tagAddBtn = document.getElementById("tagAdd");
+	let tagAddBtn = document.getElementById("tag-add-btn");
 	tagAddBtn.addEventListener("click", ()=> {
 		let tagField = document.getElementById("tag-form");
 		if (tagField.value.length > 0) {
diff --git a/source/assets/scripts/main.e2e.test.js b/source/assets/scripts/main.e2e.test.js
index acbe038..482f67c 100644
--- a/source/assets/scripts/main.e2e.test.js
+++ b/source/assets/scripts/main.e2e.test.js
@@ -55,14 +55,14 @@ describe("test App end to end", async () => {
 				await page.$eval("#tag-form", (el, value) => el.value = `tag ${value}`, i);
 				await tag_btn.click();
 			}
-			
+
 			// Select a new rating of 1 star
-			let rating_select = await page.$("#s1");
-			rating_select.click();
+			let rating_select = await page.$("#s1-select");
+			await rating_select.click({delay: 100});
 
 			// Click the save button to save updates
 			let save_btn = await page.$("#save-btn");
-			save_btn.click();
+			await save_btn.click();
 			await page.waitForNavigation();
 		});
 
@@ -260,7 +260,7 @@ describe("test App end to end", async () => {
 			// Get all tag elements and click them to delete them
 			let tag_items = await page.$$(".tag");
 			for(let i = 0; i < tag_items.length; i++){
-				await tag_items.click();
+				await tag_items[i].click();
 			}
 
 			// Get the button needed to add new tags
@@ -271,12 +271,12 @@ describe("test App end to end", async () => {
 			}
 			
 			// Select a new rating of 5 stars
-			let rating_select = await page.$("#s5");
-			rating_select.click();
+			let rating_select = await page.$("#s5-select");
+			await rating_selects.click();
 
 			// Click the save button to save updates
 			let save_btn = await page.$("#save-btn");
-			save_btn.click();
+			await save_btn.click();
 			await page.waitForNavigation();
 		});