Skip to content

Commit 7044836

Browse files
rvsiarvsia
committed
Fix mui 5 tests
1 parent 1a1c619 commit 7044836

File tree

8 files changed

+53
-80
lines changed

8 files changed

+53
-80
lines changed

‎packages/mui-component-mapper/src/radio/radio.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const classes = {
1616

1717
const StyledFormFieldGrid = styled(FormFieldGrid)(() => ({
1818
[`&.${classes.grid}`]: {
19-
'&:first-child': {
19+
'&:first-of-type': {
2020
marginTop: 8,
2121
},
2222
},

‎packages/mui-component-mapper/src/sub-form/sub-form.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ const SubForm = ({
4747
</Typography>
4848
</Grid>
4949
)}
50-
<Grid item xs={12} container {...ItemsGridProps}>
50+
<Grid item xs={12} container rowSpacing={2} {...ItemsGridProps}>
5151
{renderForm(fields)}
5252
</Grid>
5353
</StyledGrid>

‎packages/mui-component-mapper/src/tabs/tabs.js

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,19 @@ const FormTabs = ({ fields, AppBarProps, TabsProps, TabProps, FormFieldGridProps
1919
))}
2020
</Tabs>
2121
</AppBar>
22-
<Grid container item xs={12} spacing={2} sx={{ mt: 1 }} {...GridItemProps}>
23-
{formOptions.renderForm(fields[activeTab].fields)}
24-
</Grid>
22+
{fields.map(({ fields, name }, index) => (
23+
<Grid
24+
key={name || index}
25+
container
26+
item
27+
xs={12}
28+
rowSpacing={2}
29+
sx={{ mt: 1, ...(index !== activeTab && { display: 'none' }) }}
30+
{...GridItemProps}
31+
>
32+
{formOptions.renderForm(fields)}
33+
</Grid>
34+
))}
2535
</FormFieldGrid>
2636
);
2737
};
@@ -44,3 +54,15 @@ FormTabs.defaultProps = {
4454
};
4555

4656
export default FormTabs;
57+
58+
/*
59+
{fields.map(({ fields }, index) =>
60+
index === activeTab ? (
61+
formOptions.renderForm(fields)
62+
) : (
63+
<Grid container item xs={12} sx={{ display: 'none' }}>
64+
{formOptions.renderForm(fields)}
65+
</Grid>
66+
)
67+
)}
68+
*/

‎packages/mui-component-mapper/src/tests/form-fields.test.js

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@ import { act } from 'react-dom/test-utils';
44
import { FormLabel } from '@mui/material';
55
import MultipleChoiceListCommon from '@data-driven-forms/common/multiple-choice-list';
66
import { FormRenderer, componentTypes, validatorTypes } from '@data-driven-forms/react-form-renderer';
7+
import LocalizationProvider from '@mui/lab/LocalizationProvider';
8+
import AdapterDateFns from '@mui/lab/AdapterDateFns';
9+
710
import Checkbox from '../checkbox';
811

912
import RenderWithProvider from '../../../../__mocks__/with-provider';
@@ -12,14 +15,16 @@ import componentMapper from '../component-mapper';
1215
import { Radio } from '@mui/material';
1316

1417
const RendererWrapper = ({ schema = { fields: [] }, ...props }) => (
15-
<FormRenderer
16-
onSubmit={jest.fn()}
17-
FormTemplate={(props) => <FormTemplate {...props} />}
18-
schema={schema}
19-
componentMapper={componentMapper}
20-
subscription={{ submitFailed: true }}
21-
{...props}
22-
/>
18+
<LocalizationProvider dateAdapter={AdapterDateFns}>
19+
<FormRenderer
20+
onSubmit={jest.fn()}
21+
FormTemplate={(props) => <FormTemplate {...props} />}
22+
schema={schema}
23+
componentMapper={componentMapper}
24+
subscription={{ submitFailed: true }}
25+
{...props}
26+
/>
27+
</LocalizationProvider>
2328
);
2429

2530
describe('formFields', () => {
@@ -172,7 +177,7 @@ describe('formFields', () => {
172177
};
173178
const wrapper = mount(<RendererWrapper schema={{ fields: [requiredField] }} />);
174179

175-
expect(wrapper.find('.MuiFormLabel-asterisk')).toHaveLength(1);
180+
expect(wrapper.find('span.MuiFormLabel-asterisk')).toHaveLength(1);
176181
});
177182

178183
it('renders isDisabled', () => {
@@ -184,8 +189,6 @@ describe('formFields', () => {
184189

185190
if (component === componentTypes.TEXTAREA) {
186191
expect(wrapper.find('textarea').first().props().disabled).toEqual(true);
187-
} else if (component === componentTypes.SLIDER) {
188-
expect(wrapper.find('.Mui-disabled')).toHaveLength(2);
189192
} else {
190193
expect(wrapper.find('input').first().props().disabled).toEqual(true);
191194
}
@@ -201,7 +204,7 @@ describe('formFields', () => {
201204
if (component === componentTypes.TEXTAREA) {
202205
expect(wrapper.find('textarea').first().props().readOnly).toEqual(true);
203206
} else if (component === componentTypes.SLIDER) {
204-
expect(wrapper.find('.Mui-disabled')).toHaveLength(2);
207+
expect(wrapper.find('input').first().props().disabled).toEqual(true);
205208
} else {
206209
expect(wrapper.find('input').first().props().readOnly).toEqual(true);
207210
}

‎packages/mui-component-mapper/src/tests/wizard.test.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -65,12 +65,12 @@ describe('wizard', () => {
6565
it('simple next and back', () => {
6666
const wrapper = mount(<FormRenderer {...initialProps} />);
6767

68-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('AWS step');
68+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('AWS step');
6969

7070
wrapper.find(Button).last().simulate('click'); // disabled next
7171
wrapper.update();
7272

73-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('AWS step');
73+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('AWS step');
7474

7575
wrapper.find('input').instance().value = 'something';
7676
wrapper.find('input').simulate('change');
@@ -79,12 +79,12 @@ describe('wizard', () => {
7979
wrapper.find(Button).last().simulate('click'); // next
8080
wrapper.update();
8181

82-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('Summary');
82+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('Summary');
8383

8484
wrapper.find(Button).at(1).simulate('click'); // back
8585
wrapper.update();
8686

87-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('AWS step');
87+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('AWS step');
8888
});
8989

9090
it('conditional next', () => {
@@ -146,7 +146,7 @@ describe('wizard', () => {
146146

147147
const wrapper = mount(<FormRenderer {...initialProps} schema={schema} />);
148148

149-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('First step');
149+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('First step');
150150

151151
wrapper.find('input').instance().value = 'aws';
152152
wrapper.find('input').simulate('change');
@@ -155,7 +155,7 @@ describe('wizard', () => {
155155
wrapper.find(Button).last().simulate('click'); // next
156156
wrapper.update();
157157

158-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('Last step');
158+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('Last step');
159159
expect(wrapper.find('input').instance().name).toEqual('summary');
160160

161161
wrapper
@@ -164,7 +164,7 @@ describe('wizard', () => {
164164
.simulate('click');
165165
wrapper.update();
166166

167-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('First step');
167+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('First step');
168168

169169
wrapper.find('input').instance().value = 'google';
170170
wrapper.find('input').simulate('change');
@@ -176,7 +176,7 @@ describe('wizard', () => {
176176
.simulate('click');
177177
wrapper.update();
178178

179-
expect(wrapper.find('.MuiStepLabel-active').first().text()).toEqual('Last step');
179+
expect(wrapper.find('.MuiStepLabel-label .Mui-active').first().text()).toEqual('Last step');
180180
expect(wrapper.find('input').instance().name).toEqual('googlesummary');
181181
});
182182

‎packages/mui-component-mapper/src/time-picker/time-picker.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import FormFieldGrid from '../form-field-grid/form-field-grid';
66
import { validationError } from '../validation-error/validation-error';
77
import { meta, input } from '@data-driven-forms/common/prop-types-templates';
88
import { useFieldApi } from '@data-driven-forms/react-form-renderer';
9-
import { TextField } from '@material-ui/core';
9+
import { TextField } from '@mui/material';
1010

1111
const TimePicker = (props) => {
1212
const {

‎packages/react-renderer-demo/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,8 @@
3838
"@material-ui/styles": "^4.10.0",
3939
"@mdx-js/loader": "^1.6.22",
4040
"@mdx-js/react": "^1.6.22",
41-
"@mui/icons-material": "^5.0.3",
42-
"@mui/material": "^5.0.3",
41+
"@mui/icons-material": "^5.0.4",
42+
"@mui/material": "^5.0.4",
4343
"@mui/styles": "^5.0.1",
4444
"@next/bundle-analyzer": "^11.1.2",
4545
"@next/mdx": "^11.1.2",

‎yarn.lock

Lines changed: 0 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -2830,18 +2830,6 @@
28302830
resolved "https://registry.yarnpkg.com/@mdx-js/util/-/util-1.6.22.tgz#219dfd89ae5b97a8801f015323ffa4b62f45718b"
28312831
integrity sha512-H1rQc1ZOHANWBvPcW+JpGwr+juXSxM8Q8YCkm3GhZd8REu1fHR3z99CErO1p9pkcfcxZnMdIZdIsXkOHY0NilA==
28322832

2833-
"@mui/[email protected]":
2834-
version "5.0.0-alpha.50"
2835-
resolved "https://registry.yarnpkg.com/@mui/core/-/core-5.0.0-alpha.50.tgz#055b7ccf8557f849e8e61a39a8e3943f8abad9b0"
2836-
integrity sha512-szmmzbyAjEQku17IoEWs7t77n0Kr4zVnT5fREfMd+CnCA4YDifr68ccGJfWaeoGp5Zw/JmfKjQJXLY4GgT6i/g==
2837-
dependencies:
2838-
"@babel/runtime" "^7.15.4"
2839-
"@emotion/is-prop-valid" "^1.1.0"
2840-
"@mui/utils" "^5.0.1"
2841-
clsx "^1.1.1"
2842-
prop-types "^15.7.2"
2843-
react-is "^17.0.2"
2844-
28452833
"@mui/[email protected]":
28462834
version "5.0.0-alpha.51"
28472835
resolved "https://registry.yarnpkg.com/@mui/core/-/core-5.0.0-alpha.51.tgz#3c5f715a0ee5ab123e0987047b8e4651964ecc54"
@@ -2854,13 +2842,6 @@
28542842
prop-types "^15.7.2"
28552843
react-is "^17.0.2"
28562844

2857-
"@mui/icons-material@^5.0.3":
2858-
version "5.0.3"
2859-
resolved "https://registry.yarnpkg.com/@mui/icons-material/-/icons-material-5.0.3.tgz#2a9d4f9078f375cef40f63a240b59cefa4a27eec"
2860-
integrity sha512-Lktn+4GNnXdVrOCUUvNNvOD9VyrGazWBsJy0BQeQgBe/+IjFMdlcNrDEUIlGlA5ZXOq7Mr/Mv9Os02mgF65jiw==
2861-
dependencies:
2862-
"@babel/runtime" "^7.15.4"
2863-
28642845
"@mui/icons-material@^5.0.4":
28652846
version "5.0.4"
28662847
resolved "https://registry.yarnpkg.com/@mui/icons-material/-/icons-material-5.0.4.tgz#2d1e69c323695a1c6e26be3abcc532818dd442d2"
@@ -2887,25 +2868,6 @@
28872868
react-transition-group "^4.4.2"
28882869
rifm "^0.12.0"
28892870

2890-
"@mui/material@^5.0.3":
2891-
version "5.0.3"
2892-
resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.0.3.tgz#5ac4d9f7d9635efc9cf7347373e49db41f1b065b"
2893-
integrity sha512-Qj2hwSi63qrYRJuHrUFdN83lCT6HXyLzpCniDTvK7NlqXCnpy4F3Gg0hRJTnO4hNqTTBV+SCOKTSbfuzHl/dnQ==
2894-
dependencies:
2895-
"@babel/runtime" "^7.15.4"
2896-
"@mui/core" "5.0.0-alpha.50"
2897-
"@mui/system" "^5.0.3"
2898-
"@mui/types" "^7.0.0"
2899-
"@mui/utils" "^5.0.1"
2900-
"@popperjs/core" "^2.4.4"
2901-
"@types/react-transition-group" "^4.4.3"
2902-
clsx "^1.1.1"
2903-
csstype "^3.0.9"
2904-
hoist-non-react-statics "^3.3.2"
2905-
prop-types "^15.7.2"
2906-
react-is "^17.0.2"
2907-
react-transition-group "^4.4.2"
2908-
29092871
"@mui/material@^5.0.4":
29102872
version "5.0.4"
29112873
resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.0.4.tgz#38b842a413aed61c3fe169a167e824319fc8f1b1"
@@ -2966,20 +2928,6 @@
29662928
jss-plugin-vendor-prefixer "^10.8.0"
29672929
prop-types "^15.7.2"
29682930

2969-
"@mui/system@^5.0.3":
2970-
version "5.0.3"
2971-
resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.0.3.tgz#6c126be5c2796fe89af93aa0e76d1c3c6dcccf45"
2972-
integrity sha512-pNkW9p6Dj/ch3YCKjvrXrBhKsAyJ1/l273Q0hh60hhTKHJXgKBVONQ8r7l1fFHtufI0NNz6UGMVJooIXg4JJtA==
2973-
dependencies:
2974-
"@babel/runtime" "^7.15.4"
2975-
"@mui/private-theming" "^5.0.1"
2976-
"@mui/styled-engine" "^5.0.1"
2977-
"@mui/types" "^7.0.0"
2978-
"@mui/utils" "^5.0.1"
2979-
clsx "^1.1.1"
2980-
csstype "^3.0.9"
2981-
prop-types "^15.7.2"
2982-
29832931
"@mui/system@^5.0.4":
29842932
version "5.0.4"
29852933
resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.0.4.tgz#cff806533c9063efc9e1c6ec99731b64ac0632e8"

0 commit comments

Comments
 (0)