fix(chromium): select all on macos should work again (#3006)

* fix(chromium): select all on macos should work again

* Update src/chromium/crInput.ts

Co-authored-by: Joel Einbinder <joel.einbinde@gmail.com>

src/chromium/crBrowser.ts

@@ -40,6 +40,7 @@ export class CRBrowser extends BrowserBase {
   _backgroundPages = new Map<string, CRPage>();
   _serviceWorkers = new Map<string, CRServiceWorker>();
   _devtools?: CRDevTools;
+  _isMac = false;
 
   private _tracingRecording = false;
   private _tracingPath: string | null = '';
@@ -50,6 +51,8 @@ export class CRBrowser extends BrowserBase {
     const browser = new CRBrowser(connection, options);
     browser._devtools = devtools;
     const session = connection.rootSession;
+    const version = await session.send('Browser.getVersion');
+    browser._isMac = version.userAgent.includes('Macintosh');
     if (!options.persistent) {
       await session.send('Target.setAutoAttach', { autoAttach: true, waitForDebuggerOnStart: true, flatten: true });
       return browser;

src/chromium/crInput.ts

@@ -18,6 +18,8 @@
 import * as input from '../input';
 import * as types from '../types';
 import { CRSession } from './crConnection';
+import { macEditingCommands } from '../macEditingCommands';
+import { helper } from '../helper';
 
 function toModifiersMask(modifiers: Set<types.KeyboardModifier>): number {
   let mask = 0;
@@ -33,18 +35,36 @@ function toModifiersMask(modifiers: Set<types.KeyboardModifier>): number {
 }
 
 export class RawKeyboardImpl implements input.RawKeyboard {
-  private _client: CRSession;
+  constructor(
+    private _client: CRSession,
+    private _isMac: boolean,
+  ) { }
 
-  constructor(client: CRSession) {
+  _commandsForCode(code: string, modifiers: Set<types.KeyboardModifier>) {
-    this._client = client;
+    if (!this._isMac)
+      return [];
+    const parts = [];
+    for (const modifier of (['Shift', 'Control', 'Alt', 'Meta']) as types.KeyboardModifier[]) {
+      if (modifiers.has(modifier))
+        parts.push(modifier);
+    }
+    parts.push(code);
+    const shortcut = parts.join('+');
+    let commands = macEditingCommands[shortcut] || [];
+    if (helper.isString(commands))
+      commands = [commands];
+    // remove the trailing : to match the Chromium command names.
+    return commands.map(c => c.substring(0, c.length - 1));
   }
 
   async keydown(modifiers: Set<types.KeyboardModifier>, code: string, keyCode: number, keyCodeWithoutLocation: number, key: string, location: number, autoRepeat: boolean, text: string | undefined): Promise<void> {
+    const commands = this._commandsForCode(code, modifiers);
     await this._client.send('Input.dispatchKeyEvent', {
       type: text ? 'keyDown' : 'rawKeyDown',
       modifiers: toModifiersMask(modifiers),
       windowsVirtualKeyCode: keyCodeWithoutLocation,
       code,
+      commands,
       key,
       text,
       unmodifiedText: text,

src/chromium/crPage.ts

@@ -65,7 +65,7 @@ export class CRPage implements PageDelegate {
   constructor(client: CRSession, targetId: string, browserContext: CRBrowserContext, opener: CRPage | null, hasUIWindow: boolean) {
     this._targetId = targetId;
     this._opener = opener;
-    this.rawKeyboard = new RawKeyboardImpl(client);
+    this.rawKeyboard = new RawKeyboardImpl(client, browserContext._browser._isMac);
     this.rawMouse = new RawMouseImpl(client);
     this._pdf = new CRPDF(client);
     this._coverage = new CRCoverage(client);

test/keyboard.jest.js

@@ -290,7 +290,7 @@ describe('Keyboard', function() {
     await textarea.type('👹 Tokyo street Japan 🇯🇵');
     expect(await frame.$eval('textarea', textarea => textarea.value)).toBe('👹 Tokyo street Japan 🇯🇵');
   });
-  it.skip(CHROMIUM && MAC)('should handle selectAll', async ({page, server}) => {
+  it('should handle selectAll', async ({page, server}) => {
     await page.goto(server.PREFIX + '/input/textarea.html');
     const textarea = await page.$('textarea');
     await textarea.type('some text');
@@ -318,6 +318,15 @@ describe('Keyboard', function() {
     await page.keyboard.press('Backspace');
     expect(await page.$eval('textarea', textarea => textarea.value)).toBe('some tex');
   });
+  it.skip(!MAC)('should support MacOS shortcuts', async ({page, server}) => {
+    await page.goto(server.PREFIX + '/input/textarea.html');
+    const textarea = await page.$('textarea');
+    await textarea.type('some text');
+    // select one word backwards
+    await page.keyboard.press('Shift+Control+Alt+KeyB');
+    await page.keyboard.press('Backspace');
+    expect(await page.$eval('textarea', textarea => textarea.value)).toBe('some ');
+  });
   it('should press the meta key', async ({page}) => {
     const lastEvent = await captureLastKeydown(page);
     await page.keyboard.press('Meta');