fix(tests): stabilize webkit keyboard handler tests with programmatic cursor positioning

[nperez0111]

Summary

Fixes flaky WebKit Playwright test failures in keyboard handler tests (keyboardhandlers.test.ts). These tests were failing intermittently on Linux WebKit CI but never on Chromium or Firefox.

Root Cause

When ArrowUp navigates the cursor between blocks at different indentation levels, the browser maps the visual X coordinate from the source line into the target line. If the target block is more indented (starts further right), the end-of-text X from a shallower block falls mid-text in the deeper block, causing the cursor to land before the end of the line.

This is correct browser behavior (ArrowUp preserves visual X position), not a bug. The cursor position is also slightly non-deterministic due to sub-pixel rendering, varying by 1 character position between runs.

Why only some tests are affected

• Same indentation: ArrowUp between blocks at the same indent level works fine -- both blocks start at the same X, so end-of-text maps to end-of-text.
• Deep → shallow (more indented → less indented): Also fine -- the higher X from the deeper block maps to at-or-beyond the end of the shallower block's text, so browsers clamp to the end.
• Shallow → deep (less indented → more indented): Broken -- the shallower block's end-of-text X falls short of the deeper block's end, landing mid-text.

Why only WebKit on Linux CI

Tested all 3 browsers on macOS -- both Chromium and WebKit land mid-text in the affected cases (Firefox always clamps to line end). Linux Chromium appears to handle this differently (always landing at line end), which is why only Linux WebKit exhibited the flakiness.

Why not use keyboard shortcuts (End, Meta+Arrow) instead?

Tested across all 3 browsers:

• End key: doesn't work in WebKit (cursor stays put)
• Home key: doesn't work in Firefox or WebKit
• Meta+ArrowRight/Left: works on macOS but maps to Ctrl+Arrow on Linux (word jump, not line end)

No single keyboard shortcut reliably moves to line start/end across all browsers and platforms.

Fix

Added two helper functions in tests/src/utils/editor.ts:

• moveCursorToBlockEnd(page) -- programmatically sets cursor to end of current block via BlockNote API
• moveCursorToBlockStart(page) -- programmatically sets cursor to start of current block via BlockNote API

These use editor.setTextCursorPosition(block, "end"/"start") which is deterministic and browser-independent. Applied to the 6 tests that navigate across different indentation levels before pressing Delete/Backspace.

Tests modified

Test	Issue	Fix
Backspace at the start of a block	Flaky heading→paragraph conversion	moveCursorToBlockStart
Backspace preserves nested blocks	ArrowUp x2 across indent levels	moveCursorToBlockStart
Delete end of block with multiple children	ArrowUp x2 shallow→deep	moveCursorToBlockEnd
Delete end of block with nested children	ArrowUp x2 shallow→deep	moveCursorToBlockEnd
Delete before shallower block	ArrowUp shallow→deep	moveCursorToBlockEnd
Delete before shallower block with children	ArrowUp x2 shallow→deep	moveCursorToBlockEnd

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
blocknote	Ready	Preview	May 14, 2026 6:06am
blocknote-website	Ready	Preview	May 14, 2026 6:06am

[coderabbitai]

📝 Walkthrough

Walkthrough

This PR adds two new Playwright test utilities that programmatically position the cursor at the start or end of the current block in BlockNote, then updates six keyboard handler end-to-end tests to use these helpers instead of keyboard shortcut sequences for cursor navigation before testing backspace and delete behaviors.

Changes

Test Helper Utilities

Layer / File(s)	Summary
New cursor positioning helpers tests/src/utils/editor.ts	Two exported async functions moveCursorToBlockStart and moveCursorToBlockEnd use page.evaluate to access the BlockNote editor instance and call setTextCursorPosition with "start" or "end" parameters to move the cursor within the current block.
Keyboard handler test updates tests/src/end-to-end/keyboardhandlers/keyboardhandlers.test.ts	Import statement expanded to include the new cursor helpers, and six keyboard handler tests ("Backspace at the start of a block", "Backspace preserves nested blocks", "Delete end of a block with multiple/nested children", "Delete before shallower block" scenarios) replace keyboard-based cursor movement with calls to moveCursorToBlockStart or moveCursorToBlockEnd before performing backspace or delete actions.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Suggested reviewers

• matthewlipski

Poem

🐰 Hop hop, the tests now leap with grace,
New helpers guide the cursor's place—
No arrow keys to stumble through,
Just BlockNote's API, tried and true!
Keyboard tests dance, cleaner than before. ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 66.67% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately and specifically identifies the main change: stabilizing flaky tests in webkit keyboard handlers through programmatic cursor positioning.
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.
Description check	✅ Passed	The PR description comprehensively documents the root cause, testing methodology, and specific fix with detailed rationale and test modifications table.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/webkit-keyboard-handler-flaky-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

• X
• Mastodon
• Reddit
• LinkedIn

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

[pkg-pr-new]

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/@blocknote/ariakit@2746

@blocknote/code-block

npm i https://pkg.pr.new/@blocknote/code-block@2746

@blocknote/core

npm i https://pkg.pr.new/@blocknote/core@2746

@blocknote/mantine

npm i https://pkg.pr.new/@blocknote/mantine@2746

@blocknote/react

npm i https://pkg.pr.new/@blocknote/react@2746

@blocknote/server-util

npm i https://pkg.pr.new/@blocknote/server-util@2746

@blocknote/shadcn

npm i https://pkg.pr.new/@blocknote/shadcn@2746

@blocknote/xl-ai

npm i https://pkg.pr.new/@blocknote/xl-ai@2746

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/@blocknote/xl-docx-exporter@2746

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/@blocknote/xl-email-exporter@2746

@blocknote/xl-multi-column

npm i https://pkg.pr.new/@blocknote/xl-multi-column@2746

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/@blocknote/xl-odt-exporter@2746

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/@blocknote/xl-pdf-exporter@2746

commit: 4eaad89

[coderabbitai]

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

tests/src/end-to-end/keyboardhandlers/keyboardhandlers.test.ts (1)

241-254: ⚠️ Potential issue | 🟡 Minor | ⚡ Quick win

Add moveCursorToBlockEnd to stabilize these Delete tests for WebKit.

Three tests use ArrowUp after creating nested blocks with Tab, then immediately invoke Delete. The WebKit issue (cursor positioning when crossing indentation levels) affects these exact patterns, yet they weren't updated with cursor helpers in the same commit that fixed similar tests:

• "Check Delete end of block with inline content child" (line 250)
• "Check Delete end of block with image child" (line 263)
• "Check Delete end of block with table child" (line 275)

Compare with nearby tests added in the same commit (deleteMultipleChildren, deleteNestedChildren, deleteShallowerBlock) which all use await moveCursorToBlockEnd(page); before Delete. Apply the same pattern here to match the established fix and prevent intermittent WebKit failures.

🤖 Prompt for 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.

In `@tests/src/end-to-end/keyboardhandlers/keyboardhandlers.test.ts` around lines
241 - 254, The three failing tests ("Check Delete end of block with inline
content child", "Check Delete end of block with image child", "Check Delete end
of block with table child") perform ArrowUp then Delete and need stabilization
for WebKit: insert await moveCursorToBlockEnd(page); after the ArrowUp keypress
(and before page.keyboard.press("Delete")) in each test so the cursor is
reliably placed at the block end; keep the rest of the flow (Tab,
insertParagraph, ArrowUp, Delete, compareDocToSnapshot) unchanged and reference
the helper moveCursorToBlockEnd(page) used by nearby tests.

🤖 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.

Outside diff comments:
In `@tests/src/end-to-end/keyboardhandlers/keyboardhandlers.test.ts`:
- Around line 241-254: The three failing tests ("Check Delete end of block with
inline content child", "Check Delete end of block with image child", "Check
Delete end of block with table child") perform ArrowUp then Delete and need
stabilization for WebKit: insert await moveCursorToBlockEnd(page); after the
ArrowUp keypress (and before page.keyboard.press("Delete")) in each test so the
cursor is reliably placed at the block end; keep the rest of the flow (Tab,
insertParagraph, ArrowUp, Delete, compareDocToSnapshot) unchanged and reference
the helper moveCursorToBlockEnd(page) used by nearby tests.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a489c3b3-8f65-47be-aa93-3ee64e9739a0

📥 Commits

Reviewing files that changed from the base of the PR and between d5bad9d and 4eaad89.

📒 Files selected for processing (2)

• tests/src/end-to-end/keyboardhandlers/keyboardhandlers.test.ts
• tests/src/utils/editor.ts