1

Is it possible in an external javascript code (for example, a userscript through tampermonkey) to run a code snippet on the Chrome console. For example, console.log prints text to the console. Is there some way, like a function console.eval or some more complex way where I can run code on the console without manually opening it on the given website, but using the original javascript code behind the website or a userscript?

Notes: I use Google Chrome on Windows 10. Preferably this answer should be as generally applicable as possible, but first priority for me is for it to work in my environment.

Thanks,

Mike

9
  • what is your end goal? and can you try to use the devtools api via extension or you are restricted to regular javascript from pages? Commented Feb 6, 2021 at 3:02
  • There happens to be a snippet of code that works in the console, but not in userscript itself. Very basic DOM retrieval using querySelector and then changing a style, but based on the DOM structure (an iframe) the code only works in the console, so if I can run a snippet of code on the console through my userscript, that would be nice. (The page is constantly reloading, so it is impractible to copy-paste a code every time). Commented Feb 6, 2021 at 6:50
  • ok, now we have a tottaly different question. now you said you want to a userscript access the dom from internal/external iframe from own/other domain. which of those would it be? internal or external iframe? local or remote? i would recommend opening another question because the answer is so different from the question title, that the next people with the same doubt won't read the question/answers because they would be unrelated. Commented Feb 6, 2021 at 13:54
  • I think you are misunderstanding what I want. I simply want to be able to run a snippet of code on the chrome console from my userscript. Commented Feb 7, 2021 at 19:42
  • 1
    if the page is reloading constantly, the "console" that u think of would also reload?? Commented Feb 11, 2021 at 23:04

1 Answer 1

1
+50

Uk, when i said if the page is reloading constantly, the "console" that u think of would also reload??, a lot of us knew about what I'm doing below(if not all of us) but I finally connected it with your question. Using one tab to control the other tab

ONE EDIT: I used an interval to determine if the controlled tab is CLOSED(since a certain value eventually changes if the tab is closed for good)

HOW TO USE:

  1. Open a tab with the same origin as desired url(but not the constantly reloading site)..
    eg: opening a tab on "https://example.com/404" if desired url is "https://example.com" is the desired url(the constantly reloading one)
  2. In the code snippet I have below, you can put your tab controlling code in the loadFn function, where myWindow and this point to the controlled tab's window
    eg: in the loadFn function, myWindow.console.log(1) or this.console.log(1) would both log 1 to the controlled tab's console


SECOND EDIT: I shall explain how it works(and talk about unloadFn as you requested in comments)
I use a combination of unload and load listening to be able to repeatedly send code "on reload" which is not an event in itself so I had to create it. In case I didn't explain myself, I'd go into detail now..
When a page is reloading(or when I'm JUST SPAWNING the page, eg: var myWindow=window.open(desiredUrl)), the unload event happens. There's just one problem however; every time the page is reloading, all event listeners and any code you put is removed(because reload unloads to then reload)
The solution is simple: on every unload, I set the listners again, and since the function would call itself(every time the page unloads), the listeners would successfully be reloaded every time the page reloads(and that is why loadFn could run in the other tab after every reload)
DO NOTE: You might ask "why use a setTimeout then?". Actually it's quite important. Without the setTimeout, the event listeners DO NOT GET ADDED, I think it's because the tab would ignore your commands(since it would be focusing on loading its default stuff(like event listeners for instance)), and asynchronous programming does wonders in this case because it will wait until the other stuff are processed(like event handling stuff) then run
SIDE NOTE: If that's not why setTimeout works and NOT USING it doesn't, all I know is that without it, it doesn't work, and with it, it works


var myWindow=window.open(desiredUrl) //remember to run this code on the same origin as the desiredUrl
function loadFn(){
  //this will happen every time myWindow loads or reloads
  myWindow.alert("It runs in the controlled tab")
  myWindow.console.log("Even in the controlled tab's console it works >:D")
}
function unloadFn(){setTimeout(()=>{
  myWindow.addEventListener('unload',unloadFn)
  myWindow.addEventListener('load',loadFn)
  if(!myWindow.Window){console.warn("myWindow was CLOSED")}
},0)}
myWindow.addEventListener('unload',unloadFn)
//extra thing below to tell if controlled tab is closed >:D
var i=setInterval(()=>{
  //for if controlled tab is closed
  if(!myWindow.document.location){clearInterval(i);console.warn("myWindow was CLOSED")}
},0)
Sign up to request clarification or add additional context in comments.

6 Comments

Great solution, just a couple of questions --- what does the unload function do? And second, I want to run code in the console of the constantly reloading page. How do I use the page controlling the reloading page's console to run code? Thanks.
clarification: run code the controlled page's console
@MikeSmith I just edited the question trying to answer these questions here.. also if that's to big a read, the comment below explains the unloadFn without the context
The solution is simple: on every unload, I set the listners again, and since the function would call itself(every time the page unloads), the listeners would successfully be reloaded every time the page reloads(and that is why loadFn could run in the other tab after every reload)
@MikeSmith one more thing.. as for running code on the controlled tab's console, do you mean the equivalent of pasting code in a tab's console then pressing enter? If so, myWindow.eval(stringVersionOfCopiedCode) in loadFn would do the trick.. also remember that you can treat myWindow as the controlled tab's window. If what I said didn't help, could you share an example of what you mean by running code in the controlled page's console?
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.