CODEWITHSUNDEEP
javascriptgoogle-chromegoogle-chrome-extension
jprim
jprim

Reputation: 1363

How to keep Google Chrome Extension popup open?

If I open my extension popup then I open another window or tab following the popup does not stay open if I return to it.

Is there a way to force it so the popup stays open?

Upvotes: 62

Views: 61674

Answers (9)

Kong
Kong

Reputation: 9586

As of Chrome 114 one alternative would be the SidePanel API:

https://developer.chrome.com/docs/extensions/reference/sidePanel/#type-PanelBehavior

This would open your UI in the side panel and remain visible across interactions and tabs.

Upvotes: 2

Anh-Thi DINH
Anh-Thi DINH

Reputation: 2374

One option is open a new tab with this url,

chrome-extension://<extension-id>/popup.html

where <extension-id is the id of the extension. You can find it in the extension manager.

It keeps open for any reason. It also output the console.log in the background script.

One drawback: because the "tab" popup is always opened, you can see the codes work from start to end. However, the "real" popup is closed whenever you have some event in other places of the browser. When it closes, the codes in the popup.js terminate immediately! That's why you see there are different console.log in the "tab" and the "real". Use it with caution!

Upvotes: 4

ChromeFreak
ChromeFreak

Reputation: 35

Best way to workaround this is to :

  • Right-Click inside the popup
  • Click: Inspect

Or just press CTRL+Shift+I

A new window will open with the Developer Tools... just keep that window open and the popup will never close.

Upvotes: 1

Komal Waseem
Komal Waseem

Reputation: 1127

In an answer to a FAQ here: https://developer.chrome.com/docs/extensions/mv3/faq/#faq-persist-popups

Popups automatically close when the user focuses on some portion of the browser outside of the popup. There is no way to keep the popup open after the user has clicked away.

Upvotes: 11

GratefulGuest
GratefulGuest

Reputation: 837

As others have said, this is a deliberate limitation of popup UI.

Instead, you could inject some HTML into the page which loads the content you want in your popup into an element which hovers over the existing page. You will have to implement the close functionality yourself, but it will persist.

Have a look at e.g. how keyframes.app has done it: https://github.com/mitchas/Keyframes.app/blob/master/Keyframes.app%20(Extension)/src/inject/ui.js

Upvotes: 6

Derlin
Derlin

Reputation: 9881

This answer to How do I prevent Chrome developer tools from closing when the current browser window closes? what very helpful in my case:

Not a perfect solution, but you can add breakpoints on the events Window.close and unload by turning on the checkboxes at:

Developer tools -> "Sources" tab -> Event Listener Breakpoints -> Window -> close

And

Event Listener Breakpoints -> Load -> unload

Try to mark both and see which one works best for you

Upvotes: 2

user4162184
user4162184

Reputation: 91

If you enable panels at "chrome://flags/#enable-panels" you can use something like:

chrome.windows.create({
    url:"popup.html",
    type:"panel",
    width:300,
    height:200
});

to open a panel window instead which will stay on top all the time as long as you don't move it from the bottom of the screen.

Upvotes: 3

Flimm
Flimm

Reputation: 151298

You cannot stop the Chrome pop-up from closing, unless you're in developer mode. You could consider this alternative, though:

Launching a normal pop-up instead:

In your popup.html file, load a Javascript file that runs this:

var popupWindow = window.open(
    chrome.extension.getURL("normal_popup.html"),
    "exampleName",
    "width=400,height=400"
);
window.close(); // close the Chrome extension pop-up

This will open the file normal_popup.html in your extension in a normal pop-up window, which won't close when it loses focus. Because the name parameter is the same, the pop-up window will get reused if the user launches popup.html again.

Upvotes: 17

Mohamed Mansour
Mohamed Mansour

Reputation: 40199

As a user, you currently cannot force the the popup to stay open. That is a UI decision the UI team made. If you want to want to force a setup, you can have other way to show this by changing the popup icon, open a new tab when it requests, or new popup view for registration.

As a developer, inspect the popup, and it will stay open.

Upvotes: 54

Related Questions