diff --git a/packages/block-directory/src/components/downloadable-block-list-item/test/index.js b/packages/block-directory/src/components/downloadable-block-list-item/test/index.js index d2939624fab68e..3e22334aeb6a6d 100644 --- a/packages/block-directory/src/components/downloadable-block-list-item/test/index.js +++ b/packages/block-directory/src/components/downloadable-block-list-item/test/index.js @@ -15,6 +15,8 @@ import { useSelect } from '@wordpress/data'; import DownloadableBlockListItem from '../'; import { plugin } from '../../test/fixtures'; +jest.useFakeTimers(); + jest.mock( '@wordpress/data/src/components/use-select', () => { // This allows us to tweak the returned value on each test. const mock = jest.fn(); diff --git a/packages/block-editor/src/components/alignment-control/test/index.js b/packages/block-editor/src/components/alignment-control/test/index.js index c792b3e9b7f82b..5cfab9d2d48a04 100644 --- a/packages/block-editor/src/components/alignment-control/test/index.js +++ b/packages/block-editor/src/components/alignment-control/test/index.js @@ -14,6 +14,8 @@ import { alignLeft, alignCenter } from '@wordpress/icons'; */ import AlignmentUI from '../ui'; +jest.useFakeTimers(); + describe( 'AlignmentUI', () => { const alignment = 'left'; const onChangeSpy = jest.fn(); diff --git a/packages/block-editor/src/components/block-alignment-control/test/index.js b/packages/block-editor/src/components/block-alignment-control/test/index.js index abf2a0a7c448ae..58846a04cd1c49 100644 --- a/packages/block-editor/src/components/block-alignment-control/test/index.js +++ b/packages/block-editor/src/components/block-alignment-control/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import BlockAlignmentUI from '../ui'; +jest.useFakeTimers(); + describe( 'BlockAlignmentUI', () => { const alignment = 'left'; const onChange = jest.fn(); diff --git a/packages/block-editor/src/components/block-switcher/test/index.js b/packages/block-editor/src/components/block-switcher/test/index.js index 8c1983dd8569d9..0a5ae2342a39b7 100644 --- a/packages/block-editor/src/components/block-switcher/test/index.js +++ b/packages/block-editor/src/components/block-switcher/test/index.js @@ -1,7 +1,7 @@ /** * External dependencies */ -import { render, screen, within } from '@testing-library/react'; +import { act, render, screen, within } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; /** @@ -15,7 +15,8 @@ import { copy } from '@wordpress/icons'; * Internal dependencies */ import { BlockSwitcher, BlockSwitcherDropdownMenu } from '../'; -import { act } from 'react-test-renderer'; + +jest.useFakeTimers(); jest.mock( '@wordpress/data/src/components/use-select', () => jest.fn() ); jest.mock( '../../block-title/use-block-display-title', () => diff --git a/packages/block-editor/src/components/block-vertical-alignment-control/test/index.js b/packages/block-editor/src/components/block-vertical-alignment-control/test/index.js index f2645357a197c3..6db1bb96b58798 100644 --- a/packages/block-editor/src/components/block-vertical-alignment-control/test/index.js +++ b/packages/block-editor/src/components/block-vertical-alignment-control/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import BlockVerticalAlignmentUI from '../ui'; +jest.useFakeTimers(); + describe( 'BlockVerticalAlignmentUI', () => { const alignment = 'top'; const onChange = jest.fn(); diff --git a/packages/block-editor/src/components/colors/test/with-colors.js b/packages/block-editor/src/components/colors/test/with-colors.js index dc1efe7e386dad..0ba0b40f397e55 100644 --- a/packages/block-editor/src/components/colors/test/with-colors.js +++ b/packages/block-editor/src/components/colors/test/with-colors.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { createCustomColorsHOC } from '../with-colors'; +jest.useFakeTimers(); + describe( 'createCustomColorsHOC', () => { it( 'provides the wrapped component with color values and setter functions as props', () => { const withCustomColors = createCustomColorsHOC( [ diff --git a/packages/block-editor/src/components/default-block-appender/test/index.js b/packages/block-editor/src/components/default-block-appender/test/index.js index 0a00a00d5d881f..29b2ed3931a775 100644 --- a/packages/block-editor/src/components/default-block-appender/test/index.js +++ b/packages/block-editor/src/components/default-block-appender/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { DefaultBlockAppender, ZWNBSP } from '../'; +jest.useFakeTimers(); + describe( 'DefaultBlockAppender', () => { it( 'should match snapshot', () => { const onAppend = jest.fn(); diff --git a/packages/block-editor/src/components/media-replace-flow/test/index.js b/packages/block-editor/src/components/media-replace-flow/test/index.js index 94d93a65ef8738..8b1fc612280137 100644 --- a/packages/block-editor/src/components/media-replace-flow/test/index.js +++ b/packages/block-editor/src/components/media-replace-flow/test/index.js @@ -14,6 +14,8 @@ import { useState } from '@wordpress/element'; */ import MediaReplaceFlow from '../'; +jest.useFakeTimers(); + const noop = () => {}; function TestWrapper() { diff --git a/packages/block-editor/src/components/responsive-block-control/test/index.js b/packages/block-editor/src/components/responsive-block-control/test/index.js index d9e9a26f96dfe7..f2d5a5a1a3b880 100644 --- a/packages/block-editor/src/components/responsive-block-control/test/index.js +++ b/packages/block-editor/src/components/responsive-block-control/test/index.js @@ -15,6 +15,8 @@ import { SelectControl } from '@wordpress/components'; */ import ResponsiveBlockControl from '../index'; +jest.useFakeTimers(); + const inputId = 'input-12345678'; const sizeOptions = [ diff --git a/packages/block-editor/src/components/url-input/test/button.js b/packages/block-editor/src/components/url-input/test/button.js index b0288cd8b27664..a7860e483c52e8 100644 --- a/packages/block-editor/src/components/url-input/test/button.js +++ b/packages/block-editor/src/components/url-input/test/button.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import URLInputButton from '../button'; +jest.useFakeTimers(); + describe( 'URLInputButton', () => { it( 'should render a `Insert link` button and not be pressed when `url` is not provided', () => { render( ); diff --git a/packages/block-editor/src/components/warning/test/index.js b/packages/block-editor/src/components/warning/test/index.js index 88c9006b8ace9d..0b9b5f353baafe 100644 --- a/packages/block-editor/src/components/warning/test/index.js +++ b/packages/block-editor/src/components/warning/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import Warning from '../index'; +jest.useFakeTimers(); + describe( 'Warning', () => { it( 'should match snapshot', () => { const { container } = render( error ); diff --git a/packages/components/src/autocomplete/test/index.js b/packages/components/src/autocomplete/test/index.js index b33f585ea9d5f6..0972f35c38b55f 100644 --- a/packages/components/src/autocomplete/test/index.js +++ b/packages/components/src/autocomplete/test/index.js @@ -14,6 +14,8 @@ import { useRef } from '@wordpress/element'; */ import { getAutoCompleterUI } from '../autocompleter-ui'; +jest.useFakeTimers(); + describe( 'AutocompleterUI', () => { describe( 'click outside behavior', () => { it( 'should call reset function when a click on another element occurs', async () => { diff --git a/packages/components/src/border-box-control/test/index.js b/packages/components/src/border-box-control/test/index.js index db9327a4971fa1..9a96cab33746a2 100644 --- a/packages/components/src/border-box-control/test/index.js +++ b/packages/components/src/border-box-control/test/index.js @@ -10,6 +10,8 @@ import { act } from 'react-test-renderer'; */ import { BorderBoxControl } from '../'; +jest.useFakeTimers(); + const colors = [ { name: 'Gray', color: '#f6f7f7' }, { name: 'Blue', color: '#72aee6' }, diff --git a/packages/components/src/box-control/test/index.js b/packages/components/src/box-control/test/index.js index 5da4994cf46122..2d6a51bd8abf73 100644 --- a/packages/components/src/box-control/test/index.js +++ b/packages/components/src/box-control/test/index.js @@ -14,6 +14,8 @@ import { useState } from '@wordpress/element'; */ import BoxControl from '../'; +jest.useFakeTimers(); + const Example = ( extraProps ) => { const [ state, setState ] = useState(); diff --git a/packages/components/src/checkbox-control/test/index.tsx b/packages/components/src/checkbox-control/test/index.tsx index 2c603105dbb70c..5972adf6f695fa 100644 --- a/packages/components/src/checkbox-control/test/index.tsx +++ b/packages/components/src/checkbox-control/test/index.tsx @@ -15,6 +15,8 @@ import { useState } from '@wordpress/element'; import BaseCheckboxControl from '..'; import type { CheckboxControlProps } from '../types'; +jest.useFakeTimers(); + const noop = () => {}; const getInput = () => screen.getByRole( 'checkbox' ) as HTMLInputElement; diff --git a/packages/components/src/color-palette/test/index.tsx b/packages/components/src/color-palette/test/index.tsx index 83d7bc4d3c0eae..136cecec02192a 100644 --- a/packages/components/src/color-palette/test/index.tsx +++ b/packages/components/src/color-palette/test/index.tsx @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import ColorPalette from '..'; +jest.useFakeTimers(); + const EXAMPLE_COLORS = [ { name: 'red', color: '#f00' }, { name: 'green', color: '#0f0' }, diff --git a/packages/components/src/color-picker/test/index.js b/packages/components/src/color-picker/test/index.js index 3613302bbdc2a0..caf17afd320ff9 100644 --- a/packages/components/src/color-picker/test/index.js +++ b/packages/components/src/color-picker/test/index.js @@ -8,6 +8,8 @@ import { render, fireEvent } from '@testing-library/react'; */ import { ColorPicker } from '..'; +jest.useFakeTimers(); + /** * Ordinarily we'd try to select the compnoent by role but the silder role appears * on several elements and we'd end up encoding assumptions about order when diff --git a/packages/components/src/combobox-control/test/index.js b/packages/components/src/combobox-control/test/index.js index 8fcb6f423b4346..8c01eaa40464b3 100644 --- a/packages/components/src/combobox-control/test/index.js +++ b/packages/components/src/combobox-control/test/index.js @@ -14,6 +14,8 @@ import { useState } from '@wordpress/element'; */ import ComboboxControl from '../'; +jest.useFakeTimers(); + const timezones = [ { label: 'Greenwich Mean Time', value: 'GMT' }, { label: 'Universal Coordinated Time', value: 'UTC' }, diff --git a/packages/components/src/confirm-dialog/test/index.js b/packages/components/src/confirm-dialog/test/index.js index 0959f0e95b989f..487c025d2153d1 100644 --- a/packages/components/src/confirm-dialog/test/index.js +++ b/packages/components/src/confirm-dialog/test/index.js @@ -15,6 +15,8 @@ import userEvent from '@testing-library/user-event'; */ import { ConfirmDialog } from '..'; +jest.useFakeTimers(); + const noop = () => {}; describe( 'Confirm', () => { diff --git a/packages/components/src/date-time/date/test/index.tsx b/packages/components/src/date-time/date/test/index.tsx index 7a1a52ee929a9e..2a62fab3405030 100644 --- a/packages/components/src/date-time/date/test/index.tsx +++ b/packages/components/src/date-time/date/test/index.tsx @@ -10,6 +10,8 @@ import userEvent from '@testing-library/user-event'; */ import DatePicker from '..'; +jest.useFakeTimers(); + describe( 'DatePicker', () => { it( 'should highlight the current date', () => { render( ); diff --git a/packages/components/src/date-time/time/test/index.tsx b/packages/components/src/date-time/time/test/index.tsx index 4b22cd232baf0e..bcffe041a100ba 100644 --- a/packages/components/src/date-time/time/test/index.tsx +++ b/packages/components/src/date-time/time/test/index.tsx @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import TimePicker from '..'; +jest.useFakeTimers(); + describe( 'TimePicker', () => { it( 'should call onChange with updated date values', async () => { const user = userEvent.setup( { diff --git a/packages/components/src/dimension-control/test/index.test.js b/packages/components/src/dimension-control/test/index.test.js index b1e92add6fd00b..2864578e6ff833 100644 --- a/packages/components/src/dimension-control/test/index.test.js +++ b/packages/components/src/dimension-control/test/index.test.js @@ -14,6 +14,8 @@ import { plus } from '@wordpress/icons'; */ import { DimensionControl } from '../'; +jest.useFakeTimers(); + describe( 'DimensionControl', () => { const onChangeHandler = jest.fn(); const instanceId = 1; diff --git a/packages/components/src/disabled/test/index.tsx b/packages/components/src/disabled/test/index.tsx index fddbd1159637bb..b4dadc21662a63 100644 --- a/packages/components/src/disabled/test/index.tsx +++ b/packages/components/src/disabled/test/index.tsx @@ -9,6 +9,8 @@ import { render, screen } from '@testing-library/react'; import Disabled from '../'; import userEvent from '@testing-library/user-event'; +jest.useFakeTimers(); + describe( 'Disabled', () => { const Form = () => (
diff --git a/packages/components/src/dropdown-menu/test/index.js b/packages/components/src/dropdown-menu/test/index.js index dcb268b7cad9b2..1fc52175862c0d 100644 --- a/packages/components/src/dropdown-menu/test/index.js +++ b/packages/components/src/dropdown-menu/test/index.js @@ -15,6 +15,8 @@ import { arrowLeft, arrowRight, arrowUp, arrowDown } from '@wordpress/icons'; import DropdownMenu from '../'; import { MenuItem } from '../../'; +jest.useFakeTimers(); + describe( 'DropdownMenu', () => { it( 'should not render when neither controls nor children are assigned', () => { render( ); diff --git a/packages/components/src/dropdown/test/index.tsx b/packages/components/src/dropdown/test/index.tsx index 32307aceea0617..ecf32c4500e3e8 100644 --- a/packages/components/src/dropdown/test/index.tsx +++ b/packages/components/src/dropdown/test/index.tsx @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import Dropdown from '..'; +jest.useFakeTimers(); + describe( 'Dropdown', () => { it( 'should toggle the dropdown properly', async () => { const user = userEvent.setup( { diff --git a/packages/components/src/external-link/test/index.tsx b/packages/components/src/external-link/test/index.tsx index bb001961ae33e8..c641c5d799a63b 100644 --- a/packages/components/src/external-link/test/index.tsx +++ b/packages/components/src/external-link/test/index.tsx @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { ExternalLink } from '..'; +jest.useFakeTimers(); + const setupUser = () => userEvent.setup( { advanceTimers: jest.advanceTimersByTime, diff --git a/packages/components/src/focal-point-picker/test/index.js b/packages/components/src/focal-point-picker/test/index.js index b49985931050d1..4e7645b01cbf68 100644 --- a/packages/components/src/focal-point-picker/test/index.js +++ b/packages/components/src/focal-point-picker/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import Picker from '..'; +jest.useFakeTimers(); + describe( 'FocalPointPicker', () => { describe( 'focus and blur', () => { it( 'clicking the draggable area should focus it', async () => { diff --git a/packages/components/src/font-size-picker/test/index.tsx b/packages/components/src/font-size-picker/test/index.tsx index 3ac59bc2df1cb1..c51416a18cbddd 100644 --- a/packages/components/src/font-size-picker/test/index.tsx +++ b/packages/components/src/font-size-picker/test/index.tsx @@ -10,6 +10,8 @@ import userEvent from '@testing-library/user-event'; import FontSizePicker from '../'; import type { FontSize } from '../types'; +jest.useFakeTimers(); + describe( 'FontSizePicker', () => { test.each( [ // Use units when initial value uses units. diff --git a/packages/components/src/form-file-upload/test/index.tsx b/packages/components/src/form-file-upload/test/index.tsx index cad69766aa8c2b..a1492e7e988d3c 100644 --- a/packages/components/src/form-file-upload/test/index.tsx +++ b/packages/components/src/form-file-upload/test/index.tsx @@ -14,6 +14,8 @@ import FormFileUpload from '..'; */ const { File } = window; +jest.useFakeTimers(); + // @testing-library/user-event considers changing to a string as a change, but it do not occur on real browsers, so the comparisons will be against this result const fakePath = expect.objectContaining( { target: expect.objectContaining( { diff --git a/packages/components/src/form-toggle/test/index.tsx b/packages/components/src/form-toggle/test/index.tsx index 57c603dc4143ad..4ed799567b4075 100644 --- a/packages/components/src/form-toggle/test/index.tsx +++ b/packages/components/src/form-toggle/test/index.tsx @@ -15,6 +15,8 @@ import { useState } from '@wordpress/element'; import FormToggle, { noop } from '..'; import type { FormToggleProps } from '../types'; +jest.useFakeTimers(); + const getInput = () => screen.getByRole( 'checkbox' ) as HTMLInputElement; const ControlledFormToggle = ( { onChange }: FormToggleProps ) => { diff --git a/packages/components/src/form-token-field/test/index.tsx b/packages/components/src/form-token-field/test/index.tsx index 8a37c2304f8fca..020e4e650006b6 100644 --- a/packages/components/src/form-token-field/test/index.tsx +++ b/packages/components/src/form-token-field/test/index.tsx @@ -21,6 +21,8 @@ import { useState } from '@wordpress/element'; */ import FormTokenField from '../'; +jest.useFakeTimers(); + const FormTokenFieldWithState = ( { onChange, value, diff --git a/packages/components/src/guide/test/index.js b/packages/components/src/guide/test/index.js index 852c09ed280887..fcea9d15d31675 100644 --- a/packages/components/src/guide/test/index.js +++ b/packages/components/src/guide/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import Guide from '../'; +jest.useFakeTimers(); + describe( 'Guide', () => { it( 'renders nothing when there are no pages', () => { render( ); diff --git a/packages/components/src/higher-order/with-focus-outside/test/index.js b/packages/components/src/higher-order/with-focus-outside/test/index.js index feea9e8f2ff029..8223679279738c 100644 --- a/packages/components/src/higher-order/with-focus-outside/test/index.js +++ b/packages/components/src/higher-order/with-focus-outside/test/index.js @@ -14,6 +14,8 @@ import { Component } from '@wordpress/element'; */ import withFocusOutside from '../'; +jest.useFakeTimers(); + let onFocusOutside; describe( 'withFocusOutside', () => { diff --git a/packages/components/src/higher-order/with-focus-return/test/index.js b/packages/components/src/higher-order/with-focus-return/test/index.js index b88e3cfd0bad08..a8abaa56d69628 100644 --- a/packages/components/src/higher-order/with-focus-return/test/index.js +++ b/packages/components/src/higher-order/with-focus-return/test/index.js @@ -14,6 +14,8 @@ import { Component } from '@wordpress/element'; */ import withFocusReturn from '../'; +jest.useFakeTimers(); + class Test extends Component { render() { const { className, focusHistory } = this.props; diff --git a/packages/components/src/input-control/test/index.js b/packages/components/src/input-control/test/index.js index 0be4fd28f4f495..82e936aa1b5e98 100644 --- a/packages/components/src/input-control/test/index.js +++ b/packages/components/src/input-control/test/index.js @@ -14,6 +14,8 @@ import { useState } from '@wordpress/element'; */ import BaseInputControl from '../'; +jest.useFakeTimers(); + const setupUser = () => userEvent.setup( { advanceTimers: jest.advanceTimersByTime, diff --git a/packages/components/src/isolated-event-container/test/index.js b/packages/components/src/isolated-event-container/test/index.js index 1667d69b4df0dd..2f81f50e66c3b5 100644 --- a/packages/components/src/isolated-event-container/test/index.js +++ b/packages/components/src/isolated-event-container/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import IsolatedEventContainer from '../'; +jest.useFakeTimers(); + describe( 'IsolatedEventContainer', () => { it( 'should pass props to container', async () => { const user = userEvent.setup( { diff --git a/packages/components/src/modal/test/index.tsx b/packages/components/src/modal/test/index.tsx index 310dc3d6e63a9f..63ff485c35458e 100644 --- a/packages/components/src/modal/test/index.tsx +++ b/packages/components/src/modal/test/index.tsx @@ -72,9 +72,7 @@ describe( 'Modal', () => { } ); it( 'should call onRequestClose when the escape key is pressed', async () => { - const user = userEvent.setup( { - advanceTimers: jest.advanceTimersByTime, - } ); + const user = userEvent.setup(); const onRequestClose = jest.fn(); render( diff --git a/packages/components/src/navigable-container/test/navigable-menu.js b/packages/components/src/navigable-container/test/navigable-menu.js index e50925a73c1d3b..461c1efd454805 100644 --- a/packages/components/src/navigable-container/test/navigable-menu.js +++ b/packages/components/src/navigable-container/test/navigable-menu.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { NavigableMenu } from '../menu'; +jest.useFakeTimers(); + const NavigableMenuTestCase = ( props ) => ( diff --git a/packages/components/src/navigable-container/test/tababble-container.js b/packages/components/src/navigable-container/test/tababble-container.js index 593238578792f1..55db6aa24c7410 100644 --- a/packages/components/src/navigable-container/test/tababble-container.js +++ b/packages/components/src/navigable-container/test/tababble-container.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { TabbableContainer } from '../tabbable'; +jest.useFakeTimers(); + const TabbableContainerTestCase = ( props ) => ( diff --git a/packages/components/src/navigation/test/index.js b/packages/components/src/navigation/test/index.js index 83ada8291709bc..1c26bb461930ca 100644 --- a/packages/components/src/navigation/test/index.js +++ b/packages/components/src/navigation/test/index.js @@ -16,6 +16,8 @@ import Navigation from '..'; import NavigationItem from '../item'; import NavigationMenu from '../menu'; +jest.useFakeTimers(); + const TestNavigation = ( { activeItem, rootTitle, showBadge } = {} ) => ( diff --git a/packages/components/src/navigator/test/index.tsx b/packages/components/src/navigator/test/index.tsx index be836f0152fc20..4a6b7d85e360ca 100644 --- a/packages/components/src/navigator/test/index.tsx +++ b/packages/components/src/navigator/test/index.tsx @@ -20,6 +20,8 @@ import { NavigatorBackButton, } from '..'; +jest.useFakeTimers(); + jest.mock( 'framer-motion', () => { const actual = jest.requireActual( 'framer-motion' ); return { diff --git a/packages/components/src/number-control/test/index.tsx b/packages/components/src/number-control/test/index.tsx index ce794d3a227ff9..f4f5556982c953 100644 --- a/packages/components/src/number-control/test/index.tsx +++ b/packages/components/src/number-control/test/index.tsx @@ -15,6 +15,8 @@ import { useState } from '@wordpress/element'; import NumberControl from '..'; import type { NumberControlProps } from '../types'; +jest.useFakeTimers(); + function StatefulNumberControl( props: NumberControlProps ) { const [ value, setValue ] = useState( props.value ); const handleOnChange = ( v: string | undefined ) => setValue( v ); diff --git a/packages/components/src/panel/test/body.js b/packages/components/src/panel/test/body.js index 9e0c676859c5e7..bd8cc0d567d0f2 100644 --- a/packages/components/src/panel/test/body.js +++ b/packages/components/src/panel/test/body.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { PanelBody } from '../body'; +jest.useFakeTimers(); + describe( 'PanelBody', () => { describe( 'basic rendering', () => { it( 'should render an empty div with the matching className', () => { diff --git a/packages/components/src/select-control/test/select-control.tsx b/packages/components/src/select-control/test/select-control.tsx index 3e0dd45d62b586..11d9eedc60407f 100644 --- a/packages/components/src/select-control/test/select-control.tsx +++ b/packages/components/src/select-control/test/select-control.tsx @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import SelectControl from '..'; +jest.useFakeTimers(); + const setupUser = () => userEvent.setup( { advanceTimers: jest.advanceTimersByTime, diff --git a/packages/components/src/tab-panel/test/index.tsx b/packages/components/src/tab-panel/test/index.tsx index 0d3a30e991ea3f..1ea23c16b602e0 100644 --- a/packages/components/src/tab-panel/test/index.tsx +++ b/packages/components/src/tab-panel/test/index.tsx @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import TabPanel from '..'; +jest.useFakeTimers(); + const setupUser = () => userEvent.setup( { advanceTimers: jest.advanceTimersByTime, diff --git a/packages/components/src/toggle-group-control/test/index.tsx b/packages/components/src/toggle-group-control/test/index.tsx index 841ca8fd6bcafb..511b362f1a2d59 100644 --- a/packages/components/src/toggle-group-control/test/index.tsx +++ b/packages/components/src/toggle-group-control/test/index.tsx @@ -18,6 +18,8 @@ import { ToggleGroupControlOptionIcon, } from '../index'; +jest.useFakeTimers(); + function getWrappingPopoverElement( element: HTMLElement ) { return element.closest( '.components-popover' ); } diff --git a/packages/components/src/tooltip/test/index.js b/packages/components/src/tooltip/test/index.js index 21892dea6a0da5..69e160823456e4 100644 --- a/packages/components/src/tooltip/test/index.js +++ b/packages/components/src/tooltip/test/index.js @@ -13,6 +13,8 @@ import Tooltip from '../'; */ import { TOOLTIP_DELAY } from '../index.js'; +jest.useFakeTimers(); + function getWrappingPopoverElement( element ) { return element.closest( '.components-popover' ); } diff --git a/packages/components/src/unit-control/test/index.tsx b/packages/components/src/unit-control/test/index.tsx index a0e3bf3d99dcac..d0d232a54e6704 100644 --- a/packages/components/src/unit-control/test/index.tsx +++ b/packages/components/src/unit-control/test/index.tsx @@ -16,6 +16,8 @@ import UnitControl from '..'; import { parseQuantityAndUnitFromRawValue } from '../utils'; import type { UnitControlOnChangeCallback } from '../types'; +jest.useFakeTimers(); + const getInput = ( { isInputTypeText = false, }: { diff --git a/packages/components/src/utils/hooks/test/use-latest-ref.js b/packages/components/src/utils/hooks/test/use-latest-ref.js index b90b349f25a453..3e2969a1000c9a 100644 --- a/packages/components/src/utils/hooks/test/use-latest-ref.js +++ b/packages/components/src/utils/hooks/test/use-latest-ref.js @@ -13,6 +13,8 @@ import { useState } from '@wordpress/element'; */ import { useLatestRef } from '..'; +jest.useFakeTimers(); + function debounce( callback, timeout = 0 ) { let timeoutId = 0; return ( ...args ) => { diff --git a/packages/compose/src/higher-order/pure/test/index.js b/packages/compose/src/higher-order/pure/test/index.js index 640b250df98422..84fcc26181b95c 100644 --- a/packages/compose/src/higher-order/pure/test/index.js +++ b/packages/compose/src/higher-order/pure/test/index.js @@ -14,6 +14,8 @@ import { Component } from '@wordpress/element'; */ import pure from '../'; +jest.useFakeTimers(); + describe( 'pure', () => { it( 'functional component should rerender only when props change', () => { let i = 0; diff --git a/packages/compose/src/higher-order/with-state/test/index.js b/packages/compose/src/higher-order/with-state/test/index.js index b6b401eb668204..75457d49f89c66 100644 --- a/packages/compose/src/higher-order/with-state/test/index.js +++ b/packages/compose/src/higher-order/with-state/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import withState from '../'; +jest.useFakeTimers(); + describe( 'withState', () => { it( 'should pass initial state and allow updates', async () => { const user = userEvent.setup( { diff --git a/packages/compose/src/hooks/use-focus-outside/test/index.js b/packages/compose/src/hooks/use-focus-outside/test/index.js index 2f7c983bb0a62d..04f99e486444c8 100644 --- a/packages/compose/src/hooks/use-focus-outside/test/index.js +++ b/packages/compose/src/hooks/use-focus-outside/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import useFocusOutside from '../'; +jest.useFakeTimers(); + const FocusOutsideComponent = ( { onFocusOutside: callback } ) => (
{ /* Wrapper */ } diff --git a/packages/edit-post/src/components/preferences-modal/options/test/enable-custom-fields.js b/packages/edit-post/src/components/preferences-modal/options/test/enable-custom-fields.js index d1bb19cf8dd5dc..5a5591704e9ee9 100644 --- a/packages/edit-post/src/components/preferences-modal/options/test/enable-custom-fields.js +++ b/packages/edit-post/src/components/preferences-modal/options/test/enable-custom-fields.js @@ -12,6 +12,8 @@ import { CustomFieldsConfirmation, } from '../enable-custom-fields'; +jest.useFakeTimers(); + describe( 'EnableCustomFieldsOption', () => { it( 'renders a checked checkbox when custom fields are enabled', () => { const { container } = render( diff --git a/packages/editor/src/components/page-attributes/test/order.js b/packages/editor/src/components/page-attributes/test/order.js index e4cdcc59f722a3..31921df9b2a3e8 100644 --- a/packages/editor/src/components/page-attributes/test/order.js +++ b/packages/editor/src/components/page-attributes/test/order.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { PageAttributesOrder } from '../order'; +jest.useFakeTimers(); + describe( 'PageAttributesOrder', () => { /** * When starting to type inside the spinbutton, select the current value diff --git a/packages/editor/src/components/post-preview-button/test/index.js b/packages/editor/src/components/post-preview-button/test/index.js index 9183debdf2e3d2..6589da6b41a823 100644 --- a/packages/editor/src/components/post-preview-button/test/index.js +++ b/packages/editor/src/components/post-preview-button/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { PostPreviewButton } from '../'; +jest.useFakeTimers(); + describe( 'PostPreviewButton', () => { const documentWrite = jest.fn(); const documentTitle = jest.fn(); diff --git a/packages/editor/src/components/post-publish-button/test/index.js b/packages/editor/src/components/post-publish-button/test/index.js index 299b6b0568699a..c4ada555bb117c 100644 --- a/packages/editor/src/components/post-publish-button/test/index.js +++ b/packages/editor/src/components/post-publish-button/test/index.js @@ -9,6 +9,8 @@ import userEvent from '@testing-library/user-event'; */ import { PostPublishButton } from '../'; +jest.useFakeTimers(); + describe( 'PostPublishButton', () => { describe( 'aria-disabled', () => { it( 'should be true if post is currently saving', () => { diff --git a/packages/editor/src/components/post-saved-state/test/index.js b/packages/editor/src/components/post-saved-state/test/index.js index c684f0011acedd..e0c27b213bca83 100644 --- a/packages/editor/src/components/post-saved-state/test/index.js +++ b/packages/editor/src/components/post-saved-state/test/index.js @@ -15,6 +15,8 @@ import { useSelect } from '@wordpress/data'; */ import PostSavedState from '../'; +jest.useFakeTimers(); + const mockSavePost = jest.fn(); jest.mock( '@wordpress/data/src/components/use-dispatch', () => { diff --git a/packages/editor/src/components/post-slug/test/index.js b/packages/editor/src/components/post-slug/test/index.js index 771f6c2f60bab6..74011209dd151a 100644 --- a/packages/editor/src/components/post-slug/test/index.js +++ b/packages/editor/src/components/post-slug/test/index.js @@ -1,7 +1,7 @@ /** * External dependencies */ -import { render, screen } from '@testing-library/react'; +import { act, render, screen } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; /** @@ -11,9 +11,7 @@ import { PostSlug } from '../'; describe( 'PostSlug', () => { it( 'should update slug with sanitized input', async () => { - const user = userEvent.setup( { - advanceTimers: jest.advanceTimersByTime, - } ); + const user = userEvent.setup(); const onUpdateSlug = jest.fn(); render( ); @@ -21,7 +19,7 @@ describe( 'PostSlug', () => { const input = screen.getByRole( 'textbox', { name: 'Slug' } ); await user.clear( input ); await user.type( input, 'Foo Bar-Baz 9!' ); - input.blur(); + act( () => input.blur() ); expect( onUpdateSlug ).toHaveBeenCalledWith( 'foo-bar-baz-9' ); } ); diff --git a/packages/jest-preset-default/jest-preset.js b/packages/jest-preset-default/jest-preset.js index c6a491e9ed1d98..fc80efd5c62641 100644 --- a/packages/jest-preset-default/jest-preset.js +++ b/packages/jest-preset-default/jest-preset.js @@ -24,7 +24,7 @@ module.exports = { '**/?(*.)test.[jt]s?(x)', ], testPathIgnorePatterns: [ '/node_modules/', '/vendor/' ], - timers: 'fake', + timers: 'real', transform: { '\\.[jt]sx?$': require.resolve( 'babel-jest' ), },