Add unit test

Author: fzaninotto

packages/ra-ui-materialui/src/layout/Notification.spec.tsx

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { render, screen, waitFor } from '@testing-library/react';
+
+import { ConsecutiveUndoable } from './Notification.stories';
+
+describe('<Notification />', () => {
+    it('should confirm the first undoable notification when a second one starts', async () => {
+        const deleteOne = jest
+            .fn()
+            .mockImplementation((_resource, { id }) =>
+                Promise.resolve({ data: { id } })
+            );
+        const dataProvider = { delete: deleteOne } as any;
+        render(<ConsecutiveUndoable dataProvider={dataProvider} />);
+        await screen.findByText('Post deleted');
+        expect(deleteOne).toHaveBeenCalledTimes(0);
+        await waitFor(() => {
+            expect(deleteOne).toHaveBeenCalledTimes(1);
+        });
+        screen.getByText('ra.action.undo').click();
+        expect(deleteOne).toHaveBeenCalledTimes(1);
+    });
+});

packages/ra-ui-materialui/src/layout/Notification.stories.tsx

@@ -1,5 +1,10 @@
 import * as React from 'react';
-import { useNotify, NotificationContextProvider } from 'ra-core';
+import {
+    useNotify,
+    NotificationContextProvider,
+    useDelete,
+    CoreAdminContext,
+} from 'ra-core';
 import { Alert } from '@mui/material';
 
 import { Notification } from './Notification';
@@ -149,3 +154,37 @@ export const CustomNode = () => (
         <CustomNodeNotification />
     </Wrapper>
 );
+
+const DeletePosts = () => {
+    const [deleteOne] = useDelete();
+    const notify = useNotify();
+    const deletePost = id => {
+        deleteOne(
+            'posts',
+            { id },
+            {
+                mutationMode: 'undoable',
+                onSuccess: () => notify('Post deleted', { undoable: true }),
+            }
+        );
+    };
+    React.useEffect(() => {
+        deletePost(1);
+        setTimeout(deletePost, 100, 2);
+    }, []); // eslint-disable-line react-hooks/exhaustive-deps
+    return null;
+};
+
+export const ConsecutiveUndoable = ({
+    dataProvider = {
+        delete: async (_resource, { id }) => {
+            console.log('delete post', id);
+            return { data: { id } };
+        },
+    } as any,
+}) => (
+    <CoreAdminContext dataProvider={dataProvider}>
+        <DeletePosts />
+        <Notification />
+    </CoreAdminContext>
+);