|
|
|
@@ -0,0 +1,96 @@
|
|
|
|
|
|
|
|
|
|
> job-tracker-ui@0.1.0 test
|
|
|
|
|
> jest --runInBand confirm.test.tsx
|
|
|
|
|
|
|
|
|
|
console.error
|
|
|
|
|
An update to ForwardRef(ButtonBase) inside a test was not wrapped in act(...).
|
|
|
|
|
|
|
|
|
|
When testing, code that causes React state updates should be wrapped into act(...):
|
|
|
|
|
|
|
|
|
|
act(() => {
|
|
|
|
|
/* fire events that update state */
|
|
|
|
|
});
|
|
|
|
|
/* assert on the output */
|
|
|
|
|
|
|
|
|
|
This ensures that you're testing the behavior the user would see in the browser. Learn more at https://react.dev/link/wrap-tests-with-act
|
|
|
|
|
|
|
|
|
|
34 | const messageRegion = screen.getByRole('region', { name: 'Delete job' });
|
|
|
|
|
35 | expect(messageRegion).toHaveAttribute('tabindex', '0');
|
|
|
|
|
> 36 | messageRegion.focus();
|
|
|
|
|
| ^
|
|
|
|
|
37 | expect(messageRegion).toHaveFocus();
|
|
|
|
|
38 | });
|
|
|
|
|
39 |
|
|
|
|
|
|
|
|
|
|
at node_modules/react-dom/cjs/react-dom-client.development.js:18758:19
|
|
|
|
|
at runWithFiberInDEV (node_modules/react-dom/cjs/react-dom-client.development.js:874:13)
|
|
|
|
|
at warnIfUpdatesNotWrappedWithActDEV (node_modules/react-dom/cjs/react-dom-client.development.js:18757:9)
|
|
|
|
|
at scheduleUpdateOnFiber (node_modules/react-dom/cjs/react-dom-client.development.js:16409:11)
|
|
|
|
|
at dispatchSetStateInternal (node_modules/react-dom/cjs/react-dom-client.development.js:9170:13)
|
|
|
|
|
at dispatchSetState (node_modules/react-dom/cjs/react-dom-client.development.js:9127:7)
|
|
|
|
|
at node_modules/@mui/material/ButtonBase/ButtonBase.js:162:7
|
|
|
|
|
at node_modules/@mui/material/ButtonBase/ButtonBase.js:290:7
|
|
|
|
|
at node_modules/@mui/utils/useEventCallback/useEventCallback.js:24:19
|
|
|
|
|
at executeDispatch (node_modules/react-dom/cjs/react-dom-client.development.js:19116:9)
|
|
|
|
|
at runWithFiberInDEV (node_modules/react-dom/cjs/react-dom-client.development.js:874:13)
|
|
|
|
|
at processDispatchQueue (node_modules/react-dom/cjs/react-dom-client.development.js:19166:19)
|
|
|
|
|
at node_modules/react-dom/cjs/react-dom-client.development.js:19767:9
|
|
|
|
|
at batchedUpdates$1 (node_modules/react-dom/cjs/react-dom-client.development.js:3255:40)
|
|
|
|
|
at dispatchEventForPluginEventSystem (node_modules/react-dom/cjs/react-dom-client.development.js:19320:7)
|
|
|
|
|
at dispatchEvent (node_modules/react-dom/cjs/react-dom-client.development.js:23585:11)
|
|
|
|
|
at dispatchDiscreteEvent (node_modules/react-dom/cjs/react-dom-client.development.js:23553:11)
|
|
|
|
|
at HTMLBodyElement.callTheUserObjectsOperation (node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
|
|
|
|
|
at innerInvokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:350:25)
|
|
|
|
|
at invokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:286:3)
|
|
|
|
|
at HTMLButtonElementImpl._dispatch (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:233:9)
|
|
|
|
|
at Object.exports.fireFocusEventWithTargetAdjustment (node_modules/jsdom/lib/jsdom/living/helpers/focusing.js:103:10)
|
|
|
|
|
at HTMLDivElementImpl.focus (node_modules/jsdom/lib/jsdom/living/nodes/HTMLOrSVGElement-impl.js:58:16)
|
|
|
|
|
at HTMLDivElement.focus (node_modules/jsdom/lib/jsdom/living/generated/HTMLElement.js:128:34)
|
|
|
|
|
at Object.focus (src/confirm.test.tsx:36:17)
|
|
|
|
|
|
|
|
|
|
console.error
|
|
|
|
|
An update to ForwardRef(TouchRipple) inside a test was not wrapped in act(...).
|
|
|
|
|
|
|
|
|
|
When testing, code that causes React state updates should be wrapped into act(...):
|
|
|
|
|
|
|
|
|
|
act(() => {
|
|
|
|
|
/* fire events that update state */
|
|
|
|
|
});
|
|
|
|
|
/* assert on the output */
|
|
|
|
|
|
|
|
|
|
This ensures that you're testing the behavior the user would see in the browser. Learn more at https://react.dev/link/wrap-tests-with-act
|
|
|
|
|
|
|
|
|
|
at node_modules/react-dom/cjs/react-dom-client.development.js:18758:19
|
|
|
|
|
at runWithFiberInDEV (node_modules/react-dom/cjs/react-dom-client.development.js:874:13)
|
|
|
|
|
at warnIfUpdatesNotWrappedWithActDEV (node_modules/react-dom/cjs/react-dom-client.development.js:18757:9)
|
|
|
|
|
at scheduleUpdateOnFiber (node_modules/react-dom/cjs/react-dom-client.development.js:16409:11)
|
|
|
|
|
at dispatchSetStateInternal (node_modules/react-dom/cjs/react-dom-client.development.js:9170:13)
|
|
|
|
|
at dispatchSetState (node_modules/react-dom/cjs/react-dom-client.development.js:9127:7)
|
|
|
|
|
at Object.stop (node_modules/@mui/material/ButtonBase/TouchRipple.js:292:5)
|
|
|
|
|
at node_modules/@mui/material/useLazyRipple/useLazyRipple.js:74:47
|
|
|
|
|
|
|
|
|
|
FAIL src/confirm.test.tsx
|
|
|
|
|
● finishing the opening transition recovers Cancel from the nested-modal container fallback
|
|
|
|
|
|
|
|
|
|
expect(element).toHaveFocus()
|
|
|
|
|
|
|
|
|
|
Expected element with focus:
|
|
|
|
|
<button class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary css-1dn15bh-MuiButtonBase-root-MuiButton-root" tabindex="0" type="button">Cancel<span class="MuiTouchRipple-root css-r3djoj-MuiTouchRipple-root" /></button>
|
|
|
|
|
Received element with focus:
|
|
|
|
|
<div class="MuiDialog-container MuiDialog-scrollPaper css-19do60a-MuiDialog-container" role="presentation" style="opacity: 1; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;" tabindex="-1"><div aria-describedby="_r_f_" aria-labelledby="_r_g_" aria-modal="true" class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation24 MuiDialog-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthXs MuiDialog-paperFullWidth css-n24a7g-MuiPaper-root-MuiDialog-paper" role="dialog" style="--Paper-shadow: 0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12);"><h2 class="MuiTypography-root MuiTypography-h6 MuiDialogTitle-root css-rcehg8-MuiTypography-root-MuiDialogTitle-root" id="_r_g_">Delete job</h2><div aria-labelledby="_r_g_" class="MuiDialogContent-root css-kw13he-MuiDialogContent-root" role="region" tabindex="0"><div class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation0 MuiAlert-root MuiAlert-colorWarning MuiAlert-outlinedWarning MuiAlert-outlined css-15us3fl-MuiPaper-root-MuiAlert-root" role="alert" style="--Paper-shadow: none;"><div class="MuiAlert-icon css-1wrdnka-MuiAlert-icon"><svg aria-hidden="true" class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit css-1ckov0h-MuiSvgIcon-root" data-testid="ReportProblemOutlinedIcon" focusable="false" viewBox="0 0 24 24"><path d="M12 5.99L19.53 19H4.47L12 5.99M12 2L1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z" /></svg></div><div class="MuiAlert-message css-zioonp-MuiAlert-message">This action may be hard to undo.</div></div><p class="MuiTypography-root MuiTypography-body1 css-3yi46c-MuiTypography-root" id="_r_f_">Are you sure?</p></div><div class="MuiDialogActions-root MuiDialogActions-spacing css-1uwjd7y-MuiDialogActions-root"><button class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary css-1dn15bh-MuiButtonBase-root-MuiButton-root" tabindex="0" type="button">Cancel<span class="MuiTouchRipple-root css-r3djoj-MuiTouchRipple-root" /></button><button class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedError MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorError MuiButton-root MuiButton-contained MuiButton-containedError MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorError css-1c26q6j-MuiButtonBase-root-MuiButton-root" tabindex="0" type="button">Delete</button></div></div></div>
|
|
|
|
|
|
|
|
|
|
79 | expect(container).toHaveFocus();
|
|
|
|
|
80 | await act(async () => { jest.advanceTimersByTime(1000); });
|
|
|
|
|
> 81 | expect(screen.getByRole('button', { name: 'Cancel' })).toHaveFocus();
|
|
|
|
|
| ^
|
|
|
|
|
82 | } finally {
|
|
|
|
|
83 | jest.useRealTimers();
|
|
|
|
|
84 | }
|
|
|
|
|
|
|
|
|
|
at Object.toHaveFocus (src/confirm.test.tsx:81:60)
|
|
|
|
|
|
|
|
|
|
Test Suites: 1 failed, 1 total
|
|
|
|
|
Tests: 1 failed, 3 passed, 4 total
|
|
|
|
|
Snapshots: 0 total
|
|
|
|
|
Time: 3.412 s
|
|
|
|
|
Ran all test suites matching confirm.test.tsx.
|