How can I determine the window id of the current window in TST?

Add-ons Development
#1

I use TreeStyleTab and I want to use the keyboard to scroll the TST sidebar. The message to do that requires the number of the window which is usually 1. When you open more windows how do you determine the window number of the current window?
Currently when I am in a different window and press the shortcut it is the sidebar of the first window that scrolls

mapkey("<Ctrl-[>", "scroll sidebar up", function () {
     console.log("scroll up");
     browser.runtime.sendMessage('treestyletab@piro.sakura.ne.jp', {
     type: 'scroll',
     window: 1,
     delta: -100,
 });
});

PS. I also need the same info for tabs, because some commands need the tab’s id.

#2

For windows there is :

browser.windows.getCurrent()

For tabs to get Tab object of tab where the script runs:

browser.tabs.getCurrent()

To get Tab object from other scripts (like background page):

browser.tabs.query({active: true, lastFocusedWindow: true}).then(([tab]) => tab)

All of these returns a Promise that you need to await or chain with .then callback.
Also, Tab object contains also windowId, so no need to use browser.windows.getCurrent.

See also docs:



2 Likes
#3

Can you show me how to use the browser.tabs.query({active: true, lastFocusedWindow: true}).then(([tab]) => tab) code within the context of the mapkey invocation?

When I try it I get a syntax error message along the lines of needing to use an await within an async funtion.

#4

Yes, you need to use either await keyword or .then callback function.

If you are using await, then mark whole function as async - so instead of function write async function.
So for example:

async function() {
  const {windowId, id: tabId} = await browser.tabs.query({active: true, lastFocusedWindow: true}).then(([tab]) => tab);
  // now you can use windowId and tabId
}

If you want to use .then, then use this:

browser.tabs.query({active: true, lastFocusedWindow: true})
  .then(([tab]) => tab)
  .then(({windowId, id: tabId}) => {
    // now you can use windowId and tabId
});

Also as you can see, I’m using here destructuring assignment:


(but feel free to use tab.id and tab.windowId instead :slight_smile:)

EDIT:
So your code should look something like this:

mapkey("<Ctrl-[>", "scroll sidebar up", async function () {
     const {windowId, id: tabId} = await browser.tabs.query({active: true, lastFocusedWindow: true}).then(([tab]) => tab);
     console.log("scroll up");
     browser.runtime.sendMessage('treestyletab@piro.sakura.ne.jp', {
     type: 'scroll',
     window: windowId,
     delta: -100,
 });
});
#5

Let me clean that up a little :wink:

mapkey("<Ctrl-[>", "scroll sidebar up", async function () {
  const [{windowId, id: tabId}] = await browser.tabs.query({
    active: true,
    lastFocusedWindow: true,
  });
  console.log("scroll up");
  await browser.runtime.sendMessage('treestyletab@piro.sakura.ne.jp', {
    type: 'scroll',
    window: windowId,
    delta: -100,
  });
});

Or alternatively using the windows API instead of tabs:


mapkey("<Ctrl-[>", "scroll sidebar up", async function () {
  const { id } = await browser.windows.getLastFocused({
    windowTypes: [ 'normal' ],
  });
  console.log("scroll up");
  await browser.runtime.sendMessage('treestyletab@piro.sakura.ne.jp', {
    type: 'scroll',
    window: id,
    delta: -100,
  });
});