How to launch a new window in Google Chrome Extension

Question

I'm trying to develop a Extension for Google Chrome, but I have some problems, I want to launch or create a new window when user click on it in the icon.

Like this: http://i.imgur.com/8iRkEOb.png

Thanks so much!

Answer 1

First off, if you have a default_popup defined in the manifest - you need to remove it, as it interferes with the click event you want to catch.

Then, you need to catch the event in a background script:

chrome.browserAction.onClicked.addListener(function(tab) {   // ... }); 

Next, if we want a window, we probably want to look at the windows API. create() sounds like what you need:

chrome.browserAction.onClicked.addListener(function(tab) {   chrome.windows.create({/* options */}); }); 

What options do you need? Assuming you want to open a page from your extension, you'll need an URL wrapped in a chrome.runtime.getURL:

chrome.browserAction.onClicked.addListener(function(tab) {   chrome.windows.create({     // Just use the full URL if you need to open an external page     url: chrome.runtime.getURL("mypage.html")   }); }); 

Then, to show a window like you're showing, without top toolbar, you need a window type "popup":

chrome.browserAction.onClicked.addListener(function(tab) {   chrome.windows.create({     url: chrome.runtime.getURL("mypage.html"),     type: "popup"   }); }); 

Finally, if you want to do something after the window has opened, use the callback:

chrome.browserAction.onClicked.addListener(function(tab) {   chrome.windows.create({     url: chrome.runtime.getURL("mypage.html"),     type: "popup"   }, function(win) {     // win represents the Window object from windows API     // Do something after opening   }); });