Skip to content

Commit

Permalink
feat(puppeteer-core): keydown supports commands (#9357)
Browse files Browse the repository at this point in the history 
Issue: #1313

<!-- Thanks for submitting a pull request! Please provide enough
information so that others can review your pull request. -->

**What kind of change does this PR introduce?**

Feature.

**Did you add tests for your changes?**

Yes.

**If relevant, did you update the documentation?**

Yes.

**Summary**

Supports keyboard shotcuts on MacOS. See Chrome Devtools Protocol
document:
https://chromedevtools.github.io/devtools-protocol/tot/Input/#method-dispatchKeyEvent.
  • Loading branch information
@Junyan
Junyan committed Dec 3, 2022
1 parent 3cdd5d8 commit b7ebc5d
Show file tree
Hide file tree
Showing 5 changed files with 58 additions and 12 deletions.
9 changes: 5 additions & 4 deletions docs/api/puppeteer.keyboard.down.md
View file
Expand Up @@ -14,17 +14,18 @@ class Keyboard {
key: KeyInput,
options?: {
text?: string;
commands?: string[];
}
): Promise<void>;
}
```

## Parameters

| Parameter | Type | Description |
| --------- | ----------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
| key | [KeyInput](./puppeteer.keyinput.md) | Name of key to press, such as <code>ArrowLeft</code>. See [KeyInput](./puppeteer.keyinput.md) for a list of all key names. |
| options | { text?: string; } | <i>(Optional)</i> An object of options. Accepts text which, if specified, generates an input event with this text. |
| Parameter | Type | Description |
| --------- | ----------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| key | [KeyInput](./puppeteer.keyinput.md) | Name of key to press, such as <code>ArrowLeft</code>. See [KeyInput](./puppeteer.keyinput.md) for a list of all key names. |
| options | { text?: string; commands?: string\[\]; } | <i>(Optional)</i> An object of options. Accepts text which, if specified, generates an input event with this text. Accepts commands which, if specified, is the commands of keyboard shortcuts, see [Chromium Source Code](https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/editing/commands/editor_command_names.h) for valid command names. |

**Returns:**

Expand Down
9 changes: 5 additions & 4 deletions docs/api/puppeteer.keyboard.press.md
View file
Expand Up @@ -15,17 +15,18 @@ class Keyboard {
options?: {
delay?: number;
text?: string;
commands?: string[];
}
): Promise<void>;
}
```

## Parameters

| Parameter | Type | Description |
| --------- | ----------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| key | [KeyInput](./puppeteer.keyinput.md) | Name of key to press, such as <code>ArrowLeft</code>. See [KeyInput](./puppeteer.keyinput.md) for a list of all key names. |
| options | { delay?: number; text?: string; } | <i>(Optional)</i> An object of options. Accepts text which, if specified, generates an input event with this text. Accepts delay which, if specified, is the time to wait between <code>keydown</code> and <code>keyup</code> in milliseconds. Defaults to 0. |
| Parameter | Type | Description |
| --------- | --------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| key | [KeyInput](./puppeteer.keyinput.md) | Name of key to press, such as <code>ArrowLeft</code>. See [KeyInput](./puppeteer.keyinput.md) for a list of all key names. |
| options | { delay?: number; text?: string; commands?: string\[\]; } | <i>(Optional)</i> An object of options. Accepts text which, if specified, generates an input event with this text. Accepts delay which, if specified, is the time to wait between <code>keydown</code> and <code>keyup</code> in milliseconds. Defaults to 0. Accepts commands which, if specified, is the commands of keyboard shortcuts, see [Chromium Source Code](https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/editing/commands/editor_command_names.h) for valid command names. |

**Returns:**

Expand Down
16 changes: 12 additions & 4 deletions packages/puppeteer-core/src/common/Input.ts
View file
Expand Up @@ -104,11 +104,16 @@ export class Keyboard {
* See {@link KeyInput} for a list of all key names.
*
* @param options - An object of options. Accepts text which, if specified,
* generates an input event with this text.
* generates an input event with this text. Accepts commands which, if specified,
* is the commands of keyboard shortcuts,
* see {@link https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/editing/commands/editor_command_names.h | Chromium Source Code} for valid command names.
*/
async down(
key: KeyInput,
options: {text?: string} = {text: undefined}
options: {text?: string; commands?: string[]} = {
text: undefined,
commands: [],
}
): Promise<void> {
const description = this.#keyDescriptionForString(key);

Expand All @@ -128,6 +133,7 @@ export class Keyboard {
autoRepeat,
location: description.location,
isKeypad: description.location === 3,
commands: options.commands,
});
}

Expand Down Expand Up @@ -304,11 +310,13 @@ export class Keyboard {
* @param options - An object of options. Accepts text which, if specified,
* generates an input event with this text. Accepts delay which,
* if specified, is the time to wait between `keydown` and `keyup` in milliseconds.
* Defaults to 0.
* Defaults to 0. Accepts commands which, if specified,
* is the commands of keyboard shortcuts,
* see {@link https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/editing/commands/editor_command_names.h | Chromium Source Code} for valid command names.
*/
async press(
key: KeyInput,
options: {delay?: number; text?: string} = {}
options: {delay?: number; text?: string; commands?: string[]} = {}
): Promise<void> {
const {delay = null} = options;
await this.down(key, options);
Expand Down
6 changes: 6 additions & 0 deletions test/TestExpectations.json
View file
Expand Up @@ -569,6 +569,12 @@
"parameters": ["firefox"],
"expectations": ["SKIP"]
},
{
"testIdPattern": "[keyboard.spec] Keyboard should trigger commands of keyboard shortcuts",
"platforms": ["darwin", "linux", "win32"],
"parameters": ["firefox"],
"expectations": ["SKIP"]
},
{
"testIdPattern": "[keyboard.spec] Keyboard should report shiftKey",
"platforms": ["darwin", "linux", "win32"],
Expand Down
30 changes: 30 additions & 0 deletions test/src/keyboard.spec.ts
View file
Expand Up @@ -90,6 +90,36 @@ describe('Keyboard', function () {
})
).toBe('Hello World!');
});
// @see https://github.com/puppeteer/puppeteer/issues/1313
it('should trigger commands of keyboard shortcuts', async () => {
const {page, server} = getTestState();
const cmdKey = os.platform() !== 'darwin' ? 'Meta' : 'Control';

await page.goto(server.PREFIX + '/input/textarea.html');
await page.type('textarea', 'hello');

await page.keyboard.down(cmdKey);
await page.keyboard.press('a', {commands: ['SelectAll']});
await page.keyboard.up(cmdKey);

await page.keyboard.down(cmdKey);
await page.keyboard.down('c', {commands: ['Copy']});
await page.keyboard.up('c');
await page.keyboard.up(cmdKey);

await page.keyboard.down(cmdKey);
await page.keyboard.press('v', {commands: ['Paste']});
await page.keyboard.up(cmdKey);
await page.keyboard.down(cmdKey);
await page.keyboard.press('v', {commands: ['Paste']});
await page.keyboard.up(cmdKey);

expect(
await page.evaluate(() => {
return document.querySelector('textarea')!.value;
})
).toBe('hellohello');
});
it('should send a character with ElementHandle.press', async () => {
const {page, server} = getTestState();

Expand Down

0 comments on commit b7ebc5d

Please sign in to comment.