Skip to content

Commit

Permalink
fix: fetch habit and display on webpage-mclose #20
Browse files Browse the repository at this point in the history
  • Loading branch information
@Sara-Ho99
Sara-Ho99 committed Mar 23, 2024
1 parent ceb9c01 commit f3be8fa
Show file tree
Hide file tree
Showing 2 changed files with 25 additions and 30 deletions.
10 changes: 6 additions & 4 deletions client/memo-minder-web/src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@ function App() {

// 暂时用yue实例的id和token来测试 fetchHabits, updateHabit, 和 deleteHabit 功能

const yueUserId = '65f85c5b9a50e568364f9856'; // 从Postman获取的id
const yueUserId = '65f8ec123f2a091381b1e597'; // 从Postman获取的id
// inside component
const fetchHabits = useCallback(async () => {
try {
Expand All @@ -166,6 +166,7 @@ function App() {
});

console.log('Fetched habits:', response.data);
console.log('Habits in response:', response.data.habits);
// Assuming the habits are in response.data.habits
if (response.data && Array.isArray(response.data.habits)) {
setHabits(response.data.habits);
Expand All @@ -177,7 +178,7 @@ function App() {
} catch (error) {
console.error('Failed to fetch habits:', error);
}
},[]);
},[validToken]);

useEffect(() => {
fetchHabits();
Expand All @@ -187,7 +188,8 @@ function App() {
const addHabitToServer = async (habit) => {
try {
console.debug('addHabitToServer:', habit);
if (!habit?.content || !habit?.notes) {
//if (!habit?.content || !habit?.notes) {
if (!habit?.content) {
console.warn('invalid habit, no need to post');
return;
}
Expand Down Expand Up @@ -332,7 +334,7 @@ function App() {
// clear all localStorage
localStorage.clear();
// update to default state
setHabits(habits);
// setHabits(habits);
setDailies([defaultDaily]);
setTodos([defaultTodo]);
setRewards([defaultReward]);
Expand Down
45 changes: 19 additions & 26 deletions client/memo-minder-web/src/component/taskArea/TaskArea.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const TaskArea = ({

}) => {


console.log('TaskArea habits prop:', habits);
// handle with the inputs
const [habitInput, setHabitInput] = useState('');
const [dailyInput, setDailyInput] = useState('');
Expand All @@ -34,6 +34,7 @@ const TaskArea = ({
...itemOptions
};
addItem(newItem);
console.log('New habits after adding:', newItem);
setInput('');
}
}
Expand Down Expand Up @@ -84,18 +85,6 @@ const TaskArea = ({
setShowPopup(true);
};

// handle message indicating experience changes
/*
const [messages, setMessages] = useState([]);
const addMessage = (text, type) => {
const newMessage = { id: Date.now(), text, type };
setMessages(prevMessages => [...prevMessages, newMessage]);
setTimeout(() => {
setMessages(prevMessages => prevMessages.filter(msg => msg.id !== newMessage.id));
}, 5000);
};
*/

// handle within dialog
const [editDialogVisible, setEditDialogVisible] = useState(false);
const [editingItem, setEditingItem] = useState(null);
Expand Down Expand Up @@ -223,6 +212,9 @@ const TaskArea = ({
const filteredDailies = filterItemsByTab(dailies, selectedDailyTab, dailyTabMap);
const filteredTodos = filterItemsByTab(todos, selectedTodoTab, todoTabMap);

// Right before the return statement to log the filtered habits before rendering
console.log('Filtered habits before rendering:', filteredHabits);

return (
<div className="taskAreaContainer">
<Popup show={showPopup} onClose={closePopup} message={popupMessage} />
Expand Down Expand Up @@ -261,19 +253,20 @@ const TaskArea = ({
{/* Habit List */}
<div className="taskList">
{/* Individual Habit Item */}
{filteredHabits.map(habit => (
<div className="habitItem" key={habit._id}>
{habit.positive && <button onClick={() => {
handlePositiveClick(habit._id);

}}>+</button>}
<p onClick={() => handleItemClick(habit, 'Habit')}>{habit.content}</p>
{habit.negative && <button onClick={() => {
handleNegativeClick(habit._id);

}}>-</button>}
</div>
))}
{filteredHabits.map(habit => {
console.log('Rendering habit with key:', habit._id);
return (
<div className="habitItem" key={habit._id}>
{(habit.type === 'positive' || habit.type === 'both') && (
<button onClick={() => handlePositiveClick(habit._id)}>+</button>
)}
<p onClick={() => handleItemClick(habit, 'Habit')}>{habit.title}</p>
{(habit.type === 'negative' || habit.type === 'both') && (
<button onClick={() => handleNegativeClick(habit._id)}>-</button>
)}
</div>
);
})}
{/* Add more habit items here */}
</div>
</div>
Expand Down

1 comment on commit f3be8fa

@heystone999
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Coverage report for fronend

Caution

Test run failed

St.❔
 Category Percentage Covered / Total
🔴 Statements 29.04% 230/792
🔴 Branches 17.38% 57/328
🔴 Functions 18.43% 40/217
🔴 Lines 29.18% 220/754

Test suite run failed

Failed tests: 5/13. Failed suites: 2/4. 
  ● updates a habit correctly

    TestingLibraryElementError: Unable to find an element with the text: Drink water. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div
          class="taskAreaContainer"
        >
          <div
            class="controlButton"
          >
            <div
              class="clearButtonContainer"
            >
              <button
                class="clearButton"
              >
                Clear and Reset
              </button>
            </div>
            <div
              class="task-button-container"
            >
              <div
                class="add-task-button-container"
              >
                <button
                  class="add-task-button"
                >
                  Add Task
                </button>
              </div>
            </div>
          </div>
          <div
            class="taskAreaSections"
          >
            <div
              class="taskAreaSection"
            >
              <h2>
                Habits
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Good
                </button>
                <button>
                  Bad
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="habitInputContainer"
                >
                  <input
                    class="habitInput"
                    placeholder="Add a habit"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                >
                  <div
                    class="habitItem"
                  >
                    <p />
                  </div>
                </div>
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Dailies
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Due
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="dailyInputContainer"
                >
                  <input
                    class="dailyInput"
                    placeholder="Add a daily"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                To Do Lists
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Scheduled
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="todoInputContainer"
                >
                  <input
                    class="todoInput"
                    placeholder="Add a To Do"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Rewards
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="rewardInputContainer"
                >
                  <input
                    class="rewardInput"
                    placeholder="Add a Reward"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
          </div>
        </div>
      </div>
    </body>

      83 |   );
      84 |
    > 85 |   const habitItem = screen.getByText('Drink water');
         |                            ^
      86 |   fireEvent.click(habitItem);
      87 |
      88 |   expect(onUpdateHabitMock).not.toHaveBeenCalled();

      at Object.getElementError (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/config.js:37:19)
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
      at getByText (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:95:19)
      at Object.<anonymous> (src/component/taskArea/TaskArea.test.js:85:28)

  ● deletes a habit correctly

    TestingLibraryElementError: Unable to find an element with the text: Drink water. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div
          class="taskAreaContainer"
        >
          <div
            class="controlButton"
          >
            <div
              class="clearButtonContainer"
            >
              <button
                class="clearButton"
              >
                Clear and Reset
              </button>
            </div>
            <div
              class="task-button-container"
            >
              <div
                class="add-task-button-container"
              >
                <button
                  class="add-task-button"
                >
                  Add Task
                </button>
              </div>
            </div>
          </div>
          <div
            class="taskAreaSections"
          >
            <div
              class="taskAreaSection"
            >
              <h2>
                Habits
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Good
                </button>
                <button>
                  Bad
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="habitInputContainer"
                >
                  <input
                    class="habitInput"
                    placeholder="Add a habit"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                >
                  <div
                    class="habitItem"
                  >
                    <p />
                  </div>
                </div>
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Dailies
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Due
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="dailyInputContainer"
                >
                  <input
                    class="dailyInput"
                    placeholder="Add a daily"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                To Do Lists
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Scheduled
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="todoInputContainer"
                >
                  <input
                    class="todoInput"
                    placeholder="Add a To Do"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Rewards
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="rewardInputContainer"
                >
                  <input
                    class="rewardInput"
                    placeholder="Add a Reward"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
          </div>
        </div>
      </div>
    </body>

      126 |   );
      127 |
    > 128 |   const habitItem = screen.getByText('Drink water');
          |                            ^
      129 |   fireEvent.click(habitItem);
      130 |
      131 |   const deleteButton = screen.getByText(`Delete this Habit`);

      at Object.getElementError (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/config.js:37:19)
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
      at getByText (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:95:19)
      at Object.<anonymous> (src/component/taskArea/TaskArea.test.js:128:28)

  ● updates health when positive habit is clicked

    TestingLibraryElementError: Unable to find an element with the text: +. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div
          class="taskAreaContainer"
        >
          <div
            class="controlButton"
          >
            <div
              class="clearButtonContainer"
            >
              <button
                class="clearButton"
              >
                Clear and Reset
              </button>
            </div>
            <div
              class="task-button-container"
            >
              <div
                class="add-task-button-container"
              >
                <button
                  class="add-task-button"
                >
                  Add Task
                </button>
              </div>
            </div>
          </div>
          <div
            class="taskAreaSections"
          >
            <div
              class="taskAreaSection"
            >
              <h2>
                Habits
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Good
                </button>
                <button>
                  Bad
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="habitInputContainer"
                >
                  <input
                    class="habitInput"
                    placeholder="Add a habit"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                >
                  <div
                    class="habitItem"
                  >
                    <p />
                  </div>
                </div>
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Dailies
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Due
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="dailyInputContainer"
                >
                  <input
                    class="dailyInput"
                    placeholder="Add a daily"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                To Do Lists
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Scheduled
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="todoInputContainer"
                >
                  <input
                    class="todoInput"
                    placeholder="Add a To Do"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Rewards
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="rewardInputContainer"
                >
                  <input
                    class="rewardInput"
                    placeholder="Add a Reward"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
          </div>
        </div>
      </div>
    </body>

      163 |   );
      164 |
    > 165 |   const positiveHabitButton = screen.getByText('+');
          |                                      ^
      166 |   fireEvent.click(positiveHabitButton);
      167 |
      168 |   expect(updateLevelMock).toHaveBeenCalled();

      at Object.getElementError (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/config.js:37:19)
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
      at getByText (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:95:19)
      at Object.<anonymous> (src/component/taskArea/TaskArea.test.js:165:38)

  ● updates health when negative habit is clicked

    TestingLibraryElementError: Unable to find an element with the text: -. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div
          class="taskAreaContainer"
        >
          <div
            class="controlButton"
          >
            <div
              class="clearButtonContainer"
            >
              <button
                class="clearButton"
              >
                Clear and Reset
              </button>
            </div>
            <div
              class="task-button-container"
            >
              <div
                class="add-task-button-container"
              >
                <button
                  class="add-task-button"
                >
                  Add Task
                </button>
              </div>
            </div>
          </div>
          <div
            class="taskAreaSections"
          >
            <div
              class="taskAreaSection"
            >
              <h2>
                Habits
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Good
                </button>
                <button>
                  Bad
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="habitInputContainer"
                >
                  <input
                    class="habitInput"
                    placeholder="Add a habit"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                >
                  <div
                    class="habitItem"
                  >
                    <p />
                  </div>
                </div>
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Dailies
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Due
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="dailyInputContainer"
                >
                  <input
                    class="dailyInput"
                    placeholder="Add a daily"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                To Do Lists
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
                <button>
                  Scheduled
                </button>
                <button>
                  Completed
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="todoInputContainer"
                >
                  <input
                    class="todoInput"
                    placeholder="Add a To Do"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
            <div
              class="taskAreaSection"
            >
              <h2>
                Rewards
              </h2>
              <div
                class="taskAreaNav"
              >
                <button>
                  All
                </button>
              </div>
              <div
                class="contentContainer"
              >
                <div
                  class="rewardInputContainer"
                >
                  <input
                    class="rewardInput"
                    placeholder="Add a Reward"
                    type="text"
                    value=""
                  />
                </div>
                <div
                  class="taskList"
                />
              </div>
            </div>
          </div>
        </div>
      </div>
    </body>

      194 |   );
      195 |
    > 196 |   const negativeHabitButton = screen.getByText('-');
          |                                      ^
      197 |   fireEvent.click(negativeHabitButton);
      198 |
      199 |   expect(updateHealthMock).toHaveBeenCalled();

      at Object.getElementError (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/config.js:37:19)
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
      at getByText (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:95:19)
      at Object.<anonymous> (src/component/taskArea/TaskArea.test.js:196:38)


  ● health and level integration test

    TestingLibraryElementError: Unable to find an element with the text: -. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div>
          <div>
            <nav>
              <div
                class="nav-left"
              >
                <a
                  class="logo"
                  href="/"
                >
                  MEMO MINDER
                </a>
                <a
                  class=""
                  href="/"
                >
                  <span>
                    Tasks
                  </span>
                </a>
                <a
                  class=""
                  href="/"
                >
                  <span>
                    Shops
                  </span>
                </a>
                <a
                  class=""
                  href="/"
                >
                  <span>
                    Challenges
                  </span>
                </a>
                <a
                  class=""
                  href="/"
                >
                  <span>
                    Milestones
                  </span>
                </a>
              </div>
              <div
                class="nav-middle"
              />
              <div
                class="nav-right"
              >
                <div
                  class="coin"
                >
                  <img
                    alt=""
                    class="coin-icon"
                    src="/coin.png"
                  />
                  <div
                    class="coin-number"
                  >
                    0
                  </div>
                </div>
                <div
                  class="user"
                >
                  <img
                    alt=""
                    class="user-pic"
                    src="/user-pic.png"
                  />
                  <span
                    class="user-name"
                  >
                    Ray
                  </span>
                </div>
              </div>
              <div
                class="user-menu inactive"
              >
                <ul>
                  <li
                    class="user-menu-item"
                  >
                    <a
                      class="logout-link"
                      href="/login"
                    >
                       
                      Log Out
                       
                    </a>
                  </li>
                </ul>
              </div>
            </nav>
            <div
              style="display: flex; flex-direction: column;"
            >
              <div
                class="header"
              >
                <div
                  class="user"
                >
                  <div
                    class="user-character"
                  >
                    <img
                      alt=""
                      class="user-character-pic"
                      src="/char-pic.png"
                    />
                  </div>
                  <div
                    class="user-character-info"
                  >
                    <div
                      class="username"
                    >
                      Ray
                    </div>
                    <div
                      class="user-data"
                    >
                      <div
                        class="health"
                      >
                        <img
                          alt=""
                          src="/heart.png"
                        />
                        <div
                          class="health-bar"
                        >
                          <div
                            class="health-level"
                            style="width: 100%;"
                          />
                        </div>
                        <span>
                          100
                          /100
                        </span>
                      </div>
                      <div
                        class="level"
                      >
                        <img
                          alt=""
                          src="/star.png"
                        />
                        <div
                          class="level-bar"
                        >
                          <div
                            class="level-level"
                            style="width: 0%;"
                          />
                        </div>
                        <span>
                          Level 
                          1
                          : 
                          0
                          /100
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="bag"
                >
                  <div
                    class="bag-name"
                  >
                    Bag
                  </div>
                  <div
                    class="bought-items-images"
                  />
                </div>
              </div>
              <div>
                <div
                  class="taskAreaContainer"
                >
                  <div
                    class="controlButton"
                  >
                    <div
                      class="clearButtonContainer"
                    >
                      <button
                        class="clearButton"
                      >
                        Clear and Reset
                      </button>
                    </div>
                    <div
                      class="task-button-container"
                    >
                      <div
                        class="add-task-button-container"
                      >
                        <button
                          class="add-task-button"
                        >
                          Add Task
                        </button>
                      </div>
                    </div>
                  </div>
                  <div
                    class="taskAreaSections"
                  >
                    <div
                      class="taskAreaSection"
                    >
                      <h2>
                        Habits
                      </h2>
                      <div
                        class="taskAreaNav"
                      >
                        <button>
                          All
                        </button>
                        <button>
                          Good
                        </button>
                        <button>
                          Bad
                        </button>
                      </div>
                      <div
                        class="contentContainer"
                      >
                        <div
                          class="habitInputContainer"
                        >
                          <input
                            class="habitInput"
                            placeholder="Add a habit"
                            type="text"
                            value=""
                          />
                        </div>
                        <div
                          class="taskList"
                        />
                      </div>
                    </div>
                    <div
                      class="taskAreaSection"
                    >
                      <h2>
                        Dailies
                      </h2>
                      <div
                        class="taskAreaNav"
                      >
                        <button>
                          All
                        </button>
                        <button>
                          Due
                        </button>
                        <button>
                          Completed
                        </button>
                      </div>
                      <div
                        class="contentContainer"
                      >
                        <div
                          class="dailyInputContainer"
                        >
                          <input
                            class="dailyInput"
                            placeholder="Add a daily"
                            type="text"
                            value=""
                          />
                        </div>
                        <div
                          class="taskList"
                        >
                          <div
                            class="dailyItem "
                          >
                            <button>
                              +
                            </button>
                            <p>
                              Your default daily
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div
                      class="taskAreaSection"
                    >
                      <h2>
                        To Do Lists
                      </h2>
                      <div
                        class="taskAreaNav"
                      >
                        <button>
                          All
                        </button>
                        <button>
                          Scheduled
                        </button>
                        <button>
                          Completed
                        </button>
                      </div>
                      <div
                        class="contentContainer"
                      >
                        <div
                          class="todoInputContainer"
                        >
                          <input
                            class="todoInput"
                            placeholder="Add a To Do"
                            type="text"
                            value=""
                          />
                        </div>
                        <div
                          class="taskList"
                        >
                          <div
                            class="todoItem "
                          >
                            <button>
                              +
                            </button>
                            <p>
                              Your default to-do
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div
                      class="taskAreaSection"
                    >
                      <h2>
                        Rewards
                      </h2>
                      <div
                        class="taskAreaNav"
                      >
                        <button>
                          All
                        </button>
                      </div>
                      <div
                        class="contentContainer"
                      >
                        <div
                          class="rewardInputContainer"
                        >
                          <input
                            class="rewardInput"
                            placeholder="Add a Reward"
                            type="text"
                            value=""
                          />
                        </div>
                        <div
                          class="taskList"
                        >
                          <div
                            class="rewardItem"
                          >
                            <button>
                              10
                               coins
                            </button>
                            <p>
                              Your default reward
                            </p>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </body>

      12 |
      13 |     // Trigger a negative habit click
    > 14 |     fireEvent.click(screen.getByText('-'));
         |                            ^
      15 |
      16 |     // Health should decrease by 10
      17 |     expect(screen.getByText('90/100')).toBeInTheDocument();

      at Object.getElementError (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/config.js:37:19)
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
      at node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
      at getByText (node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:95:19)
      at Object.<anonymous> (src/tests/AppIntegration.test.js:14:28)

Report generated by 🧪jest coverage report action from f3be8fa

Please sign in to comment.