diff --git a/chapter6/5_web_sockets_and_http_requests/1_http_requests/domController.js b/chapter6/5_web_sockets_and_http_requests/1_http_requests/domController.js index 1448259..de659f7 100644 --- a/chapter6/5_web_sockets_and_http_requests/1_http_requests/domController.js +++ b/chapter6/5_web_sockets_and_http_requests/1_http_requests/domController.js @@ -28,12 +28,12 @@ const updateItemList = inventory => { window.document.body.appendChild(p); }; -const handleAddItem = event => { +const handleAddItem = async event => { // Prevent the page from reloading as it would by default event.preventDefault(); const { name, quantity } = event.target.elements; - addItem(name.value, parseInt(quantity.value, 10)); + await addItem(name.value, parseInt(quantity.value, 10)); history.pushState({ inventory: { ...data.inventory } }, document.title); diff --git a/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.js b/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.js index f7442c1..63962e3 100644 --- a/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.js +++ b/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.js @@ -1,12 +1,12 @@ const data = { inventory: {} }; -const API_ADDR = "http://localhost:3000"; +const API_ADDR = "http://127.0.0.1:3000"; -const addItem = (itemName, quantity) => { +const addItem = async (itemName, quantity) => { const currentQuantity = data.inventory[itemName] || 0; data.inventory[itemName] = currentQuantity + quantity; - fetch(`${API_ADDR}/inventory/${itemName}`, { + await fetch(`${API_ADDR}/inventory/${itemName}`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ quantity }) diff --git a/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.test.js b/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.test.js index dc36553..78cf0c2 100644 --- a/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.test.js +++ b/chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.test.js @@ -1,7 +1,7 @@ const nock = require("nock"); const { API_ADDR, addItem, data } = require("./inventoryController"); -describe("addItem", () => { +describe("addItem", async () => { test("adding new items to the inventory", () => { // Respond to all post requests // to POST /inventory/:itemName @@ -9,16 +9,16 @@ describe("addItem", () => { .post(/inventory\/.*$/) .reply(200); - addItem("cheesecake", 5); + await addItem("cheesecake", 5); expect(data.inventory.cheesecake).toBe(5); }); - test("sending requests when adding new items", () => { + test("sending requests when adding new items", async () => { nock(API_ADDR) .post("/inventory/cheesecake", JSON.stringify({ quantity: 5 })) .reply(200); - addItem("cheesecake", 5); + await addItem("cheesecake", 5); if (!nock.isDone()) throw new Error("POST /inventory/cheesecake was not reached"); diff --git a/chapter6/5_web_sockets_and_http_requests/1_http_requests/main.test.js b/chapter6/5_web_sockets_and_http_requests/1_http_requests/main.test.js index b62bbbe..665280a 100644 --- a/chapter6/5_web_sockets_and_http_requests/1_http_requests/main.test.js +++ b/chapter6/5_web_sockets_and_http_requests/1_http_requests/main.test.js @@ -60,6 +60,8 @@ test("persists items between sessions", async () => { fireEvent.click(submitBtn); + await screen.findByText("cheesecake - Quantity: 6"); + const itemListBefore = document.getElementById("item-list"); expect(itemListBefore.childNodes).toHaveLength(1); expect( @@ -80,7 +82,7 @@ test("persists items between sessions", async () => { }); describe("adding items", () => { - test("updating the item list", () => { + test("updating the item list", async () => { nock(API_ADDR) .post(/inventory\/.*$/) .reply(200); @@ -97,11 +99,13 @@ describe("adding items", () => { fireEvent.click(submitBtn); + await screen.findByText("cheesecake - Quantity: 6"); + const itemList = document.getElementById("item-list"); expect(getByText(itemList, "cheesecake - Quantity: 6")).toBeInTheDocument(); }); - test("sending a request to update the item list", () => { + test("sending a request to update the item list", async () => { nock(API_ADDR) .post("/inventory/cheesecake", JSON.stringify({ quantity: 6 })) .reply(200); @@ -117,12 +121,13 @@ describe("adding items", () => { fireEvent.input(quantityField, { target: { value: "6" }, bubbles: true }); fireEvent.click(submitBtn); + await screen.findByText("cheesecake - Quantity: 6"); if (!nock.isDone()) throw new Error("POST /inventory/cheesecake was not reached"); }); - test("undo to one item", done => { + test("undo to one item", async () => { // You must specify the encoded URL here because // nock struggles with encoded urls nock(API_ADDR) @@ -143,6 +148,8 @@ describe("adding items", () => { }); fireEvent.input(quantityField, { target: { value: "6" }, bubbles: true }); fireEvent.click(submitBtn); + + await screen.findByText("cheesecake - Quantity: 6"); fireEvent.input(itemField, { target: { value: "carrot cake" }, @@ -151,19 +158,20 @@ describe("adding items", () => { fireEvent.input(quantityField, { target: { value: "5" }, bubbles: true }); fireEvent.click(submitBtn); + await screen.findByText("carrot cake - Quantity: 5"); + window.addEventListener("popstate", () => { const itemList = document.getElementById("item-list"); expect(itemList.children).toHaveLength(1); expect( getByText(itemList, "cheesecake - Quantity: 6") ).toBeInTheDocument(); - done(); }); fireEvent.click(screen.getByText("Undo")); }); - test("undo to empty list", done => { + test("undo to empty list", async () => { nock(API_ADDR) .post(/inventory\/.*$/) .reply(200); @@ -179,13 +187,14 @@ describe("adding items", () => { fireEvent.input(quantityField, { target: { value: "6" }, bubbles: true }); fireEvent.click(submitBtn); + + await screen.findByText("cheesecake - Quantity: 6"); expect(history.state).toEqual({ inventory: { cheesecake: 6 } }); window.addEventListener("popstate", () => { const itemList = document.getElementById("item-list"); expect(itemList).toBeEmpty(); - done(); }); fireEvent.click(screen.getByText("Undo"));