Skip to content

fix: restore Cmd+S save and title caret in bookmarks panel - #4066

Merged
amitsingh-007 merged 3 commits into
mainfrom
bug-bookmark-cmd-s-and-title-caret
Jul 12, 2026
Merged

amitsingh-007 merged 3 commits into
mainfrom
bug-bookmark-cmd-s-and-title-caret

Conversation

@amitsingh-007

@amitsingh-007 amitsingh-007 commented Jul 12, 2026 •

Copy link
Copy Markdown
Owner

Check if the Pull Request fulfils these requirements

  • Does the extension require a version change?

Summary by Sourcery

Restore expected save hotkey behaviour and title field focus in the bookmarks panel edit dialog.

Enhancements:

  • Ensure Cmd+S (mod+S) triggers save even when focus is inside the bookmarks search input.
  • Set the edit bookmark dialog to focus the title field with the caret positioned at the start when opened.

Tests:

  • Add coverage for title input focus and caret position when opening the bookmark edit modal.
  • Add coverage to verify Cmd+S saves changes while focus is in the bookmarks search input.

Greptile Summary

This PR restores two regression fixes in the bookmarks panel: Cmd+S now fires even when focus is in the search input by passing [] as tagsToIgnore to useHotkeys, with a [role="dialog"] guard preventing spurious saves when any dialog is open; and the bookmark edit dialog now focuses the title input with the caret at position 0 via an initialFocus callback and a useRef.

Confidence Score: 5/5

The changes are narrowly scoped and well-tested; the dialog guard correctly prevents the hotkey from interfering with in-progress edits across all dialog types.

Both fixes are tightly scoped with matching E2E test coverage. The [role=dialog] guard is the correct idiomatic check and covers all dialogs in the component tree. No new code paths are introduced that could cause data loss or incorrect behavior.

No files require special attention.

Reviews (3): Last reviewed commit: "Update package.json" | Re-trigger Greptile

- Pass empty tagsToIgnore to the bookmarks header useHotkeys so mod+S
  fires even when focus is in an input (restores pre-mantine behavior)
- Place the caret at the start of the title input when the add/edit
  bookmark modal opens via base-ui initialFocus
- Add e2e tests reproducing both bugs

Fixes #4064

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@amitsingh-007 amitsingh-007 linked an issue Jul 12, 2026 that may be closed by this pull request
2 tasks done
@qodo-code-review

Copy link
Copy Markdown

PR Summary by Qodo

Restore Cmd+S save hotkey and title caret behavior in Bookmarks panel

🐞 Bug fix 🧪 Tests 🕐 40+ Minutes

Grey Divider

AI Description

• Re-enable Cmd/Ctrl+S to save in Bookmarks even when an input is focused.
• Focus the bookmark title field with the caret at position 0 when edit/add opens.
• Add Playwright e2e coverage to prevent regressions for both behaviors.
Diagram

sequenceDiagram
  participant T as "Playwright e2e"
  participant P as "Bookmarks Panel"
  participant H as "BookmarksHeader"
  participant K as "useHotkeys"
  participant D as "Add/Edit Dialog"
  participant B as "DialogContent (base-ui)"
  participant I as "Title Input"

  T->>P: Open Bookmarks panel
  T->>P: Create pending change
  T->>P: Focus search input
  T->>K: Press Cmd/Ctrl+S
  K->>H: Invoke mod+S handler
  H->>P: handleSave(folderId)

  T->>D: Open edit modal
  D->>B: initialFocus(focusCaretAtTitleStart)
  B->>I: focus() + setSelectionRange(0,0)
  T->>I: Assert focused + caret at start
Loading
High-Level Assessment

The following are alternative approaches to this PR:

1. Global keydown listener (capture) for Cmd/Ctrl+S
  • ➕ Guaranteed to fire regardless of focus and local component lifecycles
  • ➕ Centralizes save hotkey behavior for the whole popup
  • ➖ Higher risk of interfering with other inputs/shortcuts
  • ➖ Harder to scope to Bookmarks panel only; more cleanup complexity
2. Post-open focus effect (useEffect) to set caret
  • ➕ Avoids relying on Dialog initialFocus semantics
  • ➕ Easier to reason about if the input ref is available after render
  • ➖ More timing-sensitive (animation/portal mounting) and can cause focus flicker
  • ➖ May fight with the dialog library’s built-in focus management

Recommendation: Keep the current approach: passing an empty tagsToIgnore to the BookmarksHeader hotkey binding restores expected mod+S behavior with minimal scope, and using base-ui DialogContent.initialFocus is the most stable way to set focus/caret without racing mount timing. The added e2e tests make these UX regressions much less likely to reappear.

Files changed (3) +71 / -12

Bug fix (2) +31 / -12
BookmarkAddEditDialog.tsxSet initial focus and caret position for the bookmark title input +18/-2

Set initial focus and caret position for the bookmark title input

• Adds a ref to the title input and wires DialogContent.initialFocus to focus the title field and place the caret at the start. Returns a boolean to prevent base-ui from overriding focus when the ref-based focusing succeeds.

apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarkAddEditDialog.tsx

BookmarksHeader.tsxRestore Cmd/Ctrl+S save hotkey while an input has focus +13/-10

Restore Cmd/Ctrl+S save hotkey while an input has focus

• Updates the useHotkeys invocation to pass an empty tagsToIgnore list so the mod+S handler fires even when focus is inside an input (e.g., search). Keeps the existing preventDefault/stopPropagation behavior and disableSave guard.

apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarksHeader.tsx

Tests (1) +40 / -0
bookmarks.spec.tsAdd e2e regressions for modal focus/caret and Cmd+S save +40/-0

Add e2e regressions for modal focus/caret and Cmd+S save

• Introduces a test asserting the edit dialog focuses the title input with selectionStart/selectionEnd at 0. Adds a test ensuring Cmd+S triggers saving while the search input is focused, verifying the saved toast appears.

apps/extension/tests/specs/bookmarks.spec.ts

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey - I've found 1 issue

Prompt for AI Agents
Please address the comments from this code review:

## Individual Comments

### Comment 1
<location path="apps/extension/tests/specs/bookmarks.spec.ts" line_range="100-109" />
<code_context>
       await expect(dialog).toBeHidden();
     });

+    test('should focus the title input with caret at start when opening the edit modal', async ({
+      bookmarksPage,
+    }) => {
+      const panel = new BookmarksPanel(bookmarksPage);
+      await panel.ensureAtRoot();
+
+      const dialog = await panel.openEditBookmarkDialog(
+        TEST_BOOKMARKS.REACT_DOCS
+      );
+      const titleInput = dialog.getByTestId('bookmark-title-input');
+      await expect(titleInput).toBeFocused();
+
+      const selection = await titleInput.evaluate((el) => ({
+        start: (el as HTMLInputElement).selectionStart,
+        end: (el as HTMLInputElement).selectionEnd,
+      }));
+      expect(selection.start).toBe(0);
+      expect(selection.end).toBe(0);
+
+      await panel.closeDialog();
+    });
+
</code_context>
<issue_to_address>
**suggestion (testing):** Strengthen caret-position test to explicitly cover non-empty edited titles

This only checks the caret position; it doesn’t verify we’re in a true edit scenario with a pre-populated title. Please also assert that the title input has the expected non-empty value (e.g. `toHaveValue(TEST_BOOKMARKS.REACT_DOCS.title)` or at least `not.toBe('')`) so the caret behaviour is exercised on an actual edited bookmark rather than an empty field.

```suggestion
      const dialog = await panel.openEditBookmarkDialog(
        TEST_BOOKMARKS.REACT_DOCS
      );
      const titleInput = dialog.getByTestId('bookmark-title-input');
      await expect(titleInput).toHaveValue(TEST_BOOKMARKS.REACT_DOCS.title);
      await expect(titleInput).toBeFocused();

      const selection = await titleInput.evaluate((el) => ({
        start: (el as HTMLInputElement).selectionStart,
        end: (el as HTMLInputElement).selectionEnd,
      }));
```
</issue_to_address>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

Comment thread apps/extension/tests/specs/bookmarks.spec.ts
@qodo-code-review

Copy link
Copy Markdown

Code Review by Qodo

🐞 Bugs (1) 📘 Rule violations (0) 📜 Skill insights (0)

Context used
✅ Compliance rules (platform): 23 rules

Grey Divider


Action required

1. Input ref not forwarded 🐞 Bug ≡ Correctness
Description
BookmarkAddEditDialog relies on titleInputRef.current to focus and set the caret position, but
@bypass/ui's Input is a plain function component and does not forward refs, so the ref will
never point to the underlying <input>. This prevents the new caret-at-start behavior from working
and can make the new focus/selection E2E test fail (fallback focus behavior will run instead).
Code

apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarkAddEditDialog.tsx[R225-227]

                <Input
+                  ref={titleInputRef}
                  data-testid="bookmark-title-input"
Relevance

⭐⭐⭐ High

Team uses forwardRef in UI primitives (e.g., ScrollArea in PR #3946); likely fix Input similarly for
tests.

PR-#3946

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
The dialog focus function depends on titleInputRef.current, but the shared Input component never
forwards/attaches refs to the underlying input element, so titleInputRef.current cannot be
populated.

apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarkAddEditDialog.tsx[83-93]
apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarkAddEditDialog.tsx[225-232]
packages/ui/src/components/ui/input.tsx[6-17]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
`BookmarkAddEditDialog` passes `ref={titleInputRef}` to `@bypass/ui`'s `<Input>` and then uses `titleInputRef.current` inside `focusCaretAtTitleStart` to focus and set the selection range. However, `packages/ui`'s `Input` wrapper does not use `React.forwardRef`, so React will not attach the ref to the underlying input element.

### Issue Context
This breaks the intended caret positioning behavior (and likely the new E2E test) because `titleInputRef.current` stays `null` and the code always takes the fallback path.

### Fix Focus Areas
- packages/ui/src/components/ui/input.tsx[1-20]
- apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarkAddEditDialog.tsx[83-93]

### Suggested fix
1. Update `packages/ui/src/components/ui/input.tsx` to export `Input` as a `React.forwardRef` component.
2. Pass the forwarded `ref` through to `InputPrimitive` (so consumers can focus/select the real HTMLInputElement).
3. Keep existing props/className behavior unchanged.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


Grey Divider

Qodo Logo

@coderabbitai

coderabbitai Bot commented Jul 12, 2026 •

Copy link
Copy Markdown
📝 Walkthrough

Walkthrough

The bookmark edit dialog now focuses its title input and places the caret at position zero when opened. The bookmarks header save shortcut is configured to trigger while focus is inside an input. End-to-end tests cover both the initial title selection behavior and saving from the bookmarks search input.

Possibly related PRs

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
Title check ✅ Passed The title clearly matches the main change: restoring Cmd+S save behavior and title caret positioning in the bookmarks panel.
Description check ✅ Passed The description matches the template by answering the version-change question and includes a clear summary and tests.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/extension/tests/specs/bookmarks.spec.ts`:
- Around line 445-462: Update the keyboard shortcut invocation in the “should
save via Cmd+S while focus is in the search input” test to use Playwright’s
cross-platform ControlOrMeta+s shortcut instead of Meta+s, preserving the
existing focus and saved-state assertions.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 1c5cbca3-6854-4504-ac13-9d9df9cd5f74

📥 Commits

Reviewing files that changed from the base of the PR and between 23266b9 and a91a6fa.

📒 Files selected for processing (3)
  • apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarkAddEditDialog.tsx
  • apps/extension/src/entrypoints/popup/panels/BookmarksPanel/components/BookmarksHeader.tsx
  • apps/extension/tests/specs/bookmarks.spec.ts

Comment thread apps/extension/tests/specs/bookmarks.spec.ts
amitsingh-007 and others added 2 commits July 12, 2026 10:17
- Skip the panel Cmd+S save when focus is inside a dialog so an
  in-progress bookmark form edit isn't dropped from the saved snapshot
- Assert the edited title's value in the caret-at-start e2e test
- Use ControlOrMeta+s in the Cmd+S e2e test for cross-platform CI

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@webext-bot

webext-bot Bot commented Jul 12, 2026

Copy link
Copy Markdown

Extension version is updated from 24.12.0 to 24.12.1

@amitsingh-007
amitsingh-007 merged commit d91c64c into main Jul 12, 2026
4 checks passed
@amitsingh-007
amitsingh-007 deleted the bug-bookmark-cmd-s-and-title-caret branch July 12, 2026 04:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bugs

1 participant