Last Thursday night we were given the opportunity to participate in a two-hour hackathon here at Hack Reactor, and when we were presented with the prompt of making a chrome extension, an idea I’d been thinking about in prior weeks immediately sprung to mind. Wouldn’t it be great to be able to quickly inject javascript libraries right from the console?

My partner during the D3 sprint (Matt Conrad) and I had talked about how cool this would be when we were initially exploring the library. Instead of creating a custom ‘demo’ and manually installing the libraries, it would be very handy to quickly inject a library of choice into any page right from the console and get coding.

Enter Console Injector! The chrome extension creates a console.inject method that can be called to quickly inject any javascript library onto a given page.


The method searches cdnjs for javascript libraries matching a given input string, and inserts the latest corresponding script hosted at The magic lies in the following snippet of code, which ‘injects’ an injector script into the head of the current document:

var element = document.createElement('script');
element.innerHTML = 'console.inject = ' + injectFunction.toString();

Since the javascript executed in the chrome extension doesn’t have access to any variables in the current page, in order to modify the console object (which is just another object) we must first append a script to the DOM, which then modifies the console object indirectly. This bit of redirection allows us to inject an injector script onto the page, which in turn generates more script tags with a source attribute corresponding to the queried library.

Console Injector was a great project to learn about Chrome extensions and bring something to life in a short amount of time. I’d like to give a big thanks to all of my team members: Wesley Smyth, Kiran Rao, Henry Wong, and Matt Conrad.

Console Injector is open source and available to download on the Google Chrome Web Store.