util: drop preventBrowserNativeContextMenu

This is done once at the top-level app, so is no longer needed.

src/editor/Editor.tsx

@@ -34,7 +34,7 @@ import { compile } from '../mpy/actions';
 import { useSelector } from '../reducers';
 import { useSettingIsShowDocsEnabled } from '../settings/hooks';
 import { isMacOS } from '../utils/os';
-import { preventBrowserNativeContextMenu, useUniqueId } from '../utils/react';
+import { useUniqueId } from '../utils/react';
 import { editorActivateFile, editorCloseFile } from './actions';
 import { I18nId } from './i18n';
 import * as pybricksMicroPython from './pybricksMicroPython';
@@ -430,7 +430,7 @@ const Editor: React.VFC = () => {
     );
 
     return (
-        <div className="pb-editor" onContextMenu={preventBrowserNativeContextMenu}>
+        <div className="pb-editor">
             <EditorTabs onChange={() => editor?.focus()} i18n={i18n} />
             <ResizeSensor2 onResize={() => editor?.layout()}>
                 <ContextMenu2

src/explorer/Explorer.tsx

@@ -26,7 +26,6 @@ import {
 import { useDispatch } from 'react-redux';
 import { useSelector } from '../reducers';
 import { isMacOS } from '../utils/os';
-import { preventBrowserNativeContextMenu } from '../utils/react';
 import { TreeItemContext, TreeItemData, renderers } from '../utils/tree-renderer';
 import {
     explorerActivateFile,
@@ -378,7 +377,7 @@ const Explorer: React.VFC = () => {
     const [i18n] = useI18n();
 
     return (
-        <div className="h-100" onContextMenu={preventBrowserNativeContextMenu}>
+        <div className="h-100">
             <Header i18n={i18n} />
             <Divider />
             <FileTree i18n={i18n} />

src/status-bar/StatusBar.test.tsx

@@ -1,21 +1,13 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) 2021-2022 The Pybricks Authors
 
-import { fireEvent, waitFor } from '@testing-library/react';
+import { waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import React from 'react';
 import { testRender } from '../../test';
 import { BleConnectionState } from '../ble/reducers';
 import StatusBar from './StatusBar';
 
-it('should prevent browser context menu', () => {
-    const [statusBar] = testRender(<StatusBar />, {
-        ble: { connection: BleConnectionState.Disconnected, deviceName: '' },
-    });
-
-    expect(fireEvent.contextMenu(statusBar.getByRole('status'))).toBe(false);
-});
-
 it('should show popover when hub name is clicked', async () => {
     const testHubName = 'Test hub';
 

src/status-bar/StatusBar.tsx

@@ -7,7 +7,6 @@ import { I18n, useI18n } from '@shopify/react-i18n';
 import React from 'react';
 import { BleConnectionState } from '../ble/reducers';
 import { useSelector } from '../reducers';
-import { preventBrowserNativeContextMenu } from '../utils/react';
 import { I18nId } from './i18n';
 
 import './status-bar.scss';
@@ -113,12 +112,7 @@ const StatusBar: React.VFC = (_props) => {
     const connection = useSelector((s) => s.ble.connection);
 
     return (
-        <div
-            className="pb-status-bar"
-            role="status"
-            aria-live="off"
-            onContextMenu={preventBrowserNativeContextMenu}
-        >
+        <div className="pb-status-bar" role="status" aria-live="off">
             {connection === BleConnectionState.Connected && (
                 <>
                     <HubInfoButton i18n={i18n} />

src/toolbar/Toolbar.tsx

@@ -3,7 +3,6 @@
 
 import { ButtonGroup } from '@blueprintjs/core';
 import React from 'react';
-import { preventBrowserNativeContextMenu } from '../utils/react';
 import BluetoothButton from './buttons/bluetooth/BluetoothButton';
 import FlashButton from './buttons/flash/FlashButton';
 import ReplButton from './buttons/repl/ReplButton';
@@ -14,11 +13,7 @@ import './toolbar.scss';
 
 const Toolbar: React.VFC = (_props) => {
     return (
-        <div
-            role="toolbar"
-            onContextMenu={preventBrowserNativeContextMenu}
-            className="pb-toolbar"
-        >
+        <div role="toolbar" className="pb-toolbar">
             <ButtonGroup className="pb-toolbar-group pb-align-left">
                 <FlashButton />
                 <BluetoothButton />

src/utils/react.ts

@@ -3,13 +3,6 @@
 import React, { useState } from 'react';
 import { createCountFunc } from './iter';
 
-/**
- * Callback that can be passed to onContextMenu event handlers to prevent
- * the native browser context menu from being shown.
- */
-export const preventBrowserNativeContextMenu: React.MouseEventHandler = (e) =>
-    e.preventDefault();
-
 /** Style to disable pointer events. */
 export const pointerEventsNone: React.CSSProperties = { pointerEvents: 'none' };