[forgetso]

Closes #121.

The popup closes the moment anything else takes focus, so clicking into the page to check a replacement dismisses it and the terms have to be typed again. Settings now offers Open in: Popup | Side panel, and the header carries a button to switch surface there and then.

Note

Stacked on #133 — base that branch, not master, because both touch popup.html, style.css, help.html and every locale file. Review #133 first; this diff is the side panel alone.

One UI, two surfaces

Both surfaces load the same assets/popup.html, popup.js and style.css — there is no second copy of the UI to keep in step. background/surface.ts registers the panel with ?surface=sidepanel, and that query string is the only thing popup.ts keys its layout off:

• the panel fills the width it is given rather than sitting in a 320px column
• the action buttons pin to the bottom of the window instead of floating halfway up it
• the history list drops its max-height, which only exists to keep the popup inside Chrome's 600px

Measured at 320, 400 and 560px wide: no horizontal overflow, footer pinned, layout intact.

Making the toolbar button reach it

Clearing default_popup is the part that matters. While a popup is registered Chrome opens it and never fires action.onClicked, so openPanelOnActionClick has nothing to act on and the panel would only be reachable from Chrome's own side panel menu. Neither setPopup nor the panel behaviour survives a browser restart, so both are reapplied on onStartup as well as on install and whenever the preference changes.

The manifest, deliberately plain

side_panel.default_path stays assets/popup.html with no query string. A manifest Chrome rejects stops the extension loading at all, and I could not prove a query string there is accepted: --load-extension does not install anything in this environment, and the unmodified manifest from master fails identically, so that test is inconclusive rather than reassuring. The query is applied through sidePanel.setOptions() instead, which runs on install, on startup and on every preference change — always before the panel can be opened. If it somehow had not run, the panel still renders, just in the popup's narrow column.

Header, reorganised

The side panel toggle was a sixth icon, and six icons plus the title could not share 320px without the icons crowding and the title truncating to "Search and Repl...". The header is now split by what the icons do:

🔍 Search and Replace                    ?  i
─────────────────────────────────────────────
      🕐         ⚙         💾         ▯
                 ▔▔▔▔

Help and about only ever open documentation, so they stay on the title line. History, settings, saved rules and the side panel toggle change what you are looking at, so they form a full-bleed tab strip sharing the width equally, with the underline marking the open panel spanning the whole tab.

That strip costs ~26px, which matters because Chrome scrolls the entire popup past 600px. Body padding drops to 12px and the history cap to 330px; measured across all ten locales the tallest is now Russian at 593.

This also exposed a rule that had never worked: #header form set flex-wrap: nowrap, but the markup carried bootstrap's .flex-wrap, whose !important beat it. With five icons they happened to fit, so nobody noticed.

Switching surface

The header button opens the side panel from the popup and closes it from within the panel. There is no sidePanel.close(), so the panel closes its own window — which is also how the popup dismisses itself once the panel has taken over. The window id is looked up on load rather than in the click handler, because sidePanel.open must be called while the user gesture is still in effect and awaiting windows.getCurrent() inside the handler risks spending it.

Behaviour differences the panel forces

The panel outlives a tab, where the popup is thrown away with it. It recounts on tabs.onActivated and on navigation of the tab on display — a match count left over from a tab the user has since switched away from is worse than no count at all.

Also in here

• chrome.sidePanel needs Chrome 114. Rather than setting minimum_chrome_version and cutting older browsers off from updates entirely, the preference is hidden where the API is missing and everything carries on as a popup.
• The toggle-popup command had no handler, so Ctrl+Shift+S has never done anything. It now opens whichever surface is configured.

Defaults

Unchanged: popup. The issue asks for a choice rather than a replacement, and silently moving every existing user into a side panel is not a choice. Say the word if you would rather the panel were the default.

Checks

npm run checks passes — typecheck, lint, format, 643 tests, build. 16 new tests cover surface.ts, including the Chrome-113 path and the browser refusing the call.

Not verifiable from here, worth a smoke test on an unpacked build: that the manifest loads, that the panel opens from the toolbar button and from Ctrl+Shift+S, and that setOptions gets the query string in place before first use.

Follow-up filed as #135: counting and replacing should be one pass over one set of instances rather than two independent walks that disagree.

🤖 Generated with Claude Code