mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-07 20:31:06 -05:00
Trigger PDF.js canvas redraw on document visibility change (#18446)
GitOrigin-RevId: 44b3ce3ebd8b0e48c51451bbfc5c2d54397a9355
This commit is contained in:
parent
6569f49a92
commit
3434d8c908
1 changed files with 30 additions and 0 deletions
|
@ -402,6 +402,36 @@ function PdfJsViewer({ url, pdfFile }) {
|
||||||
[initialised, setZoom]
|
[initialised, setZoom]
|
||||||
)
|
)
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Work around an issue in Chrome 125 that causes canvas elements to become blank
|
||||||
|
* when a tab is inactive, by making the canvas redraw when the tab becomes active.
|
||||||
|
* https://github.com/mozilla/pdf.js/issues/18100
|
||||||
|
* https://issues.chromium.org/issues/339654395
|
||||||
|
* This can be removed once Chrome 127 is widely available.
|
||||||
|
*/
|
||||||
|
useEffect(() => {
|
||||||
|
const listener = () => {
|
||||||
|
if (document.visibilityState !== 'hidden' && pdfJsWrapper) {
|
||||||
|
window.setTimeout(() => {
|
||||||
|
for (const canvas of pdfJsWrapper.container.querySelectorAll(
|
||||||
|
'canvas'
|
||||||
|
)) {
|
||||||
|
canvas.style.display = 'none'
|
||||||
|
window.setTimeout(() => {
|
||||||
|
canvas.style.display = 'block'
|
||||||
|
}, 1)
|
||||||
|
}
|
||||||
|
}, 100)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('visibilitychange', listener)
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
document.removeEventListener('visibilitychange', listener)
|
||||||
|
}
|
||||||
|
}, [pdfJsWrapper])
|
||||||
|
|
||||||
/* eslint-disable jsx-a11y/no-noninteractive-tabindex */
|
/* eslint-disable jsx-a11y/no-noninteractive-tabindex */
|
||||||
/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
|
/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
|
||||||
return (
|
return (
|
||||||
|
|
Loading…
Reference in a new issue