Simple Chrome Extension : Open an url in a new tab

Question

I'm looking to create a "new tab" extension like Panda or the Product Hunt Extension: the user can open a new tab with my website inside, with an hidden url.

I've generated my package with the awesome Extensionizr and here is my manifest.json :

manifest.json

{
  "name": "My app",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "My awesome app",
  "homepage_url": "http://myapp.com",
  "icons": {
    "16": "icons/icon16.png",
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
  },
  "default_locale": "en",
  "background": {
    "scripts": [
      "src/bg/background.js"
    ],
    "persistent": false
  },
  "permissions": [
    "tabs",
    "http://myapp.com/*"
  ]
}

My background.js come from this answer, the problem seems really similar.

background.js

chrome.browserAction.onClicked.addListener(function(activeTab) {
  var newURL = "http://myapp.com";
  chrome.tabs.create({ url: newURL });
});

I'm still getting this error when I try to run the background page from the extension settings : Uncaught TypeError: Cannot read property 'onClicked' of undefined

And when I open a new tab, Google Chrome took the advantage and display me a google search page.

I do it wrong, and I don't know how/where/why

`chrome.browserAction.onClicked.addListener` is fired when a browser action icon is clicked rather than opening a new tab in other ways. https://developer.chrome.com/extensions/browserAction — Dayton Wang, Jun 19 '15 at 22:21

score 2 · Accepted Answer · edited May 23 '17 at 12:14

You're completely off-track. You don't want to open a (simple) new tab, you want to replace the "New Tab page".
Daniel's answer correctly explains why your code does not work, but it won't do what you wanted.

To replace Chrome's New Tab page, you need to use Override Pages:

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

Inside that myPage.html, you can add an <iframe> for your remote content.

score 1 · Answer 2 · answered Jun 19 '15 at 22:03

That's because you need to register the browser action in the manifest. Here is your manifest with the browser action added at the bottom.

{
  "name": "My app",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "My awesome app",
  "homepage_url": "http://myapp.com",
  "icons": {
    "16": "icons/icon16.png",
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
  },
  "default_locale": "en",
  "background": {
    "scripts": [
      "src/bg/background.js"
    ],
    "persistent": false
  },
  "permissions": [
    "tabs",
    "http://myapp.com/*"
  ],
  "browser_action": {}
}

Here are the browser action docs: https://developer.chrome.com/extensions/browserAction

That's.. Not what the user is looking for. What he needs is a new tab override. Read the question carefully. — Xan, Jun 21 '15 at 19:06

Simple Chrome Extension : Open an url in a new tab

2 Answers2