Skip to content

Missing async/await in addItem since add fetch #30

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Missing async/await in addItem since add fetch #30

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions chapter6/5_web_sockets_and_http_requests/1_http_requests/domController.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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);

Expand Down
6 changes: 3 additions & 3 deletions chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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 })
Expand Down
8 changes: 4 additions & 4 deletions chapter6/5_web_sockets_and_http_requests/1_http_requests/inventoryController.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
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
nock(API_ADDR)
.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");
Expand Down
21 changes: 15 additions & 6 deletions chapter6/5_web_sockets_and_http_requests/1_http_requests/main.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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(
Expand All @@ -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);
Expand All @@ -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);
Expand All @@ -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)
Expand All @@ -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" },
Expand All @@ -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);
Expand All @@ -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"));
Expand Down