Opening a new tab on Google Chrome Extension

Question

This is my background.html file, It works fine when opening in current tab but I want it to open in new tab, what am I doing wrong?

<html>
<head>
<script>
  // Called when the user clicks on the browser action.
  chrome.browserAction.onClicked.addListener(function(tab) {
    var action_url = "javascript:location.href='http://www.reddit.com/submit?url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title)";
    chrome.tabs.create(tab.id, {url: action_url}, function(tab));
  });
</script>
</head>
</html>

Make sure your action_url starts with: `http://` or `https://` — Muhammad Shahzad, Aug 09 '16 at 07:55

score 16 · Accepted Answer · edited Jan 10 '21 at 22:56

You should read the chrome.tabs.create documentation again. You are passing it invald parameters. You are also using location which is from the background.html document not the webpage document the code is expecting instead of the tab parameter passed to the chrome.browserAction.onClicked listener.

<html>
<head>
<script>
  // Called when the user clicks on the browser action.
  chrome.browserAction.onClicked.addListener(function(tab) {
    var action_url = "http://www.reddit.com/submit?url=" + encodeURIComponent(tab.href) + '&title=' + encodeURIComponent(tab.title);
    chrome.tabs.create({ url: action_url });
  });
</script>
</head>
</html>

score 2 · Answer 2 · answered Dec 10 '11 at 15:23

2

You can try this

<html>
...
<body>
    <script>
    function createTab() {
        chrome.tabs.create({url: "http://www.stackoverflow.com"});
    }
    </script>
    <a href="#" onclick="createTab();">Create a new tab</a>
</body>
</html>

answered Dec 10 '11 at 15:23

user219882

15,274
23
93
138

No I don't want it like this, I actually want the new tab to be created as soon as the icon is pressed. – orange Dec 10 '11 at 18:09
@Jeff This is just an example. I wanted to show you that you don't need to write the `chrome.tabs.create` command so complicated. Try to use this instead. Even though I'm not good at JavaScript the `var action_url` seems odd to me... Check JavaScript console for possible errors. – user219882 Dec 10 '11 at 19:04
2

Note that in Manifest 2.0 the default [Content Security Policy](https://developer.chrome.com/extensions/contentSecurityPolicy) prohibits inline JavaScript. – thdoan May 27 '16 at 10:37

score 1 · Answer 3 · answered Dec 10 '11 at 18:49

<html>
 <head>
  <script type="text/javascript">
   window.master = ({
     newtab: function(url, callback) {
       callback = callback === true ? (function() { this.close(); }) : callback;

       try {
         chrome.tabs.create({
           url: url
         });

         if(typeof callback === "function") { callback.call(this, url); }
       } catch(e) {
         /* Catch errors due to possible permission issues. */
       }
     },

     link: function(event, close) {
       event = event ? event : window.event;
       event.preventDefault();
       this.newtab(event.href, close);
     },

     close: function() { window.self.close(); }
   });
  </script>
 </head>

 <body>
  <!-- Usage is simple:

        HTML:
         <a href="http://example.com/" onclick="master.link(event)" />

        JavaScript:
         master.newtab("http://example.com/", true);
  -->
 </body>
</html>

If you insist on using a popup and want it to close as soon as it is opened, then use what is above. Simply add the link string and a true boolean to the master.newtab function to have it open the new tab and then close the popup.

If you change your mind about closing the popup, you can replace the true boolean with a function to execute if the new tab was created without any errors. You can also use the master.link function for calling the master.newtab function from an anchor element.

The best thing about using Chrome Extensions is you never have to worry about support issues! :D

This doesn't seem to work, when clicking the icon it is just unresponsive I'm using the reddit submit bookmarklet js. — orange, Dec 11 '11 at 12:53

Opening a new tab on Google Chrome Extension

3 Answers3

Linked