Set up tests after eject of the standard CRA

Start with setupTest.js and the test importing App.js, then inspect the added rule in config/webpack.config.js and the failing import from @ui5/webcomponents/dist/json-imports/i18n.js. Run the test after the eject configuration is applied; done means the test loads without the module parse error and the reported asset and i18n warnings remain addressed.

Hello Team,

I'm facing the following problem:
Steps to reproduce:

1. npx create-react-app </app_name>
2. npm i -S @ui5/webcomponents-react
3. Follow the instructions for the tests Set up Tests
4. npm i -D enzyme enzyme-adapter-react-16
5. setupTest.js looks like this:

import '@testing-library/jest-dom/extend-expect';
import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

6. App.js looks like this:

import React from 'react';

import '@ui5/webcomponents/dist/json-imports/i18n';

import '@ui5/webcomponents/dist/json-imports/Themes';
import '@ui5/webcomponents-fiori/dist/json-imports/Themes';

import './App.css';
import { Button, ShellBar, ThemeProvider } from '@ui5/webcomponents-react';

function App() {
  return (
    <div>
      <ThemeProvider withToastContainer>
        <ShellBar />
        <Button>Click Me!</Button>
      </ThemeProvider>
    </div>
  );
}

export default App;

7. The test looks like this

import React from 'react';
import App from './App';
import { shallow } from 'enzyme'

test('renders learn react link', () => {
  let shallow1 = shallow(<App />);
});

So far so good the test starts with 100 warnings in the console about the i18n (by the way your app is also starting with them ui5-webcomponents-sample-react ) but the test is loaded and so on.

so you are a suggesting to eject from the standard CRA and to continue on our own and to add in the config/webpack.config.js the following in order to solve the warnings:

 {
              test: [/cldr\/.*\.json$/, /i18n\/.*\.json$/, /assets\/.*\.json$/],
              loader: 'file-loader',
              options: {
                name: 'static/media/[name].[hash:8].[ext]',
              },
              type: 'javascript/auto',
            }

so far so good the warnings are gone from the console and all the assets are now loaded fine.
But the test is not working any mode I am getting the following error:

node_modules/@ui5/webcomponents/dist/json-imports/i18n.js:1
({"Object.":function(module,exports,require,__dirname,__filename,global,jest){import { registerI18nBundle } from "@ui5/webcomponents-base/dist/asset-registries/i18n.js";

Which was solved before with Set up Tests

So please advice what I'm are doing wrong or what I'm missing in the whole configuration.

Thanks & Regards,
Ivan