refactor: [UEPR-63] upgraded react and added react testing library

This commit is contained in:
Bogomil-Stoyanov 2025-01-27 22:04:43 +02:00
parent fcc15eb3c0
commit 35decccfba
4 changed files with 488 additions and 698 deletions

1141
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -53,6 +53,7 @@
"@babel/preset-react": "7.24.7",
"@commitlint/cli": "17.8.1",
"@commitlint/config-conventional": "17.8.1",
"@testing-library/react": "8.0.0",
"autoprefixer": "9.8.8",
"babel-eslint": "10.1.0",
"babel-jest": "29.7.0",
@ -61,8 +62,6 @@
"babel-plugin-transform-object-rest-spread": "6.26.0",
"canvas": "2.11.2",
"css-loader": "3.6.0",
"enzyme": "3.11.0",
"enzyme-adapter-react-16": "1.15.8",
"eslint": "8.57.1",
"eslint-config-scratch": "9.0.9",
"eslint-plugin-import": "2.30.0",
@ -79,18 +78,18 @@
"postcss-loader": "3.0.0",
"postcss-simple-vars": "5.0.2",
"raf": "3.4.1",
"react": "16.14.0",
"react-dom": "16.14.0",
"react-intl": "^6.6.8",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-intl": "6.8.9",
"react-intl-redux": "2.4.1",
"react-popover": "0.5.10",
"react-redux": "5.1.2",
"react-responsive": "5.0.0",
"react-redux": "8.0.0",
"react-responsive": "9.0.0",
"react-style-proptype": "3.2.2",
"react-test-renderer": "16.14.0",
"react-test-renderer": "18.2.0",
"react-tooltip": "4.5.1",
"redux": "3.7.2",
"redux-mock-store": "1.5.4",
"redux": "4.0.0",
"redux-mock-store": "1.5.5",
"redux-throttle": "0.1.1",
"regenerator-runtime": "0.13.9",
"rimraf": "2.7.1",
@ -114,9 +113,9 @@
},
"jest": {
"setupFiles": [
"raf/polyfill",
"<rootDir>/test/helpers/enzyme-setup.js"
"raf/polyfill"
],
"testEnvironment": "jsdom",
"testURL": "http://localhost",
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/test/__mocks__/fileMock.js",

View file

@ -182,10 +182,12 @@ class Playground extends React.Component {
}
}
ReactDOM.render((
const root = ReactDOM.createRoot(appTarget);
root.render(
<Provider store={store}>
<IntlProvider>
<Playground />
</IntlProvider>
</Provider>
), appTarget);
);

View file

@ -1,17 +1,21 @@
/* eslint-env jest */
import React from 'react'; // eslint-disable-line no-unused-vars
import {shallow} from 'enzyme';
import Button from '../../../src/components/button/button.jsx'; // eslint-disable-line no-unused-vars, max-len
/* eslint-disable no-unused-vars */
import React from 'react';
import {render, fireEvent} from '@testing-library/react';
import Button from '../../../src/components/button/button.jsx';
describe('Button', () => {
test('triggers callback when clicked', () => {
const onClick = jest.fn();
const componentShallowWrapper = shallow(
const {getByText} = render(
<Button onClick={onClick}>
{'Button'}
</Button>
);
componentShallowWrapper.simulate('click');
const buttonElement = getByText('Button');
fireEvent.click(buttonElement);
expect(onClick).toHaveBeenCalled();
});
});
});