What’s the quickest, easiest way to execute a JavaScript file on a live web page?

Question

I have this JavaScript file URL:

https://rawgit.com/Khan/tota11y/master/build/tota11y.min.js

(hosted on GitHub and passed through RawGit), and I would like to inject it into a live web page via the browser’s console.

In order to achieve that, I can dynamically create a <script> element and append it to the DOM:

(function () {
  var s = document.createElement('script');
  s.src = 'https://rawgit.com/Khan/tota11y/master/build/tota11y.min.js';
  document.body.appendChild(s);
}())

But this is neither quick nor easy. I would like to use an API that makes this possible via a simple invocation, e.g.:

exec('https://rawgit.com/Khan/tota11y/master/build/tota11y.min.js')

Do Chrome or Firefox provide such an API (or anything similar) in their console?

---

Use case: Quickly testing JavaScript libraries hosted on GitHub on live web pages.

Answer 1

Update: The Developer Toolbar has been removed from Firefox Nightly as of 18th May 2018.

In Firefox, you can inject scripts using the Developer Toolbar. Bring it up withShift+F2 and type inject https://rawgit.com/Khan/tota11y/master/build/tota11y.min.js

More info on MDN

Answer 2

You need a module loading capability from what I see. You have two routes:

• Either use a module loader like Require.js that already does that kind of dynamic loading for you. It enforces you to use AMD style of scripts though. This website talks a bit more about modules in javascript. The require object will be available in console since it is global.

• Use a hackish function that does that like jQuery does here, if you use jQuery already (it is a pretty big library to import just for this). jQuery is global and you can call that function in console.

EDIT: The reason I did not link browser specific functionality is because it is too specific. Using a JavaScript only solution works across all browsers to test for compatibility.

Answer 3

For chrome there's a plugin called Script Injector that does exactly that

https://chrome.google.com/webstore/detail/script-injector/fddnddnolonllcgfbenaloajnbhebmob?hl=en