fix breaking changes for user-event v14

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
+16 -17
View File
@@ -2,7 +2,6 @@
// Copyright (c) 2022 The Pybricks Authors
import { cleanup, getByLabelText, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import React from 'react';
import { testRender } from '../../test';
import Settings from './Settings';
@@ -14,44 +13,44 @@ afterEach(() => {
describe('showDocs setting switch', () => {
it('should toggle setting', async () => {
const [settings] = testRender(<Settings />);
const [user, settings] = testRender(<Settings />);
const showDocs = settings.getByLabelText('Documentation');
expect(showDocs).toBeChecked();
userEvent.click(showDocs);
await user.click(showDocs);
expect(showDocs).not.toBeChecked();
});
});
describe('darkMode setting switch', () => {
it('should toggle setting', async () => {
const [settings] = testRender(<Settings />);
const [user, settings] = testRender(<Settings />);
const darkMode = settings.getByLabelText('Dark mode');
expect(darkMode).not.toBeChecked();
expect(localStorage.getItem('usehooks-ts-ternary-dark-mode')).toBe(null);
userEvent.click(darkMode);
await user.click(darkMode);
expect(darkMode).toBeChecked();
expect(localStorage.getItem('usehooks-ts-ternary-dark-mode')).toBe('"dark"');
userEvent.click(darkMode);
await user.click(darkMode);
expect(darkMode).not.toBeChecked();
expect(localStorage.getItem('usehooks-ts-ternary-dark-mode')).toBe('"light"');
});
});
describe('flashCurrentProgram setting switch', () => {
it('should toggle the setting', () => {
const [settings] = testRender(<Settings />);
it('should toggle the setting', async () => {
const [user, settings] = testRender(<Settings />);
expect(localStorage.getItem('setting.flashCurrentProgram')).toBe(null);
settings.getByLabelText('Include current program').click();
await user.click(settings.getByLabelText('Include current program'));
expect(localStorage.getItem('setting.flashCurrentProgram')).toBe('true');
settings.getByLabelText('Include current program').click();
await user.click(settings.getByLabelText('Include current program'));
expect(localStorage.getItem('setting.flashCurrentProgram')).toBe('false');
});
});
@@ -61,20 +60,20 @@ describe('hubName setting', () => {
// old settings did not use json format, so lack quotes
localStorage.setItem('setting.hubName', 'old name');
const [settings] = testRender(<Settings />);
const [, settings] = testRender(<Settings />);
const textBox = settings.getByLabelText('Hub name');
expect(textBox).toHaveValue('old name');
});
it('should update the setting', () => {
const [settings] = testRender(<Settings />);
it('should update the setting', async () => {
const [user, settings] = testRender(<Settings />);
expect(localStorage.getItem('setting.hubName')).toBe(null);
const textBox = settings.getByLabelText('Hub name');
userEvent.type(textBox, 'test name');
await user.type(textBox, 'test name');
expect(localStorage.getItem('setting.hubName')).toBe('"test name"');
});
@@ -82,19 +81,19 @@ describe('hubName setting', () => {
describe('about dialog', () => {
it('should open the dialog when the button is clicked', async () => {
const [settings] = testRender(<Settings />);
const [user, settings] = testRender(<Settings />);
const appName = process.env.REACT_APP_NAME;
expect(settings.queryByRole('dialog', { name: `About ${appName}` })).toBeNull();
settings.getByText('About').click();
await user.click(settings.getByText('About'));
const dialog = settings.getByRole('dialog', { name: `About ${appName}` });
expect(dialog).toBeVisible();
getByLabelText(dialog, 'Close').click();
await user.click(getByLabelText(dialog, 'Close'));
await waitFor(() => expect(dialog).not.toBeVisible());
});