Skip to content

Stop the iOS keyboard flash when tapping an image (meowdown touch-tap prep)#655

Merged
maccman merged 2 commits into
nextfrom
claude/ios-keyboard-image-tap-86fa82
Jul 8, 2026
Merged

Stop the iOS keyboard flash when tapping an image (meowdown touch-tap prep)#655
maccman merged 2 commits into
nextfrom
claude/ios-keyboard-image-tap-86fa82

Conversation

@maccman

@maccman maccman commented Jul 8, 2026

Copy link
Copy Markdown
Contributor

Problem

On iOS, tapping an image in the editor briefly raises the software keyboard while the lightbox opens, then hides it again — a visible show/hide flash.

Root cause: meowdown's earlier guard (prosekit/meowdown#253, in 0.39.0) cancels pointerdown for touch, which suppresses the compatibility mouse events — but iOS WebKit's tap-to-focus is a native gesture default action tied to the touch event stream. The tap still focuses the surrounding contenteditable, and since PR #580's userIsInteracting swizzle every focus presents the keyboard; the Radix lightbox dialog then steals focus and the keyboard drops — the flash. The only thing that stops WebKit's synthetic-click/focus path is cancelling the tap's touchend.

Fix

Fixed upstream in prosekit/meowdown#263, released in 0.40.0 (0.40.1 is the current patch): the image-click extension now recognizes single-finger taps on previews itself (movement tolerance, resize-handle/multi-touch exclusions), cancels the touchend (killing both the focus and the synthetic click), and fires onImageClick directly with the TouchEvent.

This PR:

  • Bumps @meowdown/core/@meowdown/react from ^0.39.0 to ^0.40.1 — the caret range doesn't resolve past 0.39.x on its own for a 0.x package, so this needed an explicit bump.
  • Widens handleImageClick's payload to event: MouseEvent | TouchEvent to match meowdown's widened ImageClickPayload (required under strictFunctionTypes); it only reads event.target, which both event types carry (a touchend's target is the touchstart target — the <img>), so the view-transition source lookup is unchanged.
  • Mirrors the type in the note-editor test mock.

Testing

  • meowdown: 3 new chromium/firefox browser tests (webkit skipped — its Touch constructor throws) covering a stationary tap firing once with touchend cancelled, a moved touch being ignored, and a resize-handle tap being left alone; full meowdown CI green across linux/mac/windows × chromium/firefox/webkit.
  • Reflect: with @meowdown/core@0.40.1 actually installed (not an override), verified in the ?platform=ios browser harness — a synthesized touch tap on an image preview cancels touchend, never focuses the editor, and opens the lightbox with the right image.
  • pnpm --filter @reflect/desktop typecheck clean, full src/editor suite (23 files / 262 tests) passes, pnpm lint clean.
  • On-device/simulator confirmation of the actual keyboard flash: left to a manual pass, since it only reproduces with the real iOS keyboard.

🤖 Generated with Claude Code


Note

Low Risk
Narrow typing and dependency bump on editor image-click handling; no auth, data, or broad architectural changes.

Overview
Bumps @meowdown/core and @meowdown/react to 0.40.1 (lockfile included), pulling in upstream image-tap handling that cancels touchend on iOS so tapping an inline image opens the lightbox without briefly focusing the editor and flashing the keyboard.

Reflect-side changes align with the wider onImageClick payload: handleImageClick in note-editor.tsx now types event as MouseEvent | TouchEvent (only event.target is used for the view-transition source lookup, so behavior is unchanged for mouse). The note-editor test mock matches that signature.

Reviewed by Cursor Bugbot for commit e65a52e. Bugbot is set up for automated code reviews on this repo. Configure here.

Summary by CodeRabbit

  • New Features

    • Image interactions now work better on touch devices, including improved handling for taps and focus behavior on iOS.
  • Chores

    • Updated desktop app package versions for core editor components to the latest compatible release.

meowdown's iOS keyboard-flash fix (prosekit/meowdown#263) delivers the
tap's cancelled touchend instead of a synthetic click, widening
ImageClickPayload.event to MouseEvent | TouchEvent. Mirror that in the
lightbox handler and the editor-mock props so the ^0.39.x bump
typechecks; the handler only reads event.target, which both carry.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@coderabbitai

coderabbitai Bot commented Jul 8, 2026

Copy link
Copy Markdown

Review Change Stack

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 55643295-8ed9-4e52-871a-7acb93e65cfd

📥 Commits

Reviewing files that changed from the base of the PR and between 63e050d and e65a52e.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (3)
  • apps/desktop/package.json
  • apps/desktop/src/editor/note-editor.test.tsx
  • apps/desktop/src/editor/note-editor.tsx

Walkthrough

This PR bumps the @meowdown/core and @meowdown/react dependency versions in the desktop app, widens the handleImageClick event parameter type in NoteEditor to accept MouseEvent | TouchEvent, and updates the corresponding test mock's type definition to match.

Changes

TouchEvent Support and Dependency Update

Layer / File(s) Summary
Dependency bump
apps/desktop/package.json
@meowdown/core and @meowdown/react version ranges bumped from ^0.39.0 to ^0.40.1.
handleImageClick TouchEvent support
apps/desktop/src/editor/note-editor.tsx, apps/desktop/src/editor/note-editor.test.tsx
handleImageClick's event parameter type widened to `MouseEvent

Estimated code review effort: 1 (Trivial) | ~5 minutes

Possibly related PRs

  • team-reflect/reflect-open#210: Both PRs bump @meowdown/core/@meowdown/react versions in apps/desktop/package.json and touch note-editor.tsx.
  • team-reflect/reflect-open#270: The handleImageClick/test mock TouchEvent change is directly tied to this PR's image-click/lightbox handling via onImageClick.
  • team-reflect/reflect-open#209: Both PRs touch apps/desktop/src/editor/note-editor.tsx, one refactoring the editor wrapper/props, the other updating handleImageClick.
✨ 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 claude/ios-keyboard-image-tap-86fa82

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

prosekit/meowdown#263 landed as 89aa7e7 and shipped in 0.40.0 (0.40.1
is the latest patch). Bumping the pinned range since ^0.39.0 does not
resolve past 0.39.x for a 0.x package.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@maccman maccman merged commit 3ecd101 into next Jul 8, 2026
6 of 7 checks passed
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.

1 participant