Skip to content

[local-explorer-ui] Fix data studio cell keydown swallowing browser shortcuts#14531

Open
matingathani wants to merge 6 commits into
cloudflare:mainfrom
matingathani:fix/data-studio-cell-keydown-swallow
Open

[local-explorer-ui] Fix data studio cell keydown swallowing browser shortcuts#14531
matingathani wants to merge 6 commits into
cloudflare:mainfrom
matingathani:fix/data-studio-cell-keydown-swallow

Conversation

@matingathani

@matingathani matingathani commented Jul 3, 2026

Copy link
Copy Markdown
Contributor

Fixes #14524

In the data studio table for D1 databases / Durable Objects, clicking a table cell (read-only, not editing) and then pressing a browser shortcut like Cmd+1 did nothing — the keydown was swallowed instead of reaching the browser.

StudioTable's onKeyDown handler (packages/local-explorer-ui/src/components/studio/Table/index.tsx) called e.preventDefault() unconditionally after its if/else-if chain of recognized navigation keys (arrows, Tab, Enter). Any other key — including all Cmd/Ctrl+<key> browser shortcuts — fell through to that same preventDefault() since there was no else branch and no check on e.metaKey/e.ctrlKey.

Fix: added an else { return; } before the preventDefault(), so it only fires for the keys the grid itself handles. Everything else now passes through untouched.

Also extracted the key-handling logic into an exported handleStudioTableKeyDown function (dependency-injected, no closures) so it's unit-testable without rendering the component — this package has no React render-test infra (no testing-library/jsdom), so this keeps the new test a plain Vitest unit test consistent with the rest of the package's tests.


  • Tests
    • Tests included/updated
    • Automated tests not possible - manual testing has been completed as follows:
    • Additional testing not necessary because:
  • Public documentation
    • Cloudflare docs PR(s):
    • Documentation not necessary because: internal bug fix to an existing UI, no user-facing docs to update

Open in Devin Review

…used table cells

The data studio table's onKeyDown handler called e.preventDefault()
unconditionally after its key-matching chain, so any key it didn't
recognize (e.g. Cmd+<number> tab-switch shortcuts) still got blocked
while a cell was focused but not being edited. Only preventDefault
for keys the grid actually handles.

Fixes cloudflare#14524
Copilot AI review requested due to automatic review settings July 3, 2026 09:18
@changeset-bot

changeset-bot Bot commented Jul 3, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 411d6c2

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@cloudflare/local-explorer-ui Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-project-automation github-project-automation Bot moved this to Untriaged in workers-sdk Jul 3, 2026
@workers-devprod workers-devprod requested review from a team and emily-shen and removed request for a team July 3, 2026 09:19
@workers-devprod

workers-devprod commented Jul 3, 2026

Copy link
Copy Markdown
Contributor

Codeowners approval required for this PR:

  • @cloudflare/wrangler
Show detailed file reviewers
  • .changeset/data-studio-cell-keydown-swallow.md: [@cloudflare/wrangler]
  • packages/local-explorer-ui/src/tests/components/studio/table-keydown.test.ts: [@cloudflare/wrangler]
  • packages/local-explorer-ui/src/components/studio/Table/index.tsx: [@cloudflare/wrangler]

This comment was marked as resolved.

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
devin-ai-integration[bot]

This comment was marked as resolved.

@pkg-pr-new

pkg-pr-new Bot commented Jul 3, 2026

Copy link
Copy Markdown
@cloudflare/autoconfig

npm i https://pkg.pr.new/@cloudflare/autoconfig@14531

create-cloudflare

npm i https://pkg.pr.new/create-cloudflare@14531

@cloudflare/deploy-helpers

npm i https://pkg.pr.new/@cloudflare/deploy-helpers@14531

@cloudflare/kv-asset-handler

npm i https://pkg.pr.new/@cloudflare/kv-asset-handler@14531

miniflare

npm i https://pkg.pr.new/miniflare@14531

@cloudflare/pages-shared

npm i https://pkg.pr.new/@cloudflare/pages-shared@14531

@cloudflare/unenv-preset

npm i https://pkg.pr.new/@cloudflare/unenv-preset@14531

@cloudflare/vite-plugin

npm i https://pkg.pr.new/@cloudflare/vite-plugin@14531

@cloudflare/vitest-pool-workers

npm i https://pkg.pr.new/@cloudflare/vitest-pool-workers@14531

@cloudflare/workers-auth

npm i https://pkg.pr.new/@cloudflare/workers-auth@14531

@cloudflare/workers-editor-shared

npm i https://pkg.pr.new/@cloudflare/workers-editor-shared@14531

@cloudflare/workers-utils

npm i https://pkg.pr.new/@cloudflare/workers-utils@14531

wrangler

npm i https://pkg.pr.new/wrangler@14531

commit: 411d6c2

matingathani and others added 4 commits July 3, 2026 14:55
Co-authored-by: devin-ai-integration[bot] <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Extract onKeyDown's key-handling logic into an exported, dependency-injected
handleStudioTableKeyDown so it can be unit tested without rendering the
component (this package has no React render-test infra). Covers: unhandled
keys pass through (the cloudflare#14524 regression), recognized navigation keys still
preventDefault, edit-mode short-circuit, and the customKeyDownHandler
(copy/paste) interaction.
@matingathani matingathani marked this pull request as draft July 3, 2026 10:08
@matingathani matingathani marked this pull request as ready for review July 3, 2026 10:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Untriaged

Development

Successfully merging this pull request may close these issues.

bug(local-explorer-ui): data studio selected cells swallow key events

3 participants