How to find and select an element inside the page code via JavaScript?

Question

JavaScript

The situation is as follows: I put the extension in the browser, the extension creates a document in the frame (I attached the pictures below), I can access the frame through the document.querySelector command, but it doesn’t go any further. I need to refer directly to this document or any element inside it and execute javascipt in it for the result, I tried to enter it in the frame - it does not work. help

PS Yes, the joke is that if you click on the #document itself or any element inside it through the developer tools and enter the command into the console, then it works, otherwise it doesn’t



Addition: I found a way to select in the console, if you select what is selected on the screen, then the script is also executed. Question - how to change the standard console (top) to this one (cvf-arkose-frame) through javascript code in the console itself is acceptable (without using the mouse and clicks, as I did)

Answer 1

In the extension manifest, in the content script parameters, specify "all_frames": true(example below)

{
  
  "name" : "Имя расширения",
  
  "manifest_version" : 2,
   
  // ...
  
  "content_scripts" : [
  
    {	
      "matches" : [ "https://*.mysite.ru/*" ],
      "run_at": "document_start",
      "js" : [ "content.js" ],
      "all_frames": true
    }
    
  ]

}

This will make it clear to the browser that the content script should also be run inside frames. Further, already in the content script itself, you check whether you are in the frame and take the necessary actions:

if (window.top != window) {
  
  console.log('Это фрейм!');
  
}

else {
  
  console.log('Это не фрейм!');
  
}