London | May-26 | Liridona Shehu | Sprint 3| Merge conflicts

dom-merge-conflict/tasks/buttons-and-counter/src/app.js

@@ -11,6 +11,7 @@ export function App() {
   header.innerHTML = `
         <h1>Number Counter</h1>
         <p>A simple counter. Press increment to increase the count by one.</p>
+        <button id="decrement">Decrement</button>
     `;
   body.appendChild(header);
 

dom-merge-conflict/tasks/buttons-and-counter/src/header.js

@@ -0,0 +1,6 @@
+const header = document.createElement("header");
+header.innerHTML = `
+        <h1>Number Counter</h1>
+        <p>A simple counter. Press increment to increase the count by one.</p>
+    `;
+body.appendChild(header);

dom-merge-conflict/tasks/buttons-and-counter/src/main.js

@@ -0,0 +1,6 @@
+const main = document.createElement("main");
+main.innerHTML = `
+        <p id="counter" data-testid="counter">0</p>
+        <button id="increment">Increment</button>
+    `;
+body.appendChild(main);

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);
     });
   });