Cyrillic

examples/demo/package.json

@@ -46,7 +46,7 @@
     "devDependencies": {
         "@types/fetch-mock": "^7.3.2",
         "@types/classnames": "^2.2.9",
-        "@types/jest": "^24.0.23",
+        "@types/jest": "^26.0.19",
         "@types/node": "^12.12.14",
         "@types/query-string": "5.1.0",
         "@types/react": "^16.9.13",

examples/demo/src/layout/themes.ts

@@ -15,6 +15,32 @@ export const darkTheme = {
                 backgroundColor: '#616161e6',
             },
         },
+        MuiButtonBase: {
+            root: {
+                '&:hover:active::after': {
+                    // recreate a static ripple color
+                    // use the currentColor to make it work both for outlined and contained buttons
+                    // but to dim the background without dimming the text,
+                    // put another element on top with a limited opacity
+                    content: '""',
+                    display: 'block',
+                    width: '100%',
+                    height: '100%',
+                    position: 'absolute',
+                    top: 0,
+                    right: 0,
+                    backgroundColor: 'currentColor',
+                    opacity: 0.3,
+                    borderRadius: 'inherit',
+                },
+            },
+        },
+    },
+    props: {
+        MuiButtonBase: {
+            // disable ripple for perf reasons
+            disableRipple: true,
+        },
     },
 };
 
@@ -62,6 +88,26 @@ export const lightTheme = {
                 boxShadow: 'none',
             },
         },
+        MuiButtonBase: {
+            root: {
+                '&:hover:active::after': {
+                    // recreate a static ripple color
+                    // use the currentColor to make it work both for outlined and contained buttons
+                    // but to dim the background without dimming the text,
+                    // put another element on top with a limited opacity
+                    content: '""',
+                    display: 'block',
+                    width: '100%',
+                    height: '100%',
+                    position: 'absolute',
+                    top: 0,
+                    right: 0,
+                    backgroundColor: 'currentColor',
+                    opacity: 0.3,
+                    borderRadius: 'inherit',
+                },
+            },
+        },
         MuiAppBar: {
             colorSecondary: {
                 color: '#808080',
@@ -85,4 +131,10 @@ export const lightTheme = {
             },
         },
     },
+    props: {
+        MuiButtonBase: {
+            // disable ripple for perf reasons
+            disableRipple: true,
+        },
+    },
 };

package.json

@@ -41,7 +41,7 @@
         }
     },
     "devDependencies": {
-        "@types/jest": "^24.0.13",
+        "@types/jest": "^26.0.19",
         "@types/react": "^16.9.0",
         "@types/react-redux": "^7.1.1",
         "@typescript-eslint/eslint-plugin": "^3.10.1",
@@ -63,14 +63,14 @@
         "express": "~4.16.3",
         "full-icu": "~1.3.1",
         "husky": "^2.3.0",
-        "jest": "^24.7.0",
+        "jest": "^26.6.3",
         "lerna": "~2.9.1",
         "lint-staged": "^8.1.7",
         "lolex": "~2.3.2",
         "mutationobserver-shim": "^0.3.3",
         "prettier": "~2.1.1",
         "raf": "~3.4.1",
-        "ts-jest": "^24.0.0",
+        "ts-jest": "^26.4.4",
         "wait-on": "^3.2.0",
         "whatwg-fetch": "^3.0.0"
     },
@@ -82,4 +82,4 @@
     "dependencies": {
         "typescript": "^4.0.2"
     }
-}
+}

packages/ra-core/package.json

@@ -65,7 +65,7 @@
         "redux-saga": "^1.0.0"
     },
     "dependencies": {
-        "@testing-library/react": "^8.0.7",
+        "@testing-library/react": "^11.2.2",
         "classnames": "~2.2.5",
         "date-fns": "^1.29.0",
         "eventemitter3": "^3.0.0",

packages/ra-core/src/actions/notificationActions.ts

@@ -1,6 +1,6 @@
 export const SHOW_NOTIFICATION = 'RA/SHOW_NOTIFICATION';
 
-export type NotificationType = 'info' | 'warning' | 'error';
+export type NotificationType = 'success' | 'info' | 'warning' | 'error';
 
 interface NotificationOptions {
     // The duration in milliseconds the notification is shown

packages/ra-core/src/auth/Authenticated.spec.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import expect from 'expect';
-import { cleanup, wait } from '@testing-library/react';
+import { wait } from '@testing-library/react';
 
 import Authenticated from './Authenticated';
 import AuthContext from './AuthContext';
@@ -10,8 +10,6 @@ import { createMemoryHistory } from 'history';
 import { Router } from 'react-router-dom';
 
 describe('<Authenticated>', () => {
-    afterEach(cleanup);
-
     const Foo = () => <div>Foo</div>;
 
     it('should render its child by default', async () => {

packages/ra-core/src/auth/useAuthState.spec.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import expect from 'expect';
-import { cleanup, wait } from '@testing-library/react';
+import { wait } from '@testing-library/react';
 
 import useAuthState from './useAuthState';
 import AuthContext from './AuthContext';
@@ -20,8 +20,6 @@ const stateInpector = state => (
 );
 
 describe('useAuthState', () => {
-    afterEach(cleanup);
-
     it('should return a loading state on mount', () => {
         const { queryByText } = renderWithRedux(
             <UseAuth>{stateInpector}</UseAuth>

packages/ra-core/src/auth/useAuthenticated.spec.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import expect from 'expect';
-import { cleanup, wait } from '@testing-library/react';
+import { wait } from '@testing-library/react';
 
 import Authenticated from './Authenticated';
 import AuthContext from './AuthContext';
@@ -10,8 +10,6 @@ import { createMemoryHistory } from 'history';
 import { Router } from 'react-router-dom';
 
 describe('useAuthenticated', () => {
-    afterEach(cleanup);
-
     const Foo = () => <div>Foo</div>;
 
     it('should call authProvider on mount', () => {

packages/ra-core/src/auth/useCheckAuth.spec.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useState, useEffect } from 'react';
 import expect from 'expect';
-import { render, cleanup, wait } from '@testing-library/react';
+import { render, wait } from '@testing-library/react';
 
 import useCheckAuth from './useCheckAuth';
 import AuthContext from './AuthContext';
@@ -60,7 +60,6 @@ describe('useCheckAuth', () => {
     afterEach(() => {
         logout.mockClear();
         notify.mockClear();
-        cleanup();
     });
 
     it('should not logout if has credentials', async () => {

packages/ra-core/src/auth/useLogoutIfAccessDenied.spec.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useState, useEffect } from 'react';
 import expect from 'expect';
-import { render, cleanup, wait } from '@testing-library/react';
+import { render, wait } from '@testing-library/react';
 
 import useLogoutIfAccessDenied from './useLogoutIfAccessDenied';
 import AuthContext from './AuthContext';
@@ -55,7 +55,6 @@ describe('useLogoutIfAccessDenied', () => {
     afterEach(() => {
         logout.mockClear();
         notify.mockClear();
-        cleanup();
     });
 
     it('should not logout if passed no error', async () => {

packages/ra-core/src/auth/usePermissions.spec.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import expect from 'expect';
-import { cleanup, wait } from '@testing-library/react';
+import { wait } from '@testing-library/react';
 
 import usePermissions from './usePermissions';
 import AuthContext from './AuthContext';
@@ -21,8 +21,6 @@ const stateInpector = state => (
 );
 
 describe('usePermissions', () => {
-    afterEach(cleanup);
-
     it('should return a loading state on mount', () => {
         const { queryByText } = renderWithRedux(
             <UsePermissions>{stateInpector}</UsePermissions>

packages/ra-core/src/controller/details/useCreateController.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import expect from 'expect';
-import { act, cleanup } from '@testing-library/react';
+import { act } from '@testing-library/react';
 
 import { getRecord } from './useCreateController';
 import { CreateController } from './CreateController';
@@ -9,8 +9,6 @@ import { DataProviderContext } from '../../dataProvider';
 import { DataProvider } from '../../types';
 
 describe('useCreateController', () => {
-    afterEach(cleanup);
-
     describe('getRecord', () => {
         const location = {
             pathname: '/foo',

packages/ra-core/src/controller/details/useEditController.spec.tsx

@@ -1,15 +1,13 @@
 import * as React from 'react';
 import expect from 'expect';
-import { act, cleanup, wait } from '@testing-library/react';
+import { act, wait } from '@testing-library/react';
 
 import { EditController } from './EditController';
 import renderWithRedux from '../../util/renderWithRedux';
 import { DataProviderContext } from '../../dataProvider';
 import { DataProvider } from '../../types';
 
 describe('useEditController', () => {
-    afterEach(cleanup);
-
     const defaultProps = {
         basePath: '',
         hasCreate: true,

packages/ra-core/src/controller/field/ReferenceArrayFieldController.spec.tsx

@@ -1,13 +1,11 @@
 import * as React from 'react';
-import { cleanup } from '@testing-library/react';
 import expect from 'expect';
 
 import ReferenceArrayFieldController from './ReferenceArrayFieldController';
 import { DataProviderContext } from '../../dataProvider';
 import renderWithRedux from '../../util/renderWithRedux';
 
 describe('<ReferenceArrayFieldController />', () => {
-    afterEach(cleanup);
     it('should set the loaded prop to false when related records are not yet fetched', () => {
         const children = jest.fn().mockReturnValue('child');
 

packages/ra-core/src/controller/field/ReferenceFieldController.spec.tsx

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { cleanup } from '@testing-library/react';
 import expect from 'expect';
 
 import ReferenceFieldController from './ReferenceFieldController';
@@ -13,7 +12,6 @@ const defaultState = {
 };
 
 describe('<ReferenceFieldController />', () => {
-    afterEach(cleanup);
     it('should call the CRUD_GET_MANY action on mount if reference source is defined', async () => {
         const dataProvider = {
             getMany: jest.fn(() =>

packages/ra-core/src/controller/field/ReferenceManyFieldController.spec.tsx

@@ -1,12 +1,11 @@
 import * as React from 'react';
-import { cleanup, wait } from '@testing-library/react';
+import { wait } from '@testing-library/react';
 import expect from 'expect';
 
 import ReferenceManyFieldController from './ReferenceManyFieldController';
 import renderWithRedux from '../../util/renderWithRedux';
 
 describe('<ReferenceManyFieldController />', () => {
-    afterEach(cleanup);
     it('should set loaded to false when related records are not yet fetched', async () => {
         const children = jest.fn().mockReturnValue('children');
         const { dispatch } = renderWithRedux(

packages/ra-core/src/controller/input/ReferenceArrayInputController.spec.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import expect from 'expect';
-import { cleanup, wait, fireEvent } from '@testing-library/react';
+import { wait, fireEvent } from '@testing-library/react';
 import ReferenceArrayInputController from './ReferenceArrayInputController';
 import { renderWithRedux } from '../../util';
 import { CRUD_GET_MATCHING, CRUD_GET_MANY } from '../../../lib';
@@ -15,8 +15,6 @@ describe('<ReferenceArrayInputController />', () => {
         source: 'tag_ids',
     };
 
-    afterEach(cleanup);
-
     it('should set loading to true as long as there are no references fetched and no selected references', () => {
         const children = jest.fn(({ loading }) => (
             <div>{loading.toString()}</div>

packages/ra-core/src/controller/input/ReferenceInputController.spec.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useState, useCallback } from 'react';
-import { cleanup, fireEvent, wait } from '@testing-library/react';
+import { fireEvent, wait } from '@testing-library/react';
 import omit from 'lodash/omit';
 import expect from 'expect';
 
@@ -19,8 +19,6 @@ describe('<ReferenceInputController />', () => {
         source: 'post_id',
     };
 
-    afterEach(cleanup);
-
     const dataProvider = {
         getMany: jest.fn(() =>
             Promise.resolve({ data: [{ id: 1, title: 'foo' }] })

packages/ra-core/src/controller/input/useGetMatchingReferences.spec.tsx

@@ -1,6 +1,5 @@
 import renderHook from '../../util/renderHook';
 import useMatchingReferences from './useGetMatchingReferences';
-import { cleanup } from '@testing-library/react';
 
 describe('useMatchingReferences', () => {
     const defaultProps = {
@@ -16,8 +15,6 @@ describe('useMatchingReferences', () => {
         referenceSource: undefined,
     };
 
-    afterEach(cleanup);
-
     it('should fetch matchingReferences only on mount', () => {
         const { dispatch } = renderHook(
             () => {

packages/ra-core/src/controller/useListContext.spec.tsx

@@ -1,13 +1,11 @@
 import * as React from 'react';
 import expect from 'expect';
-import { render, cleanup } from '@testing-library/react';
+import { render } from '@testing-library/react';
 
 import ListContext from './ListContext';
 import useListContext from './useListContext';
 
 describe('useListContext', () => {
-    afterEach(cleanup);
-
     const NaiveList = props => {
         const { ids, data } = useListContext(props);
         return (

packages/ra-core/src/controller/useListController.spec.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import expect from 'expect';
-import { fireEvent, wait, cleanup } from '@testing-library/react';
+import { fireEvent, wait } from '@testing-library/react';
 import lolex from 'lolex';
 import TextField from '@material-ui/core/TextField/TextField';
 
@@ -205,7 +205,6 @@ describe('useListController', () => {
 
         afterEach(() => {
             clock.uninstall();
-            cleanup();
         });
     });
     describe('showFilter', () => {