Sytax error – Even though I have already found the bug but the error still there

I am creating an app that finds the difference and checks for spelling. I am getting the same error after adding the missing curly bracket for the ‘for’ loop. I am not sure why it is repeating and the error is not going away.

Uncaught SyntaxError: Unexpected end of input

Please let me know if I am doing something wrong.

Thank you!`

const form = document.getElementById('form');
form.addEventListener('submit', (event) => {
  // Prevent the default form submission behavior
  event.preventDefault();

  // Get the original text and the copy from the form
  const originalText = form.elements.originalText.value.trim();
  const copy = form.elements.copy.value.trim();

  // Compare the original text and the copy
  if (originalText === copy) {
    alert('The texts are the same!');
  } else {
    // Display the differences between the two texts
    const differencesDiv = document.getElementById('result');
    differencesDiv.innerHTML = '';

    // Split the texts into arrays of sentences
    const originalSentences = originalText.split('. ');
    const copySentences = copy.split('. ');

    // Create a table element
    const table = document.createElement('table');
    table.classList.add('differences-table');

    // Create a row for the titles
    const titlesRow = document.createElement('tr');
    const originalTitleCell = document.createElement('th');
    originalTitleCell.innerText = 'Original';
    const copyTitleCell = document.createElement('th');
    copyTitleCell.innerText = 'New Version';

    // Append the title cells to the titles row
    titlesRow.appendChild(originalTitleCell);
    titlesRow.appendChild(copyTitleCell);

    // Append the titles row to the table
    table.appendChild(titlesRow);

       // Compare the sentences in the texts
    for (let i = 0; i < originalSentences.length; i++) {
      // Create a row for the sentence
      const row = document.createElement('tr');

      // Create cells for the original and copy sentences
      const originalCell = document.createElement('td');
      originalCell.innerHTML = originalSentences[i];
      const copyCell = document.createElement('td');
      copyCell.innerHTML = copySentences[i];

      // Set the API endpoint and your API key
      const apiEndpoint = 'https://api.webspellchecker.net/v2/spell-check-text';
      const apiKey = 'MY API KEY';

      // Check the spelling of the words in the original sentence
     fetch(apiEndpoint, {
  method: 'POST',
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    'X-Api-Key': apiKey
  },
  body: `text=${encodeURIComponent(originalSentences[i])}`
})
.then(response => response.json())
.then(data => {
  // data.result.spellCheck.errors contains an array of spelling errors in
  // the original sentence
  data.result.spellCheck.errors.forEach(error => {
    // Add the span element with the different class to the original cell
    originalCell.innerHTML = originalCell.innerHTML.replace(error.word, `<span class="different">${error.word}</span>`);
  });
});

// Append the cells to the row
row.appendChild(originalCell);
row.appendChild(copyCell);

// Append the row to the table
table.appendChild(row);
} // Closing curly bracket for the for loop

Answer

There are several issues with your code:

1. Your else condition has no closing curly bracket (‘}’)
2. It is missing a closing parenthesis and curly bracket for the event listener

Corrected code:

   const form = document.getElementById('form');
   form.addEventListener('submit', (event) => {
    // Prevent the default form submission behavior
    event.preventDefault();

   // Get the original text and the copy from the form
   const originalText = form.elements.originalText.value.trim();
   const copy = form.elements.copy.value.trim();

    // Compare the original text and the copy
    if (originalText === copy) {
      alert('The texts are the same!');
    } else {
    // Display the differences between the two texts
    const differencesDiv = document.getElementById('result');
    differencesDiv.innerHTML = '';

    // Split the texts into arrays of sentences
    const originalSentences = originalText.split('. ');
    const copySentences = copy.split('. ');

    // Create a table element
    const table = document.createElement('table');
    table.classList.add('differences-table');

    // Create a row for the titles
    const titlesRow = document.createElement('tr');
    const originalTitleCell = document.createElement('th');
    originalTitleCell.innerText = 'Original';
    const copyTitleCell = document.createElement('th');
    copyTitleCell.innerText = 'New Version';

    // Append the title cells to the titles row
    titlesRow.appendChild(originalTitleCell);
    titlesRow.appendChild(copyTitleCell);

    // Append the titles row to the table
    table.appendChild(titlesRow);

       // Compare the sentences in the texts
    for (let i = 0; i < originalSentences.length; i++) {
      // Create a row for the sentence
      const row = document.createElement('tr');

      // Create cells for the original and copy sentences
      const originalCell = document.createElement('td');
      originalCell.innerHTML = originalSentences[i];
      const copyCell = document.createElement('td');
      copyCell.innerHTML = copySentences[i];

      // Set the API endpoint and your API key
      const apiEndpoint = 'https://api.webspellchecker.net/v2/spell-check-text';
      const apiKey = 'MY API KEY';

      // Check the spelling of the words in the original sentence
     fetch(apiEndpoint, {
  method: 'POST',
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    'X-Api-Key': apiKey
  },
  body: `text=${encodeURIComponent(originalSentences[i])}`
})
.then(response => response.json())
.then(data => {
  // data.result.spellCheck.errors contains an array of spelling errors in
  // the original sentence
  data.result.spellCheck.errors.forEach(error => {
    // Add the span element with the different class to the original cell
    originalCell.innerHTML = originalCell.innerHTML.replace(error.word, `<span class="different">${error.word}</span>`);
  });
});

    // Append the cells to the row
    row.appendChild(originalCell);
    row.appendChild(copyCell);

    // Append the row to the table
    table.appendChild(row);
}

}// Closing curly bracket for the for loop
})