Search code examples
google-chrome-extensionsetfocusaddress-bar

Chrome Extension: blank new tab + address bar focus

I'm using this extension to get a blank page each time I open a new tab, unfortunately the address bar is not focused after the new tab is open.

I changed the new page contents to dispatch the keystroke 9 to simulate the tab key. which causes the browser to focus on the address bar but it didn't work.

<title>&#65279;</title>
<script>
function init() {
    var k = 9;

    var oEvent = document.createEvent('KeyboardEvent');

    // Chromium Hack
    Object.defineProperty(oEvent, 'keyCode', {
                get : function() {
                    return this.keyCodeVal;
                }
    });     
    Object.defineProperty(oEvent, 'which', {
                get : function() {
                    return this.keyCodeVal;
                }
    });     

    if (oEvent.initKeyboardEvent) {
        oEvent.initKeyboardEvent("keydown", true, true, document.defaultView, false, false, false, false, k, k);
    } else {
        oEvent.initKeyEvent("keydown", true, true, document.defaultView, false, false, false, false, k, 0);
    }

    oEvent.keyCodeVal = k;

    if (oEvent.keyCode !== k) {
        alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")");
    }

    document.dispatchEvent(oEvent);
}
</script>
<body onload="init()">
</body>

Is there some alternative to do that?

Solution

  • Problems in the Extension

    • It is not using updated manifest version
    • Made it comply with Content Script Policy.

    After eliminating above problems i got your code working.

    Working Version

    manifest.json

    Added Manifest version

    {
    "update_url": "http://clients2.google.com/service/update2/crx",
    "name": "Empty New Tab Page",
    "version": "1.1",
    "description": "With this extension, new tabs display a blank page instead of the usual new tab page with thumbnails.",
    "icons": {
        "128": "icon_128.png"
    },
    "chrome_url_overrides": {
        "newtab": "empty_ntp.html"
    },
    "manifest_version": 2
}

    empty_ntp.html

    Added <Script> tag to comply with CSP.

    <!--
Chrome insists on putting "chrome://newtab"
as title
if there 's no title,
instead of putting something useful like a localized "New Tab" there.

As a workaround, use a space as title. An empty tab is better than one saying
something cryptic. Chrome puts "chrome://newtab" if the title is whitespace too,
but it doesn'
t recognize all the whitespace characters listed at
http: //en.wikipedia.org/wiki/Space_(punctuation) :-)
-->
<
title > & #65279;</title>
<script src= "empty.js" > < /script>

    empty.js

    Used your code and added a DOMContentLoaded Event Listener

    function init() {
    var k = 9;

    var oEvent = document.createEvent('KeyboardEvent');

    // Chromium Hack
    Object.defineProperty(oEvent, 'keyCode', {
        get: function () {
            return this.keyCodeVal;
        }
    });
    Object.defineProperty(oEvent, 'which', {
        get: function () {
            return this.keyCodeVal;
        }
    });

    if (oEvent.initKeyboardEvent) {
        oEvent.initKeyboardEvent("keydown", true, true, document.defaultView, false, false, false, false, k, k);
    } else {
        oEvent.initKeyEvent("keydown", true, true, document.defaultView, false, false, false, false, k, 0);
    }

    oEvent.keyCodeVal = k;

    if (oEvent.keyCode !== k) {
        alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")");
    }

    document.dispatchEvent(oEvent);
}//Added an Event Listener
document.addEventListener("DOMContentLoaded", function () {
    init();
});

    References