Build a Real Time Counter - Build a Real Time Counter

JavaScript
1

Tell us what’s happening:

Please I need help.
The last test refused to pass.
When the input.value.length is 50 , other functionality works except the input refusing to stop accepting more text.
Please I need help

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>Real Time Counter</title>
<link rel="stylesheet" href="styles.css">
</head>

<body>
<h1>Real Time Counter</h1>
<textarea id="text-input"></textarea>
<p id="char-count">Character Count: 0/50</p>
<script src="script.js"></script>
</body>


</html>

/* file: styles.css */
#text-input, #char-count {
  margin: 60px auto 0px!important ;
  display: block;
  padding: 20px
}

#char-count {
  margin: 0px auto 60px!important ;
    display: inline;
  padding-left: 35%
}
h1{
  text-align: center
}

/* file: script.js */
const textArea = document.getElementById("text-input")
const charCount = document.getElementById("char-count")
textArea.addEventListener("input", ()=>{
if (textArea.value.length < 50){
  charCount.textContent = `Character Count: ${textArea.value.length}/50`
charCount.style.color = "black"

}
if (textArea.value.length === 50){
charCount.style.color = "red"
textArea.value.slice(0, 50)
  charCount.textContent = `Character Count: ${textArea.value.length}/50`

}
})

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36 OPR/90.0.0.0

Challenge Information:

Build a Real Time Counter - Build a Real Time Counter
https://www.freecodecamp.org/learn/full-stack-developer/lab-real-time-counter/build-a-real-time-counter

2

what if it becomes 60 all at once because someone pasted text?

1 Like
3

Yeah, it’s true.
Thanks.
I have assigned the correct logic, but the text input is still accepting more text. It is not cutting-off extra text.

4

what do you think this line is doing? because it is not changing textArea.value

6

Good, thanks I have gotten it