Chrome Extension for loop inconsistent

I’m running into an issue with a Chrome extension I’m currently working on. Its function is to take user input from the popup textarea and create tabs for each url separated by a line break. Overall, it successfully opens all urls 90% of the time but 10% of the time it only opens 7/10 urls in the textarea. Also, jquery 2.2.3 is used to get the values of the textarea, not sure if that matters.

I’m trying to figure out how/why it will occasionally only open 7/10 urls in the textarea and if it can be fixed. Below is the manifest, popup.html, and backend.js.

backend.js:

function urltoTabs(){
var text = $('textarea').val().split('n');
  for (var h = 0; h <= text.length; h++) {
    if (text[h].length < 1) continue;
    chrome.tabs.create({url:text[h]});
  }
}
document.addEventListener('DOMContentLoaded', function () {
    document.getElementById('engage').addEventListener('click', urltoTabs);
});

popup.html:

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="jquery-2.2.3.min.js"></script>
        <script type="text/javascript" src="backend.js"></script>    
    </head>
    <body>
        <form>
            <p><strong>List urls below<strong><br />
            <textarea id="textarea" rows="15"></textarea></p>
            <button id="engage">Engage!</button>
        </form>
    </body>
</html>

manifest.json:

{
  "manifest_version": 2,
  "name": "Link to Tabs",
  "short_name": "Link To Tabs",
  "description": "Test url to tabs.",
  "version": "0.0.4",
  "minimum_chrome_version": "38",
  "content_scripts": [
    {
      "matches": ["*://*/*"],
      "js": ["backend.js"]
    }],

  "permissions": [
          "tabs"
        ],

  "browser_action": {
          "default_icon": {                    
            "19": "assets/icon_16.png"           
          },
          "default_title": "New Tabs!",      
          "default_popup": "popup.html"        
        },

  "icons": {
    "16": "assets/icon_16.png",
    "128": "assets/icon_128.png"
  }
}

I appreciate any help on this!

Answer

Answer credit goes to @wolf-war

The issue was the popup would close once tabs were created which would close the operation prematurely. Pushing popup.html and backend.js to the background fixed this issue. All that changed was the manifest.json.

manifest.json:

{
  "manifest_version": 2,
  "name": "Link to Tabs",
  "short_name": "Link To Tabs",
  "description": "Test url to tabs.",
  "version": "0.0.4",
  "minimum_chrome_version": "38",
  "background": {
    "js": "backend.js", // Needs both js and html to store user input correctly
    "page": "popup.html" 
  },
  "permissions": [
          "tabs"
        ],
        //content_scripts was removed
  "browser_action": {
          "default_icon": {                    
            "19": "assets/icon_16.png"           
          },
          "default_title": "New Tabs!",      
          "default_popup": "popup.html"        
        },

  "icons": {
    "16": "assets/icon_16.png",
    "128": "assets/icon_128.png"
  }
}

Thanks for all the help, I really appreciate it!

Leave a Reply

Your email address will not be published. Required fields are marked *