Embedding a Google Doc in my React site sometimes triggers a ‘DOCS_timing is undefined’ error. Example:
<iframe title='doc-view' src={embedLink} onLoad={onInit} style={frameStyle} allow='fullscreen'></iframe>
After dealing with a similar issue, I found that the error usually comes from timing conflicts between the document loading and the initialization function. In my experience, delaying the onLoad call slightly or triggering initialization only after confirming that the iframe content has fully loaded can help resolve the issue. I addressed this by adding a verification step that checks if the embedded document has fully rendered before executing any further code. This additional check often prevents timing issues, especially in scenarios with slower network conditions.
A similar issue occurred for me when the document rendering overlapped with React’s re-render cycles. In my case, creating a dedicated component for the iframe and using a memoization technique helped prevent redundant onLoad activations. This change ensured that the iframe was rendered only once, reducing potential conflicts between the document’s internal loading processes and React’s lifecycle. Introducing a slight delay via setTimeout within the initialization process further improved stability, especially under varying network speeds and complex parent component updates.
hey dancingfox, i had the same hiccup. i fixed it by wrapping my init in a promise and only calling it when i was sure the doc was really loaded. try a slight delay if needbe, it worked wonders for me.