Skip to content

fix: don't treat touch-screen laptops as virtual-keyboard devices#2289

Open
Koushik-Salammagari wants to merge 1 commit into
huggingface:mainfrom
Koushik-Salammagari:fix/touchscreen-virtual-keyboard-detection
Open

fix: don't treat touch-screen laptops as virtual-keyboard devices#2289
Koushik-Salammagari wants to merge 1 commit into
huggingface:mainfrom
Koushik-Salammagari:fix/touchscreen-virtual-keyboard-detection

Conversation

@Koushik-Salammagari
Copy link
Copy Markdown

Problem

isVirtualKeyboard() returned true whenever "ontouchstart" in window was truthy. That check is satisfied by touch-screen laptops (Windows touch laptops, Chromebooks, etc.), not just phones and tablets. As a result those machines were given the mobile UI behaviour, which most visibly breaks Enter-to-send (the keydown handler in ChatInput.svelte bails out when isVirtualKeyboard() is true) and changes focus/spacing handling in ChatWindow.svelte.

Closes #1767.

Fix

Detect on-screen-keyboard devices via the coarse primary pointer media query ((pointer: coarse)) instead of mere touch capability:

  • Phones / tablets report a coarse primary pointer → still treated as virtual-keyboard devices.
  • Touch-screen laptops keep a fine primary pointer (mouse/trackpad) → no longer misclassified, so Enter-to-send works again.
  • The existing user-agent regex is kept as a fallback for browsers without pointer media-query support.

The decision logic is extracted into a pure detectVirtualKeyboard() helper that takes the device signals as input, so it can be unit-tested without browser globals. isVirtualKeyboard() remains the thin browser wrapper and its public signature is unchanged.

Testing

  • Added src/lib/utils/isVirtualKeyboard.spec.ts covering phone (coarse pointer), touch-screen laptop (fine pointer + desktop UA), plain desktop, and the user-agent fallback path.
  • npm run test (server workspace) passes.
  • npm run lint and npm run check pass with no new errors.

isVirtualKeyboard() returned true whenever "ontouchstart" was present on
window, which is the case for touch-screen laptops too. Those devices were
incorrectly given the mobile UI behaviour, breaking Enter-to-send and the
related focus handling in ChatInput/ChatWindow.

Detect on-screen-keyboard devices via the coarse primary pointer media
query ((pointer: coarse)) instead. Phones and tablets report a coarse
primary pointer, while touch laptops keep a fine primary pointer
(mouse/trackpad) and are therefore no longer misclassified. The user agent
check is retained as a fallback for browsers without pointer media queries.

The decision logic is extracted into a pure detectVirtualKeyboard() helper
so it can be unit-tested without browser globals.

Closes huggingface#1767
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.

Incorrect mobile device detection - touch screen laptops trigger mobile UI behavior

1 participant