ReferenceError while using sdk/tabs in firefox webextension

Question

This is my first time learning to build a firefox addon. I want store all the open tabs in a window and for that I require sdk/tabs.

Here is my js file:

/*
Given the name of a beast, get the URL to the corresponding image.
*/
debugger;
var tabs = require("sdk/tabs");
function beastNameToURL(beastName) {
  switch (beastName) {
    case "Save Session":
      debugger;
        for (let tab of tabs)
          console.log(tab.url);
        return;
    case "Load Session":
    debugger;
      return chrome.extension.getURL("beasts/snake.jpg");
    case "Turtle":
      return chrome.extension.getURL("beasts/turtle.jpg");
  }
}

/*
Listen for clicks in the popup.

If the click is not on one of the beasts, return early.

Otherwise, the text content of the node is the name of the beast we want.

Inject the "beastify.js" content script in the active tab.

Then get the active tab and send "beastify.js" a message
containing the URL to the chosen beast's image.
*/
document.addEventListener("click", function(e) {

  if (!e.target.classList.contains("btn")) {
    return;
  }


  var chosenBeast = e.target.textContent;
  var chosenBeastURL = beastNameToURL(chosenBeast);

  chrome.tabs.executeScript(null, {
    file: "/content_scripts/beastify.js"
  });

  chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
    chrome.tabs.sendMessage(tabs[0].id, {beastURL: chosenBeastURL});
  });

});

When I reach the var tabs = require("sdk/tabs") line I get a Reference error.

Github : https://github.com/sagar-shah/Session-manifest

Kindly let me know how do I resolve this error. This being my first time with add-ons I am completely lost.

Thanks in advance.

Update: Tried to declare it globally in the js file. Now I am getting undefined error for tabs.

Update2: I was mixing up development using sdk and webextensions as pointed out by @matagus. I have decided to go with development using the webextensions. Link to the new repository has been updated.

not sure but is this "main": "manifest.json", correct ? in all my addon it's set to index.js — Madhawa Priyashantha
@FastSnail I am not quite sure. In the tutorial the main file is given as index.js however, when the button is clicked in my addon, I want to open a popup and not run any js file on button click. So I figured that I would add my manifest.json as main since the manifest contains the details of the popup file. — Posiedon
I used it just fine yesterday. Try to declare it globally - github.com/Noitidart/jpmOAuth/blob/master/index.js - you are using jpm run or jpm xpi right? Meaning you aren't doing cfx right? As cfx has been deprecated. — Noitidart
@Noitidart I did try to declare it globally but now I am getting an undefined error for variable tabs. And yes, I am using jpm run. Not jpm xpi or cfx. — Posiedon

matagus matagus · Accepted Answer · 2016-04-08T23:27:27

The error is on package.json line 6: you're telling to the addon sdk that the main file of your addon is manage.json. According to [the docs] the value of main should be:

A string representing the name of a program module that is located in one of the top-level module directories specified by lib. Defaults to "index.js".

So you need to change its value to index.js.

Besides that, I think you're missing a difference between Firefox addon built using the addon-sdk (which do not have a ´manifest.json´ and that you build using jpm tool) and the new WebExtensions which do require you to write a ´manifest.json´ like the one already have.

UPDATE:

Again: you're missing the difference between WebExtensions and SDK-based addons. Now you made a WebExtension but you're trying to use the SDK. It isn't possible. Just use chrome.tabs directly instead of trying to import it from the sdk (var tabs = require("sdk/tabs");).

ReferenceError while using sdk/tabs in firefox webextension

1 Answers