mirror of
https://github.com/QwenLM/qwen-code.git
synced 2026-07-31 03:44:33 +00:00
* fix(web-shell): render a plain textarea composer on touch devices Mobile browsers could not type into the Web Shell composer (#5958): CodeMirror's contenteditable interacts poorly with virtual keyboards, and three non-gesture view.focus() calls claim activeElement on iOS without opening the keyboard, after which taps may never refocus the editor. On touch devices ('(hover: none) and (pointer: coarse)' plus maxTouchPoints > 0 — touch laptops keep the desktop editor) useComposerCore now skips creating an EditorView entirely and exposes a mobileComposer backend that ChatEditor renders as a controlled <textarea> at the same mount point. The internal submit pipeline was hoisted out of the editor-creation effect and accepts view: EditorView | null, so history, prompt building, tags, images, and slash/! text interpretation are shared unchanged between both backends. Enter inserts a newline natively; submission goes through the Send button. Programmatic (non-gesture) focus is additionally suppressed on coarse-pointer devices even when CodeMirror is forced, and ?composer=textarea|codemirror serves as a debugging and rollback escape hatch. The choice is frozen at mount so a mid-session flip cannot drop the draft. Known textarea-backend degradations (commands still work as typed text): no slash/@ completion menus, no inline tag chips (fall back to the top placement), no history arrow navigation, no large-paste placeholders, and no followup Tab-accept. Fixes #5958 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(web-shell): address review — textarea auto-grow, change notifications, caret restore Address the five inline review suggestions on #7587: - Auto-grow the mobile textarea with its content, capped by the computed CSS max-height (so --chat-editor-input-max-height overrides stay authoritative). Previously rows={1} plus resize:none meant multi-line drafts scrolled inside ~1.5 visible lines and the CSS max-height was dead. Asserted in the mobile e2e spec via bounding-box growth. - Fire onInputTextChange from setMobileText, matching the CodeMirror updateListener contract: programmatic draft changes (setText, history restore, post-submit clear) now notify parent trackers too. handleMobileChange delegates to setMobileText. - Restore the caret after mobile insertText: a controlled textarea resets the caret to the end on value change; setSelectionRange puts it back after React re-renders (rAF with a setTimeout fallback), matching the CodeMirror path's explicit selection anchor. - Cover the mobile submitSearchMatch path: select a history match, submit through the shared pipeline, draft cleared. - Cover the ChatEditor mobile quick-action gating: the history quick action opens the search UI (never dispatches into a missing EditorView) and the keyboard shortcut hints grid is hidden on the mobile composer with a desktop control. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(web-shell): decide the touch composer by media query alone Independent macOS verification on #7587 found that Playwright's stock WebKit iPhone profiles match '(hover: none) and (pointer: coarse)' but report navigator.maxTouchPoints === 0, so the automatic detection selected CodeMirror under unmodified WebKit emulation. The maxTouchPoints requirement added nothing the AND media query does not already provide: touch laptops are excluded by the query itself (their primary pointer hovers and is fine), and the only devices that match the query with zero touch points are emulated profiles and TV-style browsers, where the plain textarea is a safe fallback. Dropping it makes stock iPhone/WebKit Playwright runs exercise the automatic detection branch. Real-device behavior is unchanged: phones and tablets match the query and report touch points either way. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(web-shell): keep the mobile textarea scrollable past its height cap As .editorArea's last child the textarea inherited `overflow: clip` from the `.editorArea > :last-child` wrapper rule (written for the CodeMirror container, whose inner .cm-scroller does the scrolling). `clip` also forbids programmatic scrolling, so once auto-grow reached the CSS max-height, content beyond the cap was unreachable — scrollTop stayed pinned at 0. Override with `overflow-y: auto` via `.editorArea > textarea.mobileTextarea` (the extra type selector outweighs the wrapper rule's specificity). New mobile e2e regression fills 20 lines, asserts growth stops at the computed 300px cap, and verifies the overflow stays reachable: scrollHeight above clientHeight and scrollTop actually moving to the bottom — the exact probe from the review, which pinned at 0 before this fix. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> --------- Co-authored-by: ComplexSimply <rudy.arrowsong@gmail.com> Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
import { defineConfig, devices } from '@playwright/test';
|
|
|
|
const port = Number(process.env['PLAYWRIGHT_PORT'] ?? 5174);
|
|
const baseURL =
|
|
process.env['PLAYWRIGHT_BASE_URL'] ?? `http://127.0.0.1:${port}`;
|
|
|
|
export default defineConfig({
|
|
testDir: './client/e2e',
|
|
// The visuals suite (screenshot/video capture) runs under its own
|
|
// playwright.visuals.config.ts; keep it out of the smoke/e2e runs.
|
|
testIgnore: '**/visuals/**',
|
|
outputDir: './client/e2e/test-results',
|
|
timeout: 60_000,
|
|
expect: {
|
|
timeout: 10_000,
|
|
},
|
|
forbidOnly: !!process.env['CI'],
|
|
retries: process.env['CI'] ? 2 : 0,
|
|
reporter: [
|
|
['line'],
|
|
['html', { outputFolder: 'client/e2e/playwright-report', open: 'never' }],
|
|
],
|
|
webServer: {
|
|
command: `npm run dev -- --host 127.0.0.1 --port ${port}`,
|
|
url: baseURL,
|
|
reuseExistingServer: !process.env['CI'],
|
|
timeout: 120_000,
|
|
},
|
|
use: {
|
|
baseURL,
|
|
trace: 'on-first-retry',
|
|
screenshot: 'only-on-failure',
|
|
video: 'retain-on-failure',
|
|
},
|
|
projects: [
|
|
{
|
|
name: 'chromium',
|
|
use: { ...devices['Desktop Chrome'] },
|
|
testIgnore: ['**/visuals/**', '**/*.mobile.spec.ts'],
|
|
},
|
|
{
|
|
// Touch-device emulation for the mobile composer backend (#5958):
|
|
// coarse pointer + no hover + touch points, which flips the composer
|
|
// to the plain-textarea path.
|
|
name: 'mobile-chromium',
|
|
use: { ...devices['Pixel 7'] },
|
|
testMatch: '**/*.mobile.spec.ts',
|
|
},
|
|
],
|
|
});
|