Programmatically (or optionally) override Chrome's New Tab page

Question

I\'ve written a Chrome extension that overrides the New Tab page:

manifest.json:

  \"chrome_url_overrides\": {
    \"newtab\": \"new         


        

Answer 1

Using the Star Wars method as described @Daniel Herr, I did this, which is working well. Although feels a little hack-y.

I have an option being set in the popup.html whether the Extension is "on" or not.

First off, set the default new tab page using the Chrome defined method:

manifest.json

"chrome_url_overrides": {
      "newtab": "newtab.html"
},

Then in your Extension's newtab.html call a new JavaScript file, newtab.js (or whatever).

I am also using jQuery, so my code uses that, but you can do this natively using DOMContentLoaded.

newtab.js

$(document).ready(function(){ 

    // It takes a moment for the Chrome query/update so sometimes there is a flash of content
    // Hiding the Body makes it look blank/white until either redirected or shown
	$('body').hide();

	var background = chrome.extension.getBackgroundPage();
	var _app = background._app;

	// App is OFF, show Default New Tab
	if(!_app._on){

		// Get the current Tab
		chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {

			var active = tabs[0].id;
          
            // Set the URL to the Local-NTP (New Tab Page)
			chrome.tabs.update(active, { url: "chrome-search://local-ntp/local-ntp.html" }, function() { });
		});

	// App is ON, show custom content
	} else {
		
		$('body').show();
	}

});

Basically, the methodology is to update the Tab so that it is redirected to chrome-search://local-ntp/local-ntp.html which is the hard URL to the default Chrome NTP.

Since this is a Chrome internal URL -- the URL field still appears blank.