From 607be600e8fdf3015b62924385217f35371d9771 Mon Sep 17 00:00:00 2001
From: Rafael Ferreira <rafaelfca.ferreira@gmail.com>
Date: Sun, 2 Jun 2024 13:53:33 -0300
Subject: [PATCH] finished writing test to add new todo using cypress

---
 core/db                     |  3 ++-
 cypress/e2e/todo-feed.cy.ts | 38 +++++++++++++++++++++++++++++++++++--
 package.json                |  2 +-
 pages/index.tsx             |  1 +
 4 files changed, 40 insertions(+), 4 deletions(-)

diff --git a/core/db b/core/db
index a9954e6..e52d909 100644
--- a/core/db
+++ b/core/db
@@ -24,5 +24,6 @@
       "content": "alo alo w brazil",
       "done": false
     }
-  ]
+  ],
+  "dogs": []
 }
diff --git a/cypress/e2e/todo-feed.cy.ts b/cypress/e2e/todo-feed.cy.ts
index b42f4d4..f192692 100644
--- a/cypress/e2e/todo-feed.cy.ts
+++ b/cypress/e2e/todo-feed.cy.ts
@@ -1,5 +1,39 @@
-describe("Todos feed", () => {
+const BASE_URL = "http://localhost:3000";
+
+describe("/ - Todos feed", () => {
     it("renders the page after loading", () => {
-        cy.visit("http://localhost:3000/")
+        cy.visit(BASE_URL)
+    })
+
+    it.only("creates a new todo after the user submits the form", () => {
+        // 0 - Intercept backend calls
+        cy.intercept("POST", `${BASE_URL}/api/todos`, (request) => {
+            request.reply({
+                statusCode: 201,
+                body: {
+                    todo: {
+                    "id": "04acb1b4-fc0b-44c9-822c-ea84efa31429",
+                    "date": "2024-06-02T16:40:41.761Z",
+                    "content": "Test todo",
+                    "done": false
+                    }
+                }
+            })
+        }).as("createTodo")
+
+        // 1 - Visit the page
+        cy.visit(BASE_URL);
+
+        // 2 - Select input and type a new todo
+        // const $inputAddTodo = cy.get("header > form > input"); Getting by cypress identifier
+        const $inputAddTodo = cy.get("input[name='Add todo']") 
+        $inputAddTodo.type("Test todo");
+
+        // 3 - Click on the submit button
+        const $btnAddTodo = cy.get("button[aria-label='Adicionar novo item']")
+        $btnAddTodo.click();
+
+        // 4 - Test if a new todo appeared on the screen
+        cy.get('tbody').contains("Test todo");
     })
 });
diff --git a/package.json b/package.json
index 8bb9902..3469462 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
     "lint:fix": "npm run lint -- --fix",
     "cy:open": "cypress open",
     "cy:run": "cypress run",
-    "test": "start-server-and-test dev http://localhost:3001 cy:run"
+    "test": "start-server-and-test dev http://localhost:3000 cy:run"
   },
   "author": "",
   "license": "ISC",
diff --git a/pages/index.tsx b/pages/index.tsx
index da4c34d..1ddaea9 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -73,6 +73,7 @@ function HomePage() {
                     });
                 }}>
                     <input 
+                        name="Add todo"
                         type="text" 
                         placeholder="Correr, Estudar..."
                         value = {newTodoContent}