Michel2/pybricks-code
1
0
Fork 0
mirror of https://github.com/pybricks/pybricks-code.git synced 2026-09-15 02:54:07 +00:00
Code Issues Releases Activity

fix breaking changes for user-event v14

Browse Source
This commit is contained in:
David Lechner
2022-06-02 18:45:28 -05:00
committed by David Lechner
parent 4299b36e6c
commit 883807b4b4
21 changed files with 289 additions and 280 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/explorer/Explorer.test.tsx
+32 -33
View File
@@ -2,7 +2,6 @@
// Copyright (c) 2022 The Pybricks Authors
import { cleanup } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import React from 'react';
import { testRender, uuid } from '../../test';
import { FileMetadata } from '../fileStorage';
@@ -33,36 +32,36 @@ const testFile: FileMetadata = {
};
describe('archive button', () => {
it('should dispatch action when clicked', () => {
it('should dispatch action when clicked', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const button = explorer.getByTitle('Backup all files');
expect(button).toBeEnabled();
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(explorerArchiveAllFiles());
});
});
describe('import file button', () => {
it('should dispatch action when clicked', async () => {
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const button = explorer.getByTitle('Import a file');
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(explorerImportFiles());
});
});
describe('new file button', () => {
it('should dispatch action when clicked', async () => {
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const button = explorer.getByTitle('Create a new file');
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(explorerCreateNewFile());
});
});
@@ -70,11 +69,11 @@ describe('new file button', () => {
describe('tree item', () => {
it('should dispatch action when clicked', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const treeItem = explorer.getByRole('treeitem', { name: 'test.file' });
userEvent.click(treeItem);
await user.click(treeItem);
expect(dispatch).toHaveBeenCalledWith(
explorerUserActivateFile('test.file', uuid(0)),
@@ -83,12 +82,12 @@ describe('tree item', () => {
it('should dispatch action when key is pressed', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const treeItem = explorer.getByRole('treeitem', { name: 'test.file' });
userEvent.click(treeItem);
userEvent.keyboard('{enter}');
await user.click(treeItem);
await user.keyboard('{Enter}');
expect(dispatch).toHaveBeenCalledWith(
explorerUserActivateFile('test.file', uuid(0)),
@@ -98,13 +97,13 @@ describe('tree item', () => {
describe('duplicate', () => {
it('should dispatch action when button is clicked', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
// NB: this button is intentionally not accessible (by role) since
// there is a keyboard shortcut.
const button = explorer.getByTitle('Duplicate test.file');
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(explorerDuplicateFile('test.file'));
@@ -114,12 +113,12 @@ describe('tree item', () => {
it('should dispatch action when key is pressed', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const treeItem = explorer.getByRole('treeitem', { name: 'test.file' });
userEvent.click(treeItem);
userEvent.keyboard('{ctrl}d');
await user.click(treeItem);
await user.keyboard('{Control>}d{/Control}');
expect(dispatch).toHaveBeenCalledWith(explorerDuplicateFile('test.file'));
});
@@ -128,13 +127,13 @@ describe('tree item', () => {
describe('rename', () => {
it('should dispatch action when button is clicked', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
// NB: this button is intentionally not accessible (by role) since
// there is a keyboard shortcut.
const button = explorer.getByTitle('Rename test.file');
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(explorerRenameFile('test.file'));
@@ -144,12 +143,12 @@ describe('tree item', () => {
it('should dispatch action when key is pressed', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const treeItem = explorer.getByRole('treeitem', { name: 'test.file' });
userEvent.click(treeItem);
userEvent.keyboard('{f2}');
await user.click(treeItem);
await user.keyboard('{F2}');
expect(dispatch).toHaveBeenCalledWith(explorerRenameFile('test.file'));
});
@@ -158,13 +157,13 @@ describe('tree item', () => {
describe('export', () => {
it('should dispatch export action when button is clicked', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
// NB: this button is intentionally not accessible (by role) since
// there is a keyboard shortcut.
const button = explorer.getByTitle('Export test.file');
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(explorerExportFile('test.file'));
@@ -174,12 +173,12 @@ describe('tree item', () => {
it('should dispatch export action when key is pressed', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const treeItem = explorer.getByRole('treeitem', { name: 'test.file' });
userEvent.click(treeItem);
userEvent.keyboard('{ctrl}e');
await user.click(treeItem);
await user.keyboard('{Control>}e{/Control}');
expect(dispatch).toHaveBeenCalledWith(explorerExportFile('test.file'));
});
@@ -188,13 +187,13 @@ describe('tree item', () => {
describe('delete', () => {
it('should dispatch delete action when button is clicked', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
// NB: this button is intentionally not accessible (by role) since
// there is a keyboard shortcut.
const button = explorer.getByTitle('Delete test.file');
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(
explorerDeleteFile('test.file', uuid(0)),
@@ -206,12 +205,12 @@ describe('tree item', () => {
it('should dispatch delete action when key is pressed', async () => {
jest.mocked(useFileStorageMetadata).mockReturnValue([testFile]);
const [explorer, dispatch] = testRender(<Explorer />);
const [user, explorer, dispatch] = testRender(<Explorer />);
const treeItem = explorer.getByRole('treeitem', { name: 'test.file' });
userEvent.click(treeItem);
userEvent.keyboard('{del}');
await user.click(treeItem);
await user.keyboard('{Delete}');
expect(dispatch).toHaveBeenCalledWith(
explorerDeleteFile('test.file', uuid(0)),
src/explorer/alerts/FileInUseAlert.test.tsx
+1 -1
View File
@@ -12,7 +12,7 @@ it('should be valid', () => {
// TODO: refactor this to a common function to be used by all alerts
// it should render
const [message] = testRender(<>{toast.message}</>);
const [, message] = testRender(<>{toast.message}</>);
expect(message).toBeDefined();
// it should have a dismiss callback
src/explorer/deleteFileAlert/DeleteFileAlert.test.tsx
+18 -11
View File
@@ -1,8 +1,7 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2022 The Pybricks Authors
import { cleanup, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { cleanup, fireEvent, waitFor } from '@testing-library/react';
import React from 'react';
import { testRender } from '../../../test';
import DeleteFileAlert from './DeleteFileAlert';
@@ -14,48 +13,56 @@ afterEach(() => {
describe('accept', () => {
it('should dispatch accept action when delete button is clicked', async () => {
const [dialog, dispatch] = testRender(<DeleteFileAlert />, {
const [user, dialog, dispatch] = testRender(<DeleteFileAlert />, {
explorer: { deleteFileAlert: { fileName: 'test.file', isOpen: true } },
});
userEvent.click(dialog.getByRole('button', { name: 'Delete' }));
await user.click(dialog.getByRole('button', { name: 'Delete' }));
expect(dispatch).toHaveBeenCalledWith(deleteFileAlertDidAccept());
});
it('should dispatch accept action when enter is pressed ', async () => {
const [dialog, dispatch] = testRender(<DeleteFileAlert />, {
const [user, dialog, dispatch] = testRender(<DeleteFileAlert />, {
explorer: { deleteFileAlert: { fileName: 'test.file', isOpen: true } },
});
await waitFor(() =>
expect(dialog.getByRole('button', { name: 'Delete' })).toHaveFocus(),
);
userEvent.keyboard('{enter}');
await user.keyboard('{Enter}');
expect(dispatch).toHaveBeenCalledWith(deleteFileAlertDidAccept());
});
});
describe('cancel', () => {
it('should dispatch cancel when keep button is clicked', () => {
const [dialog, dispatch] = testRender(<DeleteFileAlert />, {
it('should dispatch cancel when keep button is clicked', async () => {
const [user, dialog, dispatch] = testRender(<DeleteFileAlert />, {
explorer: { deleteFileAlert: { fileName: 'test.file', isOpen: true } },
});
userEvent.click(dialog.getByRole('button', { name: 'Keep' }));
await user.click(dialog.getByRole('button', { name: 'Keep' }));
expect(dispatch).toHaveBeenCalledWith(deleteFileAlertDidCancel());
});
it('should dispatch cancel when escape button is pressed', async () => {
const [dialog, dispatch] = testRender(<DeleteFileAlert />, {
const [user, dialog, dispatch] = testRender(<DeleteFileAlert />, {
explorer: { deleteFileAlert: { fileName: 'test.file', isOpen: true } },
});
await waitFor(() =>
expect(dialog.getByRole('button', { name: 'Delete' })).toHaveFocus(),
);
userEvent.keyboard('{esc}');
// FIXME: use userEvent instead of fireEvent
// blocked by https://github.com/palantir/blueprint/pull/5349
// await user.keyboard('{Escape}');
user;
fireEvent.keyDown(document.activeElement ?? document, {
key: 'Escape',
keyCode: 27,
which: 27,
});
expect(dispatch).toHaveBeenCalledWith(deleteFileAlertDidCancel());
});
src/explorer/duplicateFileDialog/DuplicateFileDialog.test.tsx
+18 -12
View File
@@ -1,8 +1,7 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2022 The Pybricks Authors
import { waitFor } from '@testing-library/dom';
import userEvent from '@testing-library/user-event';
import { fireEvent, waitFor } from '@testing-library/dom';
import React from 'react';
import { testRender } from '../../../test';
import DuplicateFileDialog from './DuplicateFileDialog';
@@ -10,7 +9,7 @@ import { duplicateFileDialogDidAccept, duplicateFileDialogDidCancel } from './ac
describe('duplicate button', () => {
it('should accept the dialog Duplicate is clicked', async () => {
const [dialog, dispatch] = testRender(<DuplicateFileDialog />, {
const [user, dialog, dispatch] = testRender(<DuplicateFileDialog />, {
explorer: {
duplicateFileDialog: { isOpen: true, fileName: 'source.file' },
},
@@ -21,17 +20,17 @@ describe('duplicate button', () => {
// have to type a new file name before Duplicate button is enabled
const input = dialog.getByRole('textbox', { name: 'File name' });
await waitFor(() => expect(input).toHaveFocus());
userEvent.type(input, 'new');
await user.type(input, 'new', { skipClick: true });
await waitFor(() => expect(button).not.toBeDisabled());
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(
duplicateFileDialogDidAccept('source.file', 'new.file'),
);
});
it('should accept the dialog when enter is pressed in the text input', async () => {
const [dialog, dispatch] = testRender(<DuplicateFileDialog />, {
const [user, dialog, dispatch] = testRender(<DuplicateFileDialog />, {
explorer: {
duplicateFileDialog: { isOpen: true, fileName: 'source.file' },
},
@@ -40,7 +39,7 @@ describe('duplicate button', () => {
// have to type a new file name before Duplicate button is enabled
const input = dialog.getByRole('textbox', { name: 'File name' });
await waitFor(() => expect(input).toHaveFocus());
userEvent.type(input, 'new{enter}');
await user.type(input, 'new{Enter}', { skipClick: true });
expect(dispatch).toHaveBeenCalledWith(
duplicateFileDialogDidAccept('source.file', 'new.file'),
@@ -48,7 +47,7 @@ describe('duplicate button', () => {
});
it('should cancel when user clicks close button', async () => {
const [dialog, dispatch] = testRender(<DuplicateFileDialog />, {
const [user, dialog, dispatch] = testRender(<DuplicateFileDialog />, {
explorer: {
duplicateFileDialog: { isOpen: true, fileName: 'source.file' },
},
@@ -58,12 +57,12 @@ describe('duplicate button', () => {
await waitFor(() => expect(button).toBeVisible());
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(duplicateFileDialogDidCancel());
});
it('should cancel when user user presses esc key', async () => {
const [dialog, dispatch] = testRender(<DuplicateFileDialog />, {
const [user, dialog, dispatch] = testRender(<DuplicateFileDialog />, {
explorer: {
duplicateFileDialog: { isOpen: true, fileName: 'source.file' },
},
@@ -72,8 +71,15 @@ describe('duplicate button', () => {
await waitFor(() =>
expect(dialog.getByRole('textbox', { name: 'File name' })).toHaveFocus(),
);
userEvent.keyboard('{esc}');
// FIXME: use userEvent instead of fireEvent
// blocked by https://github.com/palantir/blueprint/pull/5349
// await user.keyboard('{Escape}');
user;
fireEvent.keyDown(document.activeElement ?? document, {
key: 'Escape',
keyCode: 27,
which: 27,
});
expect(dispatch).toHaveBeenCalledWith(duplicateFileDialogDidCancel());
});
src/explorer/newFileWizard/NewFileWizard.test.tsx
+20 -13
View File
@@ -1,9 +1,8 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2022 The Pybricks Authors
import { waitFor } from '@testing-library/dom';
import { fireEvent, waitFor } from '@testing-library/dom';
import { cleanup } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import React from 'react';
import { testRender } from '../../../test';
import NewFileWizard from './NewFileWizard';
@@ -15,30 +14,30 @@ afterEach(() => {
describe('accept', () => {
it('should dispatch accept action when button is clicked', async () => {
const [dialog, dispatch] = testRender(<NewFileWizard />, {
const [user, dialog, dispatch] = testRender(<NewFileWizard />, {
explorer: { newFileWizard: { isOpen: true } },
});
const button = dialog.getByLabelText('Create');
// have to type a file name before Create button is enabled
userEvent.type(dialog.getByRole('textbox', { name: 'File name' }), 'test');
await user.type(dialog.getByRole('textbox', { name: 'File name' }), 'test');
await waitFor(() => expect(button).not.toBeDisabled());
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(
newFileWizardDidAccept('test', '.py', Hub.Technic),
);
});
it('should dispatch accept action when enter is pressed ', async () => {
const [dialog, dispatch] = testRender(<NewFileWizard />, {
const [user, dialog, dispatch] = testRender(<NewFileWizard />, {
explorer: { newFileWizard: { isOpen: true } },
});
userEvent.type(
await user.type(
dialog.getByRole('textbox', { name: 'File name' }),
'test{enter}',
'test{Enter}',
);
expect(dispatch).toHaveBeenCalledWith(
@@ -48,18 +47,18 @@ describe('accept', () => {
});
describe('cancel', () => {
it('should dispatch cancel when close button is clicked', () => {
const [dialog, dispatch] = testRender(<NewFileWizard />, {
it('should dispatch cancel when close button is clicked', async () => {
const [user, dialog, dispatch] = testRender(<NewFileWizard />, {
explorer: { newFileWizard: { isOpen: true } },
});
userEvent.click(dialog.getByRole('button', { name: 'Close' }));
await user.click(dialog.getByRole('button', { name: 'Close' }));
expect(dispatch).toHaveBeenCalledWith(newFileWizardDidCancel());
});
it('should dispatch cancel when escape button is pressed', async () => {
const [dialog, dispatch] = testRender(<NewFileWizard />, {
const [user, dialog, dispatch] = testRender(<NewFileWizard />, {
explorer: { newFileWizard: { isOpen: true } },
});
@@ -67,7 +66,15 @@ describe('cancel', () => {
expect(dialog.getByRole('textbox', { name: 'File name' })).toHaveFocus(),
);
userEvent.keyboard('{esc}');
// FIXME: use userEvent instead of fireEvent
// blocked by https://github.com/palantir/blueprint/pull/5349
// await user.keyboard('{Escape}');
user;
fireEvent.keyDown(document.activeElement ?? document, {
key: 'Escape',
keyCode: 27,
which: 27,
});
expect(dispatch).toHaveBeenCalledWith(newFileWizardDidCancel());
});
src/explorer/renameFileDialog/RenameFileDialog.test.tsx
+7 -8
View File
@@ -2,7 +2,6 @@
// Copyright (c) 2022 The Pybricks Authors
import { waitFor } from '@testing-library/dom';
import userEvent from '@testing-library/user-event';
import React from 'react';
import { testRender } from '../../../test';
import RenameFileDialog from './RenameFileDialog';
@@ -10,7 +9,7 @@ import { renameFileDialogDidAccept, renameFileDialogDidCancel } from './actions'
describe('rename button', () => {
it('should accept the dialog Rename is clicked', async () => {
const [dialog, dispatch] = testRender(<RenameFileDialog />, {
const [user, dialog, dispatch] = testRender(<RenameFileDialog />, {
explorer: { renameFileDialog: { isOpen: true, fileName: 'old.file' } },
});
@@ -19,24 +18,24 @@ describe('rename button', () => {
// have to type a new file name before Rename button is enabled
const input = dialog.getByLabelText('File name');
await waitFor(() => expect(input).toHaveFocus());
userEvent.type(input, 'new');
await user.type(input, 'new', { skipClick: true });
await waitFor(() => expect(button).not.toBeDisabled());
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(
renameFileDialogDidAccept('old.file', 'new.file'),
);
});
it('should accept the dialog when enter is pressed in the text input', async () => {
const [dialog, dispatch] = testRender(<RenameFileDialog />, {
const [user, dialog, dispatch] = testRender(<RenameFileDialog />, {
explorer: { renameFileDialog: { isOpen: true, fileName: 'old.file' } },
});
// have to type a new file name before Rename button is enabled
const input = dialog.getByLabelText('File name');
await waitFor(() => expect(input).toHaveFocus());
userEvent.type(input, 'new{enter}');
await user.type(input, 'new{Enter}', { skipClick: true });
expect(dispatch).toHaveBeenCalledWith(
renameFileDialogDidAccept('old.file', 'new.file'),
@@ -44,7 +43,7 @@ describe('rename button', () => {
});
it('should be cancellable', async () => {
const [dialog, dispatch] = testRender(<RenameFileDialog />, {
const [user, dialog, dispatch] = testRender(<RenameFileDialog />, {
explorer: { renameFileDialog: { isOpen: true } },
});
@@ -52,7 +51,7 @@ describe('rename button', () => {
await waitFor(() => expect(button).toBeVisible());
userEvent.click(button);
await user.click(button);
expect(dispatch).toHaveBeenCalledWith(renameFileDialogDidCancel());
});
});