diff --git a/dom-merge-conflict/tasks/buttons-and-counter/src/app.js b/dom-merge-conflict/tasks/buttons-and-counter/src/app.js index af608eb..1d355b0 100644 --- a/dom-merge-conflict/tasks/buttons-and-counter/src/app.js +++ b/dom-merge-conflict/tasks/buttons-and-counter/src/app.js @@ -3,22 +3,21 @@ function increment(node) { let current = node.textContent; node.textContent = Number(current) + 1; } +function decrement(node) { + let current = node.textContent; + node.textContent = Number(current) - 1; +} export function App() { + const body = document.createElement("body"); const header = document.createElement("header"); header.innerHTML = `
A simple counter. Press increment to increase the count by one.
+A simple counter. Press decrement to decrease the count by one.
`; body.appendChild(header); - - const main = document.createElement("main"); - main.innerHTML = ` -0
- - `; body.appendChild(main); const button = body.querySelector("#increment"); @@ -27,5 +26,11 @@ export function App() { increment(counter); }); + const button = body.querySelector("#decrement"); + const counter = body.querySelector("#counter"); + button.addEventListener("click", () => { + decrement(counter); + }); + return body; } diff --git a/dom-merge-conflict/tasks/buttons-and-counter/src/header.js b/dom-merge-conflict/tasks/buttons-and-counter/src/header.js new file mode 100644 index 0000000..b608472 --- /dev/null +++ b/dom-merge-conflict/tasks/buttons-and-counter/src/header.js @@ -0,0 +1,5 @@ +const header = document.createElement("header"); +header.innerHTML = ` +A simple counter. Press increment to increase the count by one.
+ `; \ No newline at end of file diff --git a/dom-merge-conflict/tasks/buttons-and-counter/src/main.js b/dom-merge-conflict/tasks/buttons-and-counter/src/main.js new file mode 100644 index 0000000..b28bdc1 --- /dev/null +++ b/dom-merge-conflict/tasks/buttons-and-counter/src/main.js @@ -0,0 +1,5 @@ +const main = document.createElement("main"); +main.innerHTML = ` +0
+ + `; \ No newline at end of file diff --git a/dom-merge-conflict/tasks/buttons-and-counter/test/app.test.js b/dom-merge-conflict/tasks/buttons-and-counter/test/app.test.js index 1139e45..451f7cd 100644 --- a/dom-merge-conflict/tasks/buttons-and-counter/test/app.test.js +++ b/dom-merge-conflict/tasks/buttons-and-counter/test/app.test.js @@ -17,7 +17,7 @@ describe("button and counter", () => { test("contains description paragraph with mention of 'increment' in header", () => { expect( - container.querySelector("header").querySelector("p") + container.querySelector("header").querySelector("p"), ).toHaveTextContent(/increment/i); }); @@ -35,7 +35,7 @@ describe("button and counter", () => { expect(getByTestId(container, "counter")).toHaveTextContent(/^2$/); }); - describe.skip("decrement button", () => { + describe("decrement button", () => { test("pressing Decrement decreases the counter", () => { const button = getByRole(container, "button", { name: "Decrement", @@ -49,7 +49,7 @@ describe("button and counter", () => { test("contains description paragraph with mention of 'decrement' in header", () => { expect( - container.querySelector("header").querySelector("p") + container.querySelector("header").querySelector("p"), ).toHaveTextContent(/decrement/i); }); });