Step 29 build a to do list not passing

JavaScript
1

hi, totally blind, using jaws 2026, windows 11 pro, and google crhome. now the step 29 for closing the form is not passing. have researched it on google, have reset the lesson, done a hard refresh, but it is not passing, so is there hidden characters or stray characters hidden. and cannot see totally blind. so can some one help me out. have written the function a couple of times or three times, and still not passing, is it my code or a bug with fcc? so pasting my java script, errors and the link to the step.

thank you.

marvin.

ps: pasting below.

javascript:

// Get DOM elements

const taskForm = document.getElementById("task-form");

const confirmCloseDialog = document.getElementById("confirm-close-dialog");

const openTaskFormBtn = document.getElementById("open-task-form-btn");

const closeTaskFormBtn = document.getElementById("close-task-form-btn");

const cancelBtn = document.getElementById("cancel-btn");

const discardBtn = document.getElementById("discard-btn");

const tasksContainer = document.getElementById("tasks-container");

const titleInput = document.getElementById("title-input");

const dateInput = document.getElementById("date-input");

const descriptionInput = document.getElementById("description-input");



const taskData = \[\];



// ✅ Open form

openTaskFormBtn.addEventListener("click", () => {

  taskForm.classList.toggle("hidden");

});



// ✅ Close button shows confirmation dialog

closeTaskFormBtn.addEventListener("click", () => {

  confirmCloseDialog.showModal();

});



// ✅ Cancel close dialog

cancelBtn.addEventListener("click", () => {

  confirmCloseDialog.close();

});



// ✅ Discard changes and close form

discardBtn.addEventListener("click", () => {

  confirmCloseDialog.close();

  taskForm.classList.toggle("hidden");

});



// ✅ Add task

taskForm.addEventListener("submit", (e) => {

  e.preventDefault();



  const task = {

    id: \`${titleInput.value.toLowerCase().split(" ").join("-")}-${Date.now()}\`,

    title: titleInput.value,

    date: dateInput.value,

    description: descriptionInput.value,

  };



  taskData.unshift(task);

  tasksContainer.innerHTML = "";



  taskData.forEach(({ id, title, date, description }) => {

    const taskDiv = document.createElement("div");

    taskDiv.classList.add("task");

    taskDiv.id = id;



    const titleP = document.createElement("p");

    titleP.innerHTML = \`<strong>Title:</strong> ${title}\`;

    taskDiv.appendChild(titleP);



    const dateP = document.createElement("p");

    dateP.innerHTML = \`<strong>Date:</strong> ${date}\`;

    taskDiv.appendChild(dateP);



    const descP = document.createElement("p");

    descP.innerHTML = \`<strong>Description:</strong> ${description}\`;

    taskDiv.appendChild(descP);



    const editBtn = document.createElement("button");

    editBtn.type = "button";

    editBtn.classList.add("btn");

    editBtn.textContent = "Edit";

    taskDiv.appendChild(editBtn);



    const deleteBtn = document.createElement("button");

    deleteBtn.type = "button";

    deleteBtn.classList.add("btn");

    deleteBtn.textContent = "Delete";

    taskDiv.appendChild(deleteBtn);



    tasksContainer.appendChild(taskDiv);

  });



  // ✅ Toggle form hidden after submit

  taskForm.classList.toggle("hidden");



  // Reset inputs

  titleInput.value = "";

  dateInput.value = "";

  descriptionInput.value = "";

});

errors:

Sorry, your code does not pass. Try again.

You should use classList to toggle the class hidden on taskForm.

links:

2

Hi there! I’ve edited your code for readability.

And your solution works from my end. Please try one of the following steps to move forward.

Click on the “Reset” step button and force a refresh of your page with CTRL + F5 if you’re on Windows then try to paste the code in again. On other systems, please follow the instructions here.

or - Try the step in incognito or private mode.

or - Disable any/all extensions that interface with the freeCodeCamp website (such as Dark Mode, Ad Blockers, or Spellcheckers), and set your browser zoom level to 100%. Both of these factors can cause tests to fail erroneously.

or - Ensure your browser is up-to-date or try a different browser.

or - Turn off high contrast themes on Windows (from accessibility settings menu)

I hope one of these will work for you.

1 Like