PR Feedback: Ensure shortcuts work on MacOS

src/common/os.ts

@@ -0,0 +1,33 @@
+/********************************************************************************
+ * Copyright (C) 2017 TypeFox and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+// from https://github.com/eclipse-theia/theia/blob/266fa0b2a9cf2649ed9b34c8b71b786806e787b4/packages/core/src/common/os.ts#L4
+
+function is(userAgent: string, platform: string): boolean {
+    if (typeof navigator !== 'undefined') {
+        if (navigator.userAgent && navigator.userAgent.indexOf(userAgent) >= 0) {
+            return true;
+        }
+    }
+    if (typeof process !== 'undefined') {
+        return (process.platform === platform);
+    }
+    return false;
+}
+
+export const isWindows = is('Windows', 'win32');
+export const isOSX = is('Mac', 'darwin');
+export const isLinux = !isWindows && !isOSX;

src/webview/columns/data-column.tsx

@@ -26,7 +26,7 @@ import type { MemoryRowData, MemorySizeOptions, MemoryTableSelection, MemoryTabl
 import { decorationService } from '../decorations/decoration-service';
 import { Disposable, FullNodeAttributes } from '../utils/view-types';
 import { createGroupVscodeContext } from '../utils/vscode-contexts';
-import { characterWidthInContainer, elementInnerWidth } from '../utils/window';
+import { characterWidthInContainer, elementInnerWidth, hasCtrlCmdMask } from '../utils/window';
 import { messenger } from '../view-messenger';
 import { AddressColumn } from './address-column';
 import { ColumnContribution, ColumnRenderProps } from './column-contribution-service';
@@ -262,7 +262,7 @@ export class EditableDataColumnRow extends React.Component<EditableDataColumnRow
                 break;
             }
             case 'v': {
-                if (event.ctrlKey) {
+                if (hasCtrlCmdMask(event)) {
                     // paste clipboard text and submit as change
                     const range = getAddressRange(event.currentTarget);
                     if (range) {

src/webview/columns/table-group.tsx

@@ -17,6 +17,7 @@
 
 import { DOMAttributes, HTMLAttributes } from 'react';
 import { MemoryRowData, MemoryTableSelection } from '../components/memory-table';
+import { hasCtrlCmdMask } from '../utils/window';
 
 export interface GroupPosition {
     columnIndex: number;
@@ -117,13 +118,13 @@ export function handleGroupNavigation<T extends HTMLElement>(event: React.Keyboa
             targetGroup = getGroupInPreviousRow(currentGroup);
             break;
         case 'c': {
-            if (event.ctrlKey) {
+            if (hasCtrlCmdMask(event)) {
                 handleCopy(event);
             }
             break;
         }
         case 'x': {
-            if (event.ctrlKey) {
+            if (hasCtrlCmdMask(event)) {
                 handleCut(event);
             }
             break;
@@ -237,7 +238,7 @@ export function toggleSelection<T extends HTMLElement>(event: React.MouseEvent<T
     const currentSelection = props.getSelection();
     if (isGroupSelected(position, currentSelection)) {
         // group is already selected
-        if (event.ctrlKey) {
+        if (hasCtrlCmdMask(event)) {
             // deselect
             props.setSelection();
         }

src/webview/utils/window.ts

@@ -14,6 +14,8 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
+import { isOSX } from '../../common/os';
+
 /**
  * Calculates the width of the element without any padding / margin / border
  */
@@ -42,3 +44,30 @@ export function characterWidthInContainer(container: HTMLElement, text: string):
 
     return width;
 }
+
+/**
+ * Bare minimum common interface of the keyboard and the mouse event with respect to the key maskings.
+ * Taken from https://github.com/eclipse-theia/theia/blob/266fa0b2a9cf2649ed9b34c8b71b786806e787b4/packages/core/src/browser/tree/tree-widget.tsx#L141
+ */
+export interface ModifierAwareEvent {
+    /**
+     * Determines if the modifier aware event has the `meta` key masking.
+     */
+    readonly metaKey: boolean;
+    /**
+     * Determines if the modifier aware event has the `ctrl` key masking.
+     */
+    readonly ctrlKey: boolean;
+    /**
+     * Determines if the modifier aware event has the `shift` key masking.
+     */
+    readonly shiftKey: boolean;
+}
+
+/**
+ * Determine if the tree modifier aware event has a `ctrlcmd` mask.
+ * Taken from https://github.com/eclipse-theia/theia/blob/266fa0b2a9cf2649ed9b34c8b71b786806e787b4/packages/core/src/browser/tree/tree-widget.tsx#L1399
+ */
+export function hasCtrlCmdMask(event: ModifierAwareEvent): boolean {
+    return isOSX ? event.metaKey : event.ctrlKey;
+}