How to open sidepanel when click the plugin icon in chrome?

[zeroxer]

No description provided.

[aklinker1]

Edit: See @abegehr response below for the correct way: #570 (comment)

---

1. Add an on click listener to your action
   https://developer.chrome.com/docs/extensions/reference/api/action#event-onClicked

2. Call open
   https://developer.chrome.com/docs/extensions/reference/api/sidePanel#method-open

// entrypoints/background.ts

browser.action.onClicked.addListener(() => browser.sidePanel.open());

browser.action will be undefined if you haven't added the action field to the manifest. You can just set it equal to a empty object

// wxt.config.ts
export default defineConfig({
  manifest: {
    action: {},
  }
})

[abegehr]

I ran into the same question. Two remarks:

1. Make sure your action object in manifest does not have a default_popup field set, otherwise action.onClicked will not be called.
2. The browser extension api does not include sidePanel, so TSC will complain ("Property 'sidePanel' does not exist on type 'AugmentedBrowser'"), however it still works. Using browser.sidebarAction.toggle() does not work in Chrome (sidebarAction is undefined).

[abegehr]

Instead of using the onClicked handler, this is the way to do it from the chrome docs: https://developer.chrome.com/docs/extensions/reference/api/sidePanel#open-action-icon

// Allows users to open the side panel by clicking on the action toolbar icon
browser.sidePanel
  .setPanelBehavior({ openPanelOnActionClick: true })
  .catch((error) => console.error(error));

Again, TSC will complain about browser.sidePanel but it works.

[jtsang4]

As @abegehr said, the type issue is still exist.

[cloudflypeng]

and make sure you add

into wxt.config.ts because it's not auto

[aklinker1]

v0.18.2 adds the permission automatically when a side panel entry point is defined

[nileshtrivedi]

@aklinker1 Thoughts on adding a sidepanel page by default in all templates?

[aklinker1]

I've consistently said no to adding content to the templates:

• Update the content of content.ts to the corresponding template content. #552
• When creating a template, it is recommended to include a "Hello world" example with 1 test case. #325
• Add some features to the CLI #369
• Extend CLI functionality #187

So I'm going to say no to this one as well. Templates are a huge time sink to keep up to date and the more features/variants that are added, the more time it takes away from me to add features and fixes to WXT itself.

That said, I'm open to adding community template support to the init command!