I am trying to make a chrome extension that will inject a content script to a React web app. Although I am successful in injecting the code, the delayed hydration of the page often overrides the changes made by the script.

This issue can be somewhat averted by putting arbitrary timeouts, but that barely qualifies as a solution since the speed of hydration, and thus the time required, differs from device to device.

Is there a way to detect when the page is done hydrating, preferably through a promise, so that I can make changes to the page after that?

P.S. I have tried customeElements.whenDefined() but the DevTools keep telling me customElements is undefined.