I am developing chrome extension accordingly, one of the requirements is to catch the event listeners that are triggered in the relevant iframe through the content script injected into each iframe. That is when click event occurs in the iframe and I need to get it to the extension. The diagram below shows how the web page related to my iframes exists and how content scripts are injected.

Iframe Hierarchy

The problem is that I want to get the events in the last frameReports iframe (see above image). Each iframe above has the correct content scripts injected except frameReports. frameReports has only one content script. The relevant content script is not injected so I cannot catch the event triggered in the iframe.

But when I temporarily remove the relevant iframe from the DOM through devtools, all the relevant content scripts injected properly. What is the reason for this? I am using manifest version 2. I’ll include the relevant files below.

Manifest.json

{
  "name": "Test",
    "version": "1.0.0",
      "manifest_version": 2,
        "description": "My Extension",
          "background": { },
  "permissions": ["tabs",
    "activeTab",
    "webRequest",
    "<all_urls>",
    "http://*/*",
    "https://*/*",
  ],
    "content_security_policy": "script-src 'self'; object-src 'self'",
      "content_scripts": [
        {
          "all_frames": true,
          "matches": ["http://*/*", "https://*/*", "file://*/*"],
          "js": ["contentScript.js"],
          "match_about_blank": true
        }
      ],
        "options_ui": {
    "page": "options/options.html"
  },
  "web_accessible_resources": ["icons/icon.png"]

}

contentScript.js

document.addEventHandler('click', function (event) {
    if (event.button == 0 && event.isTrusted) {
        var target = event.target;
    // Code goes here
    }
});