Google Chrome Extension - waiting until page loads

In my Google Chrome Extension, I have a Content Script (content.js) and a Bac开发者_开发问答kground Page (background.html). I have context.js checking for a keyword that appears on the page. However, I want to wait until the page is fully loaded until I search the page, because the keyword may occur at the bottom of the page.

See Page action by content sandwich example (files), this is basically what I am doing. If you load the extension you'll see the extension only works when the word "sandwich" appears at the top of the page.

Try to add this to the "content_scripts" part of your manifest.json file.

"run_at": "document_end"

https://developer.chrome.com/docs/extensions/mv3/content_scripts/

As an alternative to manifest's "run_at": "document_end", there could be applied a standard javascript event handling approach. For example, DOMContentLoaded event could be used to run the logic that requires loaded DOM.

manifest.json

"content_scripts": [
        "js": ["content.js"],
        "run_at": "document_start"
    }
]

content.js

console.log('The extension works');
// ... logic that does not need DOM

function run() {
  console.log('The DOM is loaded');
  // ... logic that needs DOM
}

document.addEventListener("DOMContentLoaded", run);