0
179
Viewswindow.print() not working inside useeffect (or anywhere on page)
I am trying to call window.print() and nothing happens. In the same place, I try window.alert('test') and it works.
any ideas?
a different page in my application does successfully call window.print() so I'm thinking it's not a printing setting on my machine
1 answers
Answer question0
window.print was being blocked by an element on the page.
I got it to work using the react-to-print. If you look at the code behind react to print, you'll see it doesn't quite use window.print, rather some other thing like (target.contentWindow.print();). And in the readme of it, you can see it was explicitly created for scenarios where window.print was blocked - like firefox. 
Implementation of this is like this:
- add a useRef variable and set it to an element on the page (either a div perhaps or else a component.
const componentRef = useRef(); const handlePrint = useReactToPrint({ content: () => componentRef.current!})
<div css={{ display: 'none', '@media print': { display: 'block' } }} ref={componentRef}> <CoversheetPrint {...coversheetData} />
</div>
https://github.com/gregnb/react-to-print/search?q=window.print