Build a Palindrome Checker Project - Build a Palindrome Checker

Tell us what’s happening:

Hello there, freecodecamp community!
I have stucked with palindrome project. I made script, that perfectly doing what he must ,according to tests, but seems it isn’t enough for passing. Don’t understand what I should to change/add/remove.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Palindrome</title>
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <div>
      <input id="text-input"></input>
      <button id="check-btn">Check</button>
    </div>
<div id="result"></div>
<script src="./script.js"></script>
  </body>
</html>

/* file: styles.css */

/* file: script.js */
const input = document.getElementById("text-input");
const button = document.getElementById("check-btn");
const result = document.getElementById("result");

const Submit = (e) => {
  e.preventDefault();
  inputChecker();
};

const enterSubmit = () => {
  if (e.key === "Enter") {
    e.preventDefault();
    inputChecker();
  }
};

const inputChecker = () => {
  const inputVal = input.value.trim();
  if (inputVal.length === 0) {
    alert("Please input a value");
    return;
  } else {
    Polindrome(inputVal);
    input.value = "";
  }
};

const Polindrome = (str) => {
  const regex = /[^a-zA-Z0-9]/g;
  const cleanedStr = str.toLowerCase().replace(regex, "");
  const reversedStr = cleanedStr.split("").reverse().join("");
  if (cleanedStr === reversedStr) {
    result.textContent = `"${str} is a palindrome"`;
  } else {
    result.textContent = `"${str} is not a palindrome"`;
  }
};

button.addEventListener("click", Submit);
input.addEventListener("keydown", enterSubmit);

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36

Challenge Information:

Build a Palindrome Checker Project - Build a Palindrome Checker

Maybe you need to remove the quotes from the output

Thanks for your respond!
But, unfortunately, I’ve tried it with and without quotes. Nothing change

Could you share the version without quotes?

Of course, here

const input = document.getElementById("text-input");
const button = document.getElementById("check-btn");
const result = document.getElementById("result");

const Submit = (e) => {
  e.preventDefault();
  inputChecker();
};

const enterSubmit = () => {
  if (e.key === "Enter") {
    e.preventDefault();
    inputChecker();
  }
};

const inputChecker = () => {
  const inputVal = input.value.trim();
  if (inputVal.length === 0) {
    alert("Please input a value");
    return;
  } else {
    Polindrome(inputVal);
    input.value = "";
  }
};

const Polindrome = (str) => {
  const regex = /[^a-zA-Z0-9]/g;
  const cleanedStr = str.toLowerCase().replace(regex, "");
  const reversedStr = cleanedStr.split("").reverse().join("");
  if (cleanedStr === reversedStr) {
    result.textContent = `${str} is a palindrome`;
  } else {
    result.textContent = `${str} is not a palindrome`;
  }
};

button.addEventListener("click", Submit);
input.addEventListener("keydown", enterSubmit);

and this one doesn’t pass for you?

unfortunately, didn’t pass even w/o qoutes :frowning:

Your html with that JavaScript passes for me

Well, I’ve reviewed my code and tested it in manual mode (to be sure, that I receive only that result, that requirement need) and I have the right result in browser.

I’m little bit confused right now. I still can’t pass it.

can you check if there are errors in the browser console when you run the tests with F12?
Also, can you try deactivating your browser extensions?

I don’t know how, but now it have passed! Thanks a lot :heart:

1 Like

Thanks for reviewing and testing the code. Glad to hear it’s producing the desired result in the browser. Let me know if you need further assistance.

No more of this, or your account will be silenced, thanks