Context - Chrome extension development
Goal – Access DOM elements when page has fully loaded. The page I'm accessing is heavy and I need to acccess the DOM when everything has loaded.
What I've done so far
I have set run_at property within my manifest.json to document_idle. However, this does not work as script returns error that it cannot find the element in question
manifest.json
"content_scripts": [
{
"js": ["contentScript.js"],
"run_at": "document_idle"
}
The the only thing that seems to work is the following
contentScript.js
setTimeout(() => {
const recordNameEl = document.querySelectorAll('[data="sectionId"]');
const recordNameString = recordNameEl[1].textContent;
const nameArray = recordNameString.split(' ');
console.log(nameArray[0]);
}, 5000);
The above solution feels hacky. Whats best solution to have my script run when the page has completed loaded?