Listening keydown events from a pdf embedded on an iframe react

I am developing a web page where I need to fill some forms with information provided from a Pdf file. For this, I used Iframe to show the pdf and its content. To move around the forms, I am using hotkeys but when I focus on the pdf file the hotkeys does not work. That is why i try adding an event listener on the react component where the i frame is but it does not work.

const Viewer = () => {
  const iframe = useRef()
  
    useEffect(() => {       
      function onKeyup(e) {        
        if (e.key ) alert('you pressed a key')
        const message = "you pressed a key" 
        window.parent.postMessage(message, '*');          
      }
      document.getElementById('iframe').contentWindow.document.addEventListener('keydown', onKeyup);
      return () =>  document.getElementById('iframe').contentWindow.document.removeEventListener('keydown', onKeyup);
    }, []);
  

 

  return (
    <div className="h-full w-full ">
      <iframe id='iframe'
             
            className="h-full w-full"
            src={file}
            type='application/pdf'
            title='title'
          />
    </div>
  )
}

export default Viewer