Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Components: Cleanup flaky unit test sleep() hacks #64205

Merged
merged 1 commit into from
Aug 2, 2024
Merged

Components: Cleanup flaky unit test sleep() hacks #64205

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions packages/components/src/alignment-matrix-control/test/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* External dependencies
*/
import { render, screen, waitFor, within } from '@testing-library/react';
import { press, click, sleep } from '@ariakit/test';
import { press, click } from '@ariakit/test';

/**
* Internal dependencies
Expand Down Expand Up @@ -39,7 +39,6 @@ describe( 'AlignmentMatrixControl', () => {
it( 'should be centered by default', async () => {
await renderAndInitCompositeStore( <AlignmentMatrixControl /> );

await sleep();
await press.Tab();

expect( getCell( 'center center' ) ).toHaveFocus();
Expand Down Expand Up @@ -110,7 +109,6 @@ describe( 'AlignmentMatrixControl', () => {
<AlignmentMatrixControl onChange={ spy } />
);

await sleep();
await press.Tab();
await press[ keyRef ]();

Expand Down
5 changes: 1 addition & 4 deletions packages/components/src/circular-option-picker/test/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* External dependencies
*/
import { render, screen } from '@testing-library/react';
import { press, sleep } from '@ariakit/test';
import { press } from '@ariakit/test';

/**
* Internal dependencies
Expand Down Expand Up @@ -70,7 +70,6 @@ describe( 'CircularOptionPicker', () => {
/>
);

await sleep();
await press.Tab();
expect( getOption( 'Option One' ) ).toHaveFocus();
await press.ArrowRight();
Expand All @@ -90,7 +89,6 @@ describe( 'CircularOptionPicker', () => {
/>
);

await sleep();
await press.Tab();
expect( getOption( 'Option One' ) ).toHaveFocus();
await press.ArrowRight();
Expand All @@ -110,7 +108,6 @@ describe( 'CircularOptionPicker', () => {
/>
);

await sleep();
await press.Tab();
expect( getOption( 'Option One' ) ).toHaveFocus();
await press.ArrowRight();
Expand Down
18 changes: 1 addition & 17 deletions packages/components/src/composite/legacy/test/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* External dependencies
*/
import { queryByAttribute, render, screen } from '@testing-library/react';
import { press, sleep, waitFor } from '@ariakit/test';
import { press, waitFor } from '@ariakit/test';

/**
* Internal dependencies
Expand Down Expand Up @@ -178,13 +178,10 @@ describe.each( [
);
renderAndValidate( <Test /> );

await sleep();
await press.Tab();
expect( screen.getByText( 'Before' ) ).toHaveFocus();
await sleep();
await press.Tab();
expect( screen.getByText( 'Item 1' ) ).toHaveFocus();
await sleep();
await press.Tab();
expect( screen.getByText( 'After' ) ).toHaveFocus();
await press.ShiftTab();
Expand Down Expand Up @@ -213,7 +210,6 @@ describe.each( [

expect( item2 ).toBeDisabled();

await sleep();
await press.Tab();
expect( item1 ).toHaveFocus();
await press.ArrowDown();
Expand Down Expand Up @@ -243,7 +239,6 @@ describe.each( [
expect( item2 ).toBeEnabled();
expect( item2 ).toHaveAttribute( 'aria-disabled', 'true' );

await sleep();
await press.Tab();
expect( item1 ).toHaveFocus();
await press.ArrowDown();
Expand Down Expand Up @@ -279,7 +274,6 @@ describe.each( [
renderAndValidate( <Test /> );
const { item2 } = getOneDimensionalItems();

await sleep();
await press.Tab();
await waitFor( () => expect( item2 ).toHaveFocus() );
} );
Expand Down Expand Up @@ -323,7 +317,6 @@ describe.each( [
test( 'All directions work with no orientation', async () => {
const { item1, item2, item3 } = useOneDimensionalTest();

await sleep();
await press.Tab();
expect( item1 ).toHaveFocus();
await press.ArrowDown();
Expand Down Expand Up @@ -361,7 +354,6 @@ describe.each( [
orientation: 'horizontal',
} );

await sleep();
await press.Tab();
expect( item1 ).toHaveFocus();
await press.ArrowDown();
Expand Down Expand Up @@ -391,7 +383,6 @@ describe.each( [
orientation: 'vertical',
} );

await sleep();
await press.Tab();
expect( item1 ).toHaveFocus();
await press( next );
Expand Down Expand Up @@ -421,7 +412,6 @@ describe.each( [
loop: true,
} );

await sleep();
await press.Tab();
expect( item1 ).toHaveFocus();
await press.ArrowDown();
Expand All @@ -444,7 +434,6 @@ describe.each( [
const { itemA1, itemA2, itemA3, itemB1, itemB2, itemC1, itemC3 } =
useTwoDimensionalTest();

await sleep();
await press.Tab();
expect( itemA1 ).toHaveFocus();
await press.ArrowUp();
Expand Down Expand Up @@ -481,7 +470,6 @@ describe.each( [
const { itemA1, itemA2, itemA3, itemB1, itemC1, itemC3 } =
useTwoDimensionalTest( { loop: true } );

await sleep();
await press.Tab();
expect( itemA1 ).toHaveFocus();
await press( next );
Expand All @@ -506,7 +494,6 @@ describe.each( [
const { itemA1, itemA2, itemA3, itemB1, itemC1, itemC3 } =
useTwoDimensionalTest( { wrap: true } );

await sleep();
await press.Tab();
expect( itemA1 ).toHaveFocus();
await press( next );
Expand Down Expand Up @@ -539,7 +526,6 @@ describe.each( [
wrap: true,
} );

await sleep();
await press.Tab();
expect( itemA1 ).toHaveFocus();
await press( previous );
Expand All @@ -555,7 +541,6 @@ describe.each( [
test( 'Focus shifts if vertical neighbour unavailable when shift enabled', async () => {
const { itemA1, itemB1, itemB2, itemC1 } = useShiftTest( true );

await sleep();
await press.Tab();
expect( itemA1 ).toHaveFocus();
await press.ArrowDown();
Expand All @@ -577,7 +562,6 @@ describe.each( [
test( 'Focus does not shift if vertical neighbour unavailable when shift not enabled', async () => {
const { itemA1, itemB1, itemB2 } = useShiftTest( false );

await sleep();
await press.Tab();
expect( itemA1 ).toHaveFocus();
await press.ArrowDown();
Expand Down
7 changes: 1 addition & 6 deletions packages/components/src/custom-select-control-v2/test/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* External dependencies
*/
import { screen } from '@testing-library/react';
import { click, press, sleep, type } from '@ariakit/test';
import { click, press, type } from '@ariakit/test';
import { render } from '@ariakit/test/react';

/**
Expand Down Expand Up @@ -101,7 +101,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
await press.Enter();
expect(
Expand All @@ -128,7 +127,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
expect( currentSelectedItem ).toHaveFocus();

Expand All @@ -152,7 +150,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
await press.Enter();
expect(
Expand All @@ -173,7 +170,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
expect( currentSelectedItem ).toHaveFocus();
expect( currentSelectedItem ).toHaveTextContent( 'violets' );
Expand Down Expand Up @@ -425,7 +421,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
expect( currentSelectedItem ).toHaveFocus();
expect( currentSelectedItem ).toHaveTextContent( items[ 0 ].value );
Expand Down
6 changes: 0 additions & 6 deletions packages/components/src/custom-select-control/test/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -196,7 +196,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
await press.Enter();
expect(
Expand Down Expand Up @@ -388,7 +387,6 @@ describe.each( [

await render( <Component { ...props } onChange={ mockOnChange } /> );

await sleep();
await press.Tab();
expect(
screen.getByRole( 'combobox', {
Expand Down Expand Up @@ -494,7 +492,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
expect( currentSelectedItem ).toHaveFocus();

Expand All @@ -520,7 +517,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
await press.Enter();
expect(
Expand All @@ -541,7 +537,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
expect( currentSelectedItem ).toHaveFocus();
expect( currentSelectedItem ).toHaveTextContent(
Expand Down Expand Up @@ -571,7 +566,6 @@ describe.each( [
expanded: false,
} );

await sleep();
await press.Tab();
expect( currentSelectedItem ).toHaveFocus();
expect( currentSelectedItem ).toHaveTextContent(
Expand Down
5 changes: 1 addition & 4 deletions packages/components/src/dropdown-menu-v2/test/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* External dependencies
*/
import { render, screen, waitFor } from '@testing-library/react';
import { press, click, hover, sleep, type } from '@ariakit/test';
import { press, click, hover, type } from '@ariakit/test';

/**
* WordPress dependencies
Expand Down Expand Up @@ -128,7 +128,6 @@ describe( 'DropdownMenu', () => {
} );

// Move focus on the toggle
await sleep();
await press.Tab();

expect( toggleButton ).toHaveFocus();
Expand Down Expand Up @@ -159,7 +158,6 @@ describe( 'DropdownMenu', () => {
} );

// Move focus on the toggle
await sleep();
await press.Tab();

expect( toggleButton ).toHaveFocus();
Expand Down Expand Up @@ -915,7 +913,6 @@ describe( 'DropdownMenu', () => {

// The outer button can be focused by pressing tab. Doing so will cause
// the DropdownMenu to close.
await sleep();
await press.Tab();
expect( outerButton ).toBeInTheDocument();
expect( screen.queryByRole( 'menu' ) ).not.toBeInTheDocument();
Expand Down
9 changes: 1 addition & 8 deletions packages/components/src/tab-panel/test/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* External dependencies
*/
import { render, screen, waitFor } from '@testing-library/react';
import { press, hover, click, sleep } from '@ariakit/test';
import { press, hover, click } from '@ariakit/test';

/**
* WordPress dependencies
Expand Down Expand Up @@ -155,7 +155,6 @@ describe.each( [
// Tab to focus the tablist. Make sure alpha is focused, and that the
// corresponding tooltip is shown.
expect( screen.queryByText( 'Alpha' ) ).not.toBeInTheDocument();
await sleep();
await press.Tab();
expect( mockOnSelect ).toHaveBeenCalledTimes( 1 );
expect( screen.getByText( 'Alpha' ) ).toBeInTheDocument();
Expand Down Expand Up @@ -627,7 +626,6 @@ describe.each( [
// Tab to focus the tablist. Make sure alpha is focused.
expect( await getSelectedTab() ).toHaveTextContent( 'Alpha' );
expect( await getSelectedTab() ).not.toHaveFocus();
await sleep();
await press.Tab();
expect( await getSelectedTab() ).toHaveFocus();

Expand Down Expand Up @@ -665,7 +663,6 @@ describe.each( [
// Tab to focus the tablist. Make sure Alpha is focused.
expect( await getSelectedTab() ).toHaveTextContent( 'Alpha' );
expect( await getSelectedTab() ).not.toHaveFocus();
await sleep();
await press.Tab();
expect( await getSelectedTab() ).toHaveFocus();

Expand Down Expand Up @@ -703,7 +700,6 @@ describe.each( [
// Tab to focus the tablist. Make sure alpha is focused.
expect( await getSelectedTab() ).toHaveTextContent( 'Alpha' );
expect( await getSelectedTab() ).not.toHaveFocus();
await sleep();
await press.Tab();
expect( await getSelectedTab() ).toHaveFocus();

Expand Down Expand Up @@ -799,7 +795,6 @@ describe.each( [
// Tab to focus the tablist. Make sure Alpha is focused.
expect( await getSelectedTab() ).toHaveTextContent( 'Alpha' );
expect( await getSelectedTab() ).not.toHaveFocus();
await sleep();
await press.Tab();
expect( await getSelectedTab() ).toHaveFocus();
expect( mockOnSelect ).toHaveBeenCalledTimes( 1 );
Expand Down Expand Up @@ -841,15 +836,13 @@ describe.each( [

// Tab should initially focus the first tab in the tablist, which
// is Alpha.
await sleep();
await press.Tab();
expect(
await screen.findByRole( 'tab', { name: 'Alpha' } )
).toHaveFocus();

// Because all other tabs should have `tabindex=-1`, pressing Tab
// should NOT move the focus to the next tab, which is Beta.
await sleep();
await press.Tab();
expect(
await screen.findByRole( 'tab', { name: 'Beta' } )
Expand Down
Loading
Loading