Tengo este código en App.js. La voz en off de Mac puede detectar todos los elementos de esta página y sigue deletreando el texto de cada uno de ellos.

 const WelcomePage = () => { const [isWarningPage, setisWarningPage] = useState(false); if (!isWarningPage) { return ( <> <div class="container-fluid"> <div className="welcome-section"> <div className="logo-container"> <img src={logo} alt="" /> </div> <div className="welcome-content"> <h2 aria-level="1">Welcome to My Website</h2> <h5 aria-level="5"> Connecting you to my web. </h5> <h5 className="child2" aria-level="5"> We are happy to see you. </h5> </div> <div> <button onClick={() => setisWarningPage(true)} id="GetStartedBtn" aria-label="Get Started" > Get Started </button> </div> </div> </div> </> ); } return PhishingWarningPage; };

Pero, cuando hago clic en el botón "Comenzar", Voice Over de Mac no puede detectar el componente montado (página de advertencia). Luego enfoqué el elemento usando algo de javascript. ¿Por qué sucede?

¿Cuáles son mis opciones aquí?

¡Gracias!