React 18 in the strict mode calls the useEffect twice.
PDFViewer adds a state to the browser history stack in the full screen mode. This push allows the user to use the browser's back functionality to close the file and without it, the user who assumes the full screen file is a new page, might go back to the previous page unintentionally.
In the development mode, the return function of the useEffect of PDFViewer is called, which in turn triggers the onClose. Triggering onClose might reverse the state that opened the PDFVIewer in the first place, closing the second mount of React 18. The user will practically will never see the PDFViewer as it closes before rendering the file.
This behavior only happens when the file is set to full screen from the beginning.
The behavior only affects the development mode and production mode remains unaffected.
React 18 in the strict mode calls the
useEffecttwice.PDFVieweradds a state to the browser history stack in the full screen mode. This push allows the user to use the browser's back functionality to close the file and without it, the user who assumes the full screen file is a new page, might go back to the previous page unintentionally.In the development mode, the return function of the
useEffectofPDFVieweris called, which in turn triggers theonClose. TriggeringonClosemight reverse the state that opened thePDFVIewerin the first place, closing the second mount of React 18. The user will practically will never see thePDFVieweras it closes before rendering the file.This behavior only happens when the file is set to
full screenfrom the beginning.The behavior only affects the development mode and production mode remains unaffected.