Build a Real Time Counter - Build a Real Time Counter

JavaScript
1

Tell us what’s happening:

please i am stuck here, i don’t know how to pass test 6 but my code actually does as required

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 Character Counter</h1>
    <textarea name="text" id="text-input" placeholder="type something..."></textarea>
    <p id="char-count">Character Count: 0/50</p>
    <script src="script.js"></script>
    </body>
</html>
</body>


</html>

/* file: styles.css */
 textarea{
    display: block;
    width: 95%;
    height: 90px;
    margin: 20px 10px;
    justify-self: center;
 }
 p{
    font-weight: 500px;
    font-size: large;
    color: black;
 }
 h1{
    display: block;
    background-color: rgb(234, 248, 38);
    text-align: center;
    margin: 0;
 }
body{
    margin: 0;
    text-align: center;
}

/* file: script.js */
const text = document.querySelector('textarea')
const count = document.getElementById('char-count')
const maxLength = 50

  function updateCharCount(){
    let textLength = text.value.length
    count.textContent = `Character Count: ${textLength}/${maxLength}`
    if(textLength >= maxLength){
      text.value = text.value.substring(0, maxLength - 1)
      count.style.color = 'red'
      // text.value.splice(50)
    }else{
      count.style.color = 'black'
    }
  }
  text.addEventListener('input', updateCharCount)

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Safari/537.36

Challenge Information:

Build a Real Time Counter - Build a Real Time Counter

2

What’s test 6 and which part of your code implements it?

3

Try pasting in text that has more than 50 characters. What does count.textContent show?