18

I am trying to find a way to count a number of tabs that are currently open in Chrome by javascript.

I have searched and found chrome.tabs.query(). But when I opened my console and tried it I got an undefined message.

Is it not supported anymore by Chrome, or can it only be used in extension development?

wscourge
  • 10,657
  • 14
  • 59
  • 80
Ho Ha
  • 201
  • 1
  • 2
  • 5

5 Answers5

16

As wscourge has implied, chrome.tabs.query() is a Chrome extension API, which is only available to extensions, not web page JavaScript. In fact, it is only available in the background context of an extension (i.e. not content scripts).

To find the number of tabs that are open, you could do something like:

chrome.tabs.query({windowType:'normal'}, function(tabs) {
    console.log('Number of open tabs in all normal browser windows:',tabs.length);
}); 

If you want to run this from a console, you will need to have an extension loaded that has a background page. You will then need to open the console for the background page. From that console, you can execute the above code.

Community
  • 1
  • 1
Makyen
  • 31,849
  • 12
  • 86
  • 121
  • Thanks for your response , Can I use it in my application, at my current stage ,I'm on a jquery project – Ho Ha Feb 09 '17 at 10:35
  • @HoHa, I'm not really sure what your comment is asking. The above code can be used in a Chrome extension, but will not function in a web page/web application. The fact that you are using jQuery does not factor into the issue (other than implying that it is less likely you are working on a Chrome extension). – Makyen Feb 09 '17 at 16:38
15

I found the answer to this question here: https://superuser.com/questions/967064/how-to-get-tab-count-in-chrome-desktop-without-app-extension

Go to chrome://inspect/#pages

Run the following line of code in the javascript console:

document.getElementById("pages-list").childElementCount

The tabs count will be printed to the console.

unubar
  • 416
  • 6
  • 15
  • Please see [How to reference material written by others](https://stackoverflow.com/help/referencing). You need a bit more information as part of referencing in the above answer for it to not be considered plagiarism. In addition, given that you are basically copying the line you've included, you should put them in quote format by beginning each line with a `>`. This will make it clear that you are actually quoting the information. – Makyen Mar 12 '19 at 04:23
  • I have reworded the answer. But putting `>` didn't allow me to save the edit with this error: "Your post appears to contain code that is not properly formatted as code." – unubar Mar 13 '19 at 06:12
11

Local and Session storage

In case when we want count only tabs witch our website - first on page load (open tab) event we generate tab hash and we save it in sessionStorage (not shared between tabs) and as key in TabsOpen object in localStorage (which is shared between tabs). Then in event page unload (close tab) we remove current tab hash (saved in sesionStorage) from TabsOpen in localStorage.

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>My project</title>
    ...
    <script>

        function tabLoadEventHandler() {
            let hash = 'tab_' + +new Date();
            sessionStorage.setItem('TabHash',hash);
            let tabs = JSON.parse(localStorage.getItem('TabsOpen')||'{}');
            tabs[hash]=true;
            localStorage.setItem('TabsOpen',JSON.stringify(tabs));
        }
        function tabUnloadEventHandler() {
            let hash= sessionStorage.getItem('TabHash');
            let tabs = JSON.parse(localStorage.getItem('TabsOpen')||'{}');
            delete tabs[hash];
            localStorage.setItem('TabsOpen',JSON.stringify(tabs));
        }
    </script>
    ...
</head>

<body onunload="tabUnloadEventHandler()" onload="tabLoadEventHandler()">
...
</body>

</html>

Thanks to this in TabsOpen object in localStorage we have information about current open tabs which can be read by

let tabsCount = Object.keys( JSON.parse(localStorage.getItem('TabsOpen')||'{}') ).length
Kamil Kiełczewski
  • 85,173
  • 29
  • 368
  • 345
3

It can only be used in extension development.

You are not able to access that information from document level.

wscourge
  • 10,657
  • 14
  • 59
  • 80
2

This is not a solution using javascript, but maybe it can help double-check the count against another solution. It is by far the easiest (one-click) solution that works for me:

If you have chrome sync enabled, simply navigate to chrome.google.com/sync

It should give you the count of open tabs, among other counts (e.g. bookmarks, extensions, etc)

tomosius
  • 1,369
  • 12
  • 18