Chrome extension. Get active window innerHeight from browser actions popup

518 views
Skip to first unread message

Yevgeny Medvedev

unread,
Apr 4, 2023, 6:54:41 AM4/4/23
to Chromium Extensions
Hello

I intend to resize the browser action popup depending on the active window.innerHeight.

When, for example, the active window is small - resize the browser action popup.

I was trying to use chrome.windows.getCurrent, but the height of this window is full, with tabs, not innerHeight.

chrome.ext.png

Patrick Kettner

unread,
Apr 4, 2023, 9:24:42 AM4/4/23
to Yevgeny Medvedev, Chromium Extensions
In order to access the innerHeight of the tab, you would need to run code within the context of the page. If you are just wanting to scale the popup based on the size of the current window, then I do not think the additional permission to inject javascript is worth it since you can just understand the page is a bit smaller than the height given in chrome.windows.getCurrent. 

If you need the exact innerHeight, you could do something like this

let [tab] = await chrome.tabs.query({ active: true })
let [currentWindow] = await chrome.scripting.executeScript({
  target: { tabId: tab.id },
  func: () => window.innerHeight
})

currentWindow.result would give you the innerHeight of the page.

Note you would need to add "scripting" to your permissions part of your manifest, as well as "host_permissions": [ "<all_urls>" ] (assuming you want to run on any url).

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/3449a7b4-5235-43cd-b76e-f4fbcf81c5een%40chromium.org.

Yevgeny Medvedev

unread,
Apr 4, 2023, 9:26:24 AM4/4/23
to Chromium Extensions, Patrick Kettner, Chromium Extensions, Yevgeny Medvedev
Thanks a lot

вторник, 4 апреля 2023 г. в 16:24:42 UTC+3, Patrick Kettner:

Simeon Vincent

unread,
Apr 5, 2023, 1:58:59 AM4/5/23
to Yevgeny Medvedev, Chromium Extensions, Patrick Kettner
To tweak Patrick's suggestion a little, I'd recommend avoiding "<all_urls>" if possible as it gives extensions broad access to user data and can increase review times. If you're executing your logic inside a popup, try using the activeTab permission instead of <all_urls>. The activeTab permission will grant the extension temporary host permissions on the current tab. This includes the ability to inject script on the current page.

That said, there's no need to inject a script into the current page. You can actually get the value you want directly from the Tabs API. Specifically, you'll want to use chrome.tabs.query().

let [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
let height = tab.height;

I believe this value should match what is returned by window.innerHeight.

Simeon - @dotproto


Patrick Kettner

unread,
Apr 5, 2023, 10:34:21 AM4/5/23
to Simeon Vincent, Yevgeny Medvedev, Chromium Extensions
thank you so much, simeon! I was under the impression tab.height was the same as currentWindow.height. Thank you so much for correcting 

patrick
Reply all
Reply to author
Forward
0 new messages