ra-core causes @testing-library/react to be bundled in prod

What you were expecting:

Production bundle of an app containing react-admin to not contain @testing-library/react and its dependencies.

What happened instead:

@testing-library/react was included in a production bundle. As a side-effect, IE11 broke due to pretty-format (a dependency of @testing-library/react) containing code that relies on Symbol, which is not available in IE11.

Steps to reproduce:

Unfortunately none at the moment as I cannot share the project and this doesn’t happen in a create-react-app project (which perhaps has a more sophisticated code elimination). Might be able to create a minimal test case later.

Related code:

I fixed this build by locally patching util/index.js at this point to not import and re-export renderWithRedux (which in turn depends on @testing-library/react).

Files needing renderWithRedux seem to be needed during dev only:

~/.../node_modules/ra-core$ ag 'import { renderWithRedux }'
src/i18n/useSetLocale.spec.js
9:import { renderWithRedux } from '../util';

src/i18n/useTranslate.spec.tsx
8:import { renderWithRedux } from '../util';

src/form/useChoices.spec.tsx
5:import { renderWithRedux } from '../util';

src/form/ValidationError.spec.tsx
8:import { renderWithRedux } from '../util';

src/controller/input/ReferenceArrayInputController.spec.tsx
5:import { renderWithRedux } from '../../util';

They could be fixed by having them import from ../util/renderWithRedux directly. Happy to provide a PR if that sounds sensible.

Also, @testing-library/react is reported in ra-core’s package.json dependencies instead of devDependencies.

[bard]

The smallest option would be:

modified   packages/ra-ui-materialui/src/input/CheckboxGroupInput.spec.tsx
@@ -3,267 +3,268 @@ import expect from 'expect';
 import CheckboxGroupInput from './CheckboxGroupInput';
 import { render, cleanup, fireEvent } from '@testing-library/react';
 import { Form } from 'react-final-form';
-import { renderWithRedux, TestTranslationProvider } from 'ra-core';
+import { TestTranslationProvider } from 'ra-core';
+import renderWithRedux from 'ra-core/src/util/renderWithRedux';

Though for consistency and clarity I guess I would do:

modified   packages/ra-ui-materialui/src/input/CheckboxGroupInput.spec.tsx
@@ -3,267 +3,267 @@ import expect from 'expect';
 import CheckboxGroupInput from './CheckboxGroupInput';
 import { render, cleanup, fireEvent } from '@testing-library/react';
 import { Form } from 'react-final-form';
-import { renderWithRedux, TestTranslationProvider } from 'ra-core';
+import { renderWithRedux, TestTranslationProvider } from 'ra-core/src/devUtils';

[fzaninotto]

Fixed by #5846