test: add Tier B cross-block arrow navigation and held-block skip tests (closes #163)

[brylie]

Closes #163

Summary

Adds Playwright Tier B test coverage in tests/e2e/tier-b.spec.ts for real-browser cross-block keyboard navigation (ArrowUp / ArrowDown) across single and multi-line paragraphs, column preservation, and held-block skipping.

Changes

1. Cross-block Arrow Navigation & Column Preservation:
   • Tests navigation between a single-line paragraph, a multi-line wrapped paragraph, and another single-line paragraph.
   • Verifies ArrowDown from Block 1 transitions to Block 2's first line with column (clientX) preserved within 15px.
   • Verifies intra-block line navigation within Block 2 without escaping prematurely.
   • Verifies ArrowDown at the bottom visual line of Block 2 transitions to Block 3 while preserving column.
   • Verifies ArrowUp from Block 3 transitions back to Block 2, landing on its last visual line (not first line) while preserving column.
   • Verifies navigating up through Block 2 and escaping to Block 1 on ArrowUp from line 1.
2. Held-block Skip-over Navigation:
   • Acquires an MCP hold (hold_records) on a middle block, replacing its editor with the shimmer placeholder.
   • Verifies ArrowDown from the block above skips the held block and lands directly in the block below.
   • Verifies ArrowUp from the block below skips the held block and lands directly in the block above.

Verification

• npx playwright test -g "issue #163" (all passed)
• npx playwright test tests/e2e/tier-b.spec.ts (11 passed)
• npm run lint && npm run check (0 errors, 0 warnings)
• Pre-push check pipeline (prettier, eslint, unit tests with coverage, build, e2e) passed cleanly.

[coderabbitai]

Warning

Review limit reached

• Run on-demand review

_{This review includes 1 billable file and costs up to $0.25.}

Or wait 37 minutes for your next included review.

Check out review usage here.

View limit details

Limit details: You’ve used all 4 included reviews currently available. Your 38 included PR review attempts over the past 7 days set your current allowance at 4 reviews per hour.

Learn how review limits work.

Review configuration:

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Essentials

Run ID: b8e9b1eb-e82b-4e9c-b55e-9317795ab928

📥 Commits

Reviewing files that changed from the base of the PR and between 2491e55 and 60c73ba.

📒 Files selected for processing (1)

• tests/e2e/tier-b.spec.ts

---

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

[qodo-code-review]

PR Summary by Qodo

Add Tier B coverage for cross-block arrow navigation

🧪 Tests 🕐 20-40 Minutes

AI Description

• Cover cross-block arrow navigation and column preservation across wrapped paragraphs.
• Verify held blocks are skipped bidirectionally during keyboard navigation.

Diagram

sequenceDiagram
    participant T as Playwright Test
    participant S as Workspace Store
    participant B as Browser Page
    participant E as Block Editors
    participant M as MCP Client
    T->>S: Seed three blocks
    T->>B: Open document
    B->>E: Render editors
    T->>B: Send arrow keys
    B->>E: Move caret by line
    T->>M: Hold middle block
    M->>S: Record hold
    S-->>B: Replace held editor
    T->>B: Navigate past hold
    B->>E: Focus next editor

Loading

High-Level Assessment

The real-browser Playwright approach is appropriate because visual wrapping, caret coordinates, focus transitions, and held-block rendering depend on actual browser layout and integrated MCP state. Unit-level DOM mocks would run faster but could not reliably validate these behaviors.

Files changed (1) +207 / -1

Tests (1) +207 / -1

tier-b.spec.tsTest cross-block arrow navigation and held-block skipping +207/-1

Test cross-block arrow navigation and held-block skipping

• Imports writeRecord to seed paragraph content and adds Tier B Playwright coverage for bidirectional navigation across single-line and wrapped blocks. The tests verify visual-line boundaries, horizontal caret preservation within 15px, and skipping an MCP-held middle block whose editor is replaced by a shimmer placeholder.

tests/e2e/tier-b.spec.ts

[qodo-code-review]

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (0) 📎 Requirement gaps (0)

Great, no issues found!

Qodo reviewed your code and found no material issues that require review

Tip of the day

💡 Did you know, you can hide the parts of a finding you never read, like the evidence or the agent prompt

More tips ↗ | Customize Qodo ↗ | Qodo docs ↗