drop use of decorator for editor context menu

src/editor/Editor.test.tsx

@@ -0,0 +1,94 @@
+// SPDX-License-Identifier: MIT
+// Copyright (c) 2021 The Pybricks Authors
+
+import { I18nContext, I18nManager } from '@shopify/react-i18n';
+import {
+    fireEvent,
+    render,
+    screen,
+    waitForElementToBeRemoved,
+} from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import React from 'react';
+import { Provider } from 'react-redux';
+import { Store } from 'redux';
+import Editor from './Editor';
+
+function getTextArea(): HTMLTextAreaElement {
+    // the textarea in ace editor doesn't actually have any contents, but
+    // it gets the focus for input.
+    return screen.getByDisplayValue('') as HTMLTextAreaElement;
+}
+
+it('should focus the text area', () => {
+    const store = ({
+        getState: jest.fn(() => ({ settings: { darkMode: false, showDocs: false } })),
+        dispatch: jest.fn(),
+        subscribe: jest.fn(),
+    } as unknown) as Store;
+    const i18n = new I18nManager({ locale: 'en' });
+    render(
+        <Provider store={store}>
+            <I18nContext.Provider value={i18n}>
+                <Editor />
+            </I18nContext.Provider>
+        </Provider>,
+    );
+
+    expect(getTextArea()).toHaveFocus();
+});
+
+describe('context menu', () => {
+    it('should show the context menu', () => {
+        const store = ({
+            getState: jest.fn(() => ({
+                settings: { darkMode: false, showDocs: false },
+            })),
+            dispatch: jest.fn(),
+            subscribe: jest.fn(),
+        } as unknown) as Store;
+        const i18n = new I18nManager({ locale: 'en' });
+
+        render(
+            <Provider store={store}>
+                <I18nContext.Provider value={i18n}>
+                    <Editor />
+                </I18nContext.Provider>
+            </Provider>,
+        );
+
+        fireEvent.contextMenu(screen.getByText('Write your program here...'));
+
+        expect(screen.getByText('Copy')).toBeInTheDocument();
+    });
+
+    it('should hide the context menu when Escape is pressed', async () => {
+        const store = ({
+            getState: jest.fn(() => ({
+                settings: { darkMode: false, showDocs: false },
+            })),
+            dispatch: jest.fn(),
+            subscribe: jest.fn(),
+        } as unknown) as Store;
+        const i18n = new I18nManager({ locale: 'en' });
+
+        render(
+            <Provider store={store}>
+                <I18nContext.Provider value={i18n}>
+                    <Editor />
+                </I18nContext.Provider>
+            </Provider>,
+        );
+
+        fireEvent.contextMenu(screen.getByText('Write your program here...'));
+
+        expect(screen.getByText('Copy')).toBeInTheDocument();
+
+        userEvent.type(document.activeElement || document.body, '{esc}');
+
+        await waitForElementToBeRemoved(() => screen.queryByText('Copy'));
+
+        // editor should be focused after context menu closes
+        expect(document.activeElement).toBe(getTextArea());
+    });
+});