When I am passing all test cases in the input manually, it is working but free code camp is still giving me an error. Please help me to find a solution to pass this test.
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 Checker App</title>
<link rel="stylesheet" src="styles.css"/>
</head>
<body>
<input id="text-input" type="text" value=""/>
<button id="check-btn">Check</button>
<div id="result"></div>
<script src="script.js"></script>
</body>
</html>
/* file: styles.css */
/* file: script.js */
const checkButton = document.getElementById("check-btn");
const textInput = document.getElementById("text-input");
const resultElement = document.getElementById("result");
let input = "";
let textValue = "";
let originalText = "";
let reversedText = "";
textInput.addEventListener("change", (event) => {
// converting user input into lowercase and removing any spaces between the words.
input = (event.target.value)
textValue = input.toLowerCase().split(" ").join("");
console.log(textValue);
// removing any punctuation from user input
const punctuation = /[\.,!?]/g;
originalText = textValue.replace(punctuation, "");
reversedText = originalText.split("").reverse().join("");
console.log(originalText);
console.log(reversedText);
})
checkButton.addEventListener("click", () => {
if(textValue === ""){
alert("Please input a value");
}
else if(originalText === reversedText){
resultElement.innerText = input +" is a palindrome";
} else if(originalText !== reversedText){
resultElement.innerText = input +" is not a palindrome";
}
})
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36
Challenge Information:
Build a Palindrome Checker Project - Build a Palindrome Checker