From 925de8da2b599f061889d808ba73ff535b39a9f4 Mon Sep 17 00:00:00 2001 From: YA2KM <106018566+YA2KM@users.noreply.github.com> Date: Wed, 10 Aug 2022 08:02:42 +0900 Subject: [PATCH] fix(codegen): make sure input recording with japanese IME Work (#16210) Co-authored-by: kawasaki.taiga Co-authored-by: Max Schmitt --- .../src/server/injected/recorder.ts | 2 +- tests/library/inspector/cli-codegen-1.spec.ts | 44 +++++++++++++++++++ 2 files changed, 45 insertions(+), 1 deletion(-) diff --git a/packages/playwright-core/src/server/injected/recorder.ts b/packages/playwright-core/src/server/injected/recorder.ts index 095f8d9b8d..849b8425dc 100644 --- a/packages/playwright-core/src/server/injected/recorder.ts +++ b/packages/playwright-core/src/server/injected/recorder.ts @@ -326,7 +326,7 @@ class Recorder { if (event.key === 'Insert' && event.shiftKey) return false; } - if (['Shift', 'Control', 'Meta', 'Alt'].includes(event.key)) + if (['Shift', 'Control', 'Meta', 'Alt', 'Process'].includes(event.key)) return false; const hasModifier = event.ctrlKey || event.altKey || event.metaKey; if (event.key.length === 1 && !hasModifier) diff --git a/tests/library/inspector/cli-codegen-1.spec.ts b/tests/library/inspector/cli-codegen-1.spec.ts index 78b6ad4096..7610271684 100644 --- a/tests/library/inspector/cli-codegen-1.spec.ts +++ b/tests/library/inspector/cli-codegen-1.spec.ts @@ -260,6 +260,50 @@ test.describe('cli codegen', () => { expect(message.text()).toBe('John'); }); + test('should fill japanese text', async ({ page, openRecorder }) => { + const recorder = await openRecorder(); + + // In Japanese, "てすと" or "テスト" means "test". + await recorder.setContentAndWait(``); + const selector = await recorder.focusElement('input'); + expect(selector).toBe('input[name="name"]'); + + async function inputText(text: string) { + await recorder.page.dispatchEvent(selector, 'keydown', { key: 'Process' }); + await recorder.page.keyboard.insertText(text); + await recorder.page.dispatchEvent(selector, 'keyup', { key: 'Process' }); + } + const [message, sources] = await Promise.all([ + page.waitForEvent('console', msg => msg.type() !== 'error'), + recorder.waitForOutput('JavaScript', 'fill'), + (async () => { + await inputText('て'); + await inputText('す'); + await inputText('と'); + })() + ]); + expect(sources.get('JavaScript').text).toContain(` + // Fill input[name="name"] + await page.locator('input[name="name"]').fill('てすと');`); + expect(sources.get('Java').text).toContain(` + // Fill input[name="name"] + page.locator("input[name=\\\"name\\\"]").fill("てすと");`); + + expect(sources.get('Python').text).toContain(` + # Fill input[name="name"] + page.locator(\"input[name=\\\"name\\\"]\").fill(\"てすと\")`); + + expect(sources.get('Python Async').text).toContain(` + # Fill input[name="name"] + await page.locator(\"input[name=\\\"name\\\"]\").fill(\"てすと\")`); + + expect(sources.get('C#').text).toContain(` + // Fill input[name="name"] + await page.Locator(\"input[name=\\\"name\\\"]\").FillAsync(\"てすと\");`); + + expect(message.text()).toBe('てすと'); + }); + test('should fill textarea', async ({ page, openRecorder }) => { const recorder = await openRecorder();