Enable sidebar for firefox

[Hit2Skill]

Everything I tried seems to work out of the box just with this small config change.

I am still looking into why the sidebar does not get any icon.

[Hit2Skill]

It looks like wxt is removing the default_icon during compilation, the manifest within about:debugging does not include any default_icon field.

{"manifest_version":2,"name":"asbplayer: Language-learning with subtitles","description":"__MSG_extensionDescription__","version":"1.14.0","icons":{"16":"icon/icon16.png","32":"icon/icon32.png","48":"icon/icon48.png","64":"icon/icon64.png","128":"icon/icon128.png"},"default_locale":"en","web_accessible_resources":["chunks/*","fonts/*","asbplayer-locales/*","icon/image.png","netflix-page.js","youtube-page.js","stremio-page.js","tver-page.js","bandai-channel-page.js","amazon-prime-page.js","hulu-page.js","iwanttfc-page.js","disney-plus-page.js","apps-disney-plus-page.js","viki-page.js","unext-page.js","emby-jellyfin-page.js","osnplus-page.js","bilibili-page.js","nrk-tv-page.js","plex-page.js","areena-yle-page.js","hbo-max-page.js","cijapanese-page.js","anki-ui.js","mp3-encoder-worker.js","pgs-parser-worker.js","video-data-sync-ui.js","video-select-ui.js","notification-ui.js","mobile-video-overlay-ui.html","page-favicons/*"],"sidebar_action":{"default_panel":"sidepanel.html","default_title":"asbplayer"},"commands":{"copy-subtitle":{"description":"__MSG_shortcutMineSubtitleDescription__"},"copy-subtitle-with-dialog":{"suggested_key":{"default":"Ctrl+Shift+X","mac":"MacCtrl+Shift+X"},"description":"__MSG_shortcutMineSubtitleAndOpenDialogDescription__"},"update-last-card":{"suggested_key":{"default":"Ctrl+Shift+U","mac":"MacCtrl+Shift+U"},"description":"__MSG_shortcutUpdateLastCardDescription__"},"toggle-video-select":{"suggested_key":{"default":"Ctrl+Shift+F","mac":"MacCtrl+Shift+F"},"description":"__MSG_shortcutSelectSubtitleTrackDescription__"},"export-card":{"description":"__MSG_shortcutExportCardDescription__"},"take-screenshot":{"suggested_key":{"default":"Ctrl+Shift+V","mac":"MacCtrl+Shift+V"},"description":"__MSG_shortcutTakeScreenshotDescription__"},"toggle-recording":{"description":"__MSG_shortcutToggleRecordingDescription__"}},"browser_specific_settings":{"gecko":{"id":"{e4b27483-2e73-4762-b2ec-8d988a143a40}","update_url":"https://killergerbah.github.io/asbplayer/firefox-extension-updates.json"}},"permissions":["tabs","storage","unlimitedStorage","contextMenus","webRequest","webRequestBlocking","clipboardWrite","<all_urls>"],"background":{"scripts":["background.js"]},"options_ui":{"open_in_tab":true,"page":"options.html"},"content_scripts":[{"matches":["*://app.asbplayer.dev/*","*://killergerbah.github.io/asbplayer*"],"all_frames":true,"run_at":"document_start","js":["content-scripts/asbplayer.js"]},{"matches":["<all_urls>"],"all_frames":true,"exclude_globs":["*://app.asbplayer.dev/*","*://killergerbah.github.io/asbplayer*"],"run_at":"document_start","js":["content-scripts/page.js"]},{"matches":["<all_urls>"],"all_frames":true,"exclude_globs":["*://app.asbplayer.dev/*","*://killergerbah.github.io/asbplayer*"],"run_at":"document_idle","css":["content-scripts/video.css"],"js":["content-scripts/video.js"]}],"browser_action":{"default_title":"asbplayer"}}

Any ideas on what I could try to resolve this?
I was struggling with wxt for a while and just enabling the sidebar took me longer than I would like to admit, because I missed the meta tag in sidepanel/index.html

[killergerbah]

Holy crap nice find, can't believe I missed this all this time lol

[killergerbah]

You'll also want to enable all sidepanel related UI with this diff:

• Button needs to be shown in extension popup
• Keyboard shortcut needs to be shown as well
• Anywhere we open the side panel, the Firefox method should be used: sidebarAction.open() . Instead of using if else branching everywhere I would suggest extracting that logic into a reusable function.
• To be exhaustive, could search for isFirefox anywhere and deal with any sidepanel-related code that shows up.

I'm also happy to do this if you'd prefer

[killergerbah]

So as you observed wxt is very opinionated about how to do things. I had to dig through the docs but the wxt way to do this is like with the a diff like below:

diff --git a/extension/src/entrypoints/sidepanel/index.html b/extension/src/entrypoints/sidepanel/index.html
index 16884a1b..bad5bb44 100644
--- a/extension/src/entrypoints/sidepanel/index.html
+++ b/extension/src/entrypoints/sidepanel/index.html
@@ -4,6 +4,15 @@
         <meta charset="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <title>asbplayer</title>
+         <meta
+            name="manifest.default_icon"
+            content="{
+                '16': 'icon/icon16.png',
+                '48': 'icon/icon48.png',
+                '128': 'icon/icon128.png',
+            }"
+            />
+        <meta name="manifest.open_at_install" content="true" />
         <style>
             @import url('/fonts/fonts.css');
         </style>
diff --git a/extension/wxt.config.ts b/extension/wxt.config.ts
index 6535024f..0256d87b 100644
--- a/extension/wxt.config.ts
+++ b/extension/wxt.config.ts
@@ -193,11 +193,6 @@ export default defineConfig({
             manifest = {
                 ...manifest,
                 host_permissions: ['<all_urls>'],
-                sidebar_action: {
-                    default_panel: 'index.html',
-                    open_at_install: false,
-                    default_icon: icons,
-                },
                 commands,
                 browser_specific_settings: {
                     gecko,