applied review

Author: WiXSL

packages/ra-core/src/dataProvider/useDelete.spec.tsx

@@ -77,8 +77,33 @@ describe('useDelete', () => {
     });
 
     it('uses the latest declaration time mutationMode', async () => {
+        const posts = [
+            { id: 1, title: 'Hello' },
+            { id: 2, title: 'World' },
+        ];
+        let resolveDelete: (() => void) | undefined;
+        const dataProvider = {
+            getList: () =>
+                Promise.resolve({
+                    data: posts,
+                    total: posts.length,
+                }),
+            delete: jest.fn((_, params) => {
+                return new Promise(resolve => {
+                    resolveDelete = () => {
+                        const index = posts.findIndex(
+                            post => post.id === params.id
+                        );
+                        if (index !== -1) {
+                            posts.splice(index, 1);
+                        }
+                        resolve({ data: params.previousData });
+                    };
+                });
+            }),
+        } as any;
         // This story uses the pessimistic mode by default
-        render(<MutationMode />);
+        render(<MutationMode dataProvider={dataProvider} />);
         await waitFor(() => new Promise(resolve => setTimeout(resolve, 0)));
         fireEvent.click(screen.getByText('Change mutation mode to optimistic'));
         fireEvent.click(screen.getByText('Delete first post'));
@@ -89,36 +114,38 @@ describe('useDelete', () => {
             expect(screen.queryByText('World')).not.toBeNull();
             expect(screen.queryByText('mutating')).not.toBeNull();
         });
-        await waitFor(
-            () => {
-                expect(screen.queryByText('success')).not.toBeNull();
-                expect(screen.queryByText('Hello')).toBeNull();
-                expect(screen.queryByText('World')).not.toBeNull();
-                expect(screen.queryByText('mutating')).toBeNull();
-            },
-            { timeout: 3000 }
-        );
+        resolveDelete?.();
+        await waitFor(() => {
+            expect(screen.queryByText('success')).not.toBeNull();
+            expect(screen.queryByText('Hello')).toBeNull();
+            expect(screen.queryByText('World')).not.toBeNull();
+            expect(screen.queryByText('mutating')).toBeNull();
+        });
     });
 
     it('uses the latest declaration time params', async () => {
         const posts = [
             { id: 1, title: 'Hello' },
             { id: 2, title: 'World' },
         ];
+        let resolveDelete: (() => void) | undefined;
         const dataProvider = {
-            getList: () => {
-                return Promise.resolve({
+            getList: () =>
+                Promise.resolve({
                     data: posts,
                     total: posts.length,
-                });
-            },
+                }),
             delete: jest.fn((_, params) => {
                 return new Promise(resolve => {
-                    setTimeout(() => {
-                        const index = posts.findIndex(p => p.id === params.id);
-                        posts.splice(index, 1);
+                    resolveDelete = () => {
+                        const index = posts.findIndex(
+                            post => post.id === params.id
+                        );
+                        if (index !== -1) {
+                            posts.splice(index, 1);
+                        }
                         resolve({ data: params.previousData });
-                    }, 1000);
+                    };
                 });
             }),
         } as any;
@@ -134,15 +161,13 @@ describe('useDelete', () => {
             expect(screen.queryByText('World')).not.toBeNull();
             expect(screen.queryByText('mutating')).not.toBeNull();
         });
-        await waitFor(
-            () => {
-                expect(screen.queryByText('success')).not.toBeNull();
-                expect(screen.queryByText('Hello')).toBeNull();
-                expect(screen.queryByText('World')).not.toBeNull();
-                expect(screen.queryByText('mutating')).toBeNull();
-            },
-            { timeout: 3000 }
-        );
+        resolveDelete?.();
+        await waitFor(() => {
+            expect(screen.queryByText('success')).not.toBeNull();
+            expect(screen.queryByText('Hello')).toBeNull();
+            expect(screen.queryByText('World')).not.toBeNull();
+            expect(screen.queryByText('mutating')).toBeNull();
+        });
 
         expect(dataProvider.delete).toHaveBeenCalledWith('posts', {
             id: 1,

packages/ra-core/src/dataProvider/useDelete.stories.tsx

@@ -20,12 +20,16 @@ import { useTakeUndoableMutation } from './undo';
 
 export default { title: 'ra-core/dataProvider/useDelete' };
 
-export const MutationMode = () => {
+export const MutationMode = ({
+    dataProvider,
+}: {
+    dataProvider?: DataProvider;
+}) => {
     const posts = [
         { id: 1, title: 'Hello' },
         { id: 2, title: 'World' },
     ];
-    const dataProvider = {
+    const defaultDataProvider = {
         getList: () => {
             return Promise.resolve({
                 data: posts,
@@ -45,7 +49,7 @@ export const MutationMode = () => {
     return (
         <CoreAdminContext
             queryClient={new QueryClient()}
-            dataProvider={dataProvider}
+            dataProvider={dataProvider ?? defaultDataProvider}
         >
             <MutationModeCore />
         </CoreAdminContext>

packages/ra-ui-materialui/src/button/SelectAllButton.spec.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { fireEvent, render, screen } from '@testing-library/react';
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import { Basic, Label, Limit, StoreKey } from './SelectAllButton.stories';
 
 describe('<SelectAllButton />', () => {
@@ -18,8 +18,12 @@ describe('<SelectAllButton />', () => {
         await screen.findByRole('button', { name: 'Select all' });
         fireEvent.click(screen.getAllByRole('checkbox')[1]);
         await screen.findByText('9 items selected');
-        expect(screen.queryByRole('button', { name: 'Select all' })).toBeNull();
-    }, 10000);
+        await waitFor(() => {
+            expect(
+                screen.queryByRole('button', { name: 'Select all' })
+            ).toBeNull();
+        });
+    });
 
     it('should select all items', async () => {
         render(<Basic />);