Skip to content

Commit 64632d0

Browse files
rvsiarvsia
committed
Update dual list and field array tests
1 parent bab4443 commit 64632d0

File tree

2 files changed

+87
-344
lines changed

2 files changed

+87
-344
lines changed

‎packages/mui-component-mapper/src/tests/dual-list-select.test.js

Lines changed: 37 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
import React from 'react';
22
import { act } from 'react-dom/test-utils';
3+
import { render, screen } from '@testing-library/react';
4+
import userEvent from '@testing-library/user-event';
5+
36
import { FormRenderer, componentTypes } from '@data-driven-forms/react-form-renderer';
47
import { mount } from 'enzyme';
58

@@ -17,8 +20,6 @@ describe('DualListSelect', () => {
1720

1821
const ALL_LEFT_POSITION = 3;
1922
const ALL_RIGHT_POSITION = 0;
20-
const RIGHT_POSITION = 1;
21-
const LEFT_POSITION = 2;
2223

2324
beforeEach(() => {
2425
onSubmit = jest.fn();
@@ -78,128 +79,64 @@ describe('DualListSelect', () => {
7879
});
7980

8081
it('switch left option', async () => {
81-
const wrapper = mount(<FormRenderer {...initialProps} />);
82+
render(<FormRenderer {...initialProps} />);
8283

83-
wrapper.find('form').simulate('submit');
84-
expect(onSubmit).toHaveBeenCalledWith({});
85-
onSubmit.mockClear();
86-
87-
await act(async () => {
88-
wrapper.find(ListItem).first().simulate('click');
89-
});
90-
wrapper.update();
84+
userEvent.click(screen.getByText('Submit'));
9185

92-
await act(async () => {
93-
wrapper.find('#buttons-grid').find(Button).at(RIGHT_POSITION).props().onClick();
94-
});
95-
wrapper.update();
86+
expect(onSubmit).toHaveBeenCalledWith({});
9687

97-
await act(async () => {
98-
wrapper.find('form').simulate('submit');
99-
});
88+
userEvent.click(screen.getByText('cats'));
89+
userEvent.click(screen.getByLabelText('Move selected to right'));
90+
userEvent.click(screen.getByText('Submit'));
10091

101-
expect(onSubmit).toHaveBeenCalledWith({ 'dual-list': ['cats'] });
92+
expect(onSubmit).toHaveBeenLastCalledWith({ 'dual-list': ['cats'] });
10293
});
10394

10495
it('switch left option with holding ctrl', async () => {
105-
const wrapper = mount(<FormRenderer {...initialProps} />);
96+
render(<FormRenderer {...initialProps} />);
10697

107-
await act(async () => {
108-
wrapper.find(List).first().find(ListItem).first().simulate('click');
109-
});
110-
wrapper.update();
98+
userEvent.click(screen.getByText('cats'));
99+
userEvent.click(screen.getByText('zebras'), { ctrlKey: true });
100+
userEvent.click(screen.getByLabelText('Move selected to right'));
101+
userEvent.click(screen.getByText('Submit'));
111102

112-
await act(async () => {
113-
wrapper.find(List).first().find(ListItem).last().simulate('click', { ctrlKey: true });
114-
});
115-
wrapper.update();
116-
117-
await act(async () => {
118-
wrapper.find('#buttons-grid').find(Button).at(RIGHT_POSITION).props().onClick();
119-
});
120-
wrapper.update();
121-
122-
wrapper.find('form').simulate('submit');
123-
124-
expect(onSubmit).toHaveBeenCalledWith({ 'dual-list': ['cats', 'zebras'] });
103+
expect(onSubmit).toHaveBeenLastCalledWith({ 'dual-list': ['cats', 'zebras'] });
125104
});
126105

127106
it('switch left option with holding shift', async () => {
128-
const wrapper = mount(<FormRenderer {...initialProps} />);
129-
130-
await act(async () => {
131-
wrapper.find(List).first().find(ListItem).first().simulate('click');
132-
});
133-
wrapper.update();
134-
135-
await act(async () => {
136-
wrapper.find(List).first().find(ListItem).last().simulate('click', { shiftKey: true });
137-
});
138-
wrapper.update();
139-
140-
await act(async () => {
141-
wrapper.find('#buttons-grid').find(Button).at(RIGHT_POSITION).props().onClick();
142-
});
143-
wrapper.update();
107+
render(<FormRenderer {...initialProps} />);
144108

145-
await act(async () => {
146-
wrapper.find('form').simulate('submit');
147-
});
109+
userEvent.click(screen.getByText('cats'));
110+
userEvent.click(screen.getByText('zebras'), { shiftKey: true });
111+
userEvent.click(screen.getByLabelText('Move selected to right'));
112+
userEvent.click(screen.getByText('Submit'));
148113

149-
expect(onSubmit).toHaveBeenCalledWith({ 'dual-list': ['cats', 'cats_1', 'cats_2', 'pigeons', 'zebras'] });
114+
expect(onSubmit).toHaveBeenLastCalledWith({ 'dual-list': ['cats', 'cats_1', 'cats_2', 'pigeons', 'zebras'] });
150115
});
151116

152117
it('switch left option with holding and removing by ctrl', async () => {
153-
const wrapper = mount(<FormRenderer {...initialProps} />);
154-
155-
await act(async () => {
156-
wrapper.find(List).first().find(ListItem).first().simulate('click');
157-
});
158-
wrapper.update();
118+
render(<FormRenderer {...initialProps} />);
159119

160-
await act(async () => {
161-
wrapper.find(List).first().find(ListItem).last().simulate('click', { shiftKey: true });
162-
});
163-
wrapper.update();
164-
165-
await act(async () => {
166-
wrapper.find(List).first().find(ListItem).first().simulate('click', { ctrlKey: true });
167-
});
168-
wrapper.update();
120+
userEvent.click(screen.getByText('cats'));
121+
userEvent.click(screen.getByText('zebras'), { shiftKey: true });
122+
userEvent.click(screen.getByText('cats'), { ctrlKey: true });
123+
userEvent.click(screen.getByLabelText('Move selected to right'));
124+
userEvent.click(screen.getByText('Submit'));
169125

170-
await act(async () => {
171-
wrapper.find('#buttons-grid').find(Button).at(RIGHT_POSITION).props().onClick();
172-
});
173-
wrapper.update();
174-
175-
await act(async () => {
176-
wrapper.find('form').simulate('submit');
177-
});
178-
179-
expect(onSubmit).toHaveBeenCalledWith({ 'dual-list': ['cats_1', 'cats_2', 'pigeons', 'zebras'] });
126+
expect(onSubmit).toHaveBeenLastCalledWith({ 'dual-list': ['cats_1', 'cats_2', 'pigeons', 'zebras'] });
180127
});
181128

182129
it('switch right option', async () => {
183-
const wrapper = mount(<FormRenderer {...initialProps} initialValues={{ 'dual-list': ['cats'] }} />);
184-
await act(async () => {
185-
wrapper.find('form').simulate('submit');
186-
});
187-
expect(onSubmit).toHaveBeenCalledWith({ 'dual-list': ['cats'] });
188-
onSubmit.mockClear();
189-
await act(async () => {
190-
wrapper.find(ListItem).last().simulate('click');
191-
});
192-
wrapper.update();
130+
render(<FormRenderer {...initialProps} initialValues={{ 'dual-list': ['cats'] }} />);
193131

194-
await act(async () => {
195-
wrapper.find('#buttons-grid').find(Button).at(LEFT_POSITION).props().onClick();
196-
});
197-
wrapper.update();
198-
await act(async () => {
199-
wrapper.find('form').simulate('submit');
200-
});
132+
userEvent.click(screen.getByText('Submit'));
133+
expect(onSubmit).toHaveBeenLastCalledWith({ 'dual-list': ['cats'] });
201134

202-
expect(onSubmit).toHaveBeenCalledWith({});
135+
userEvent.click(screen.getByText('cats'));
136+
userEvent.click(screen.getByLabelText('Move selected to left'));
137+
userEvent.click(screen.getByText('Submit'));
138+
139+
expect(onSubmit).toHaveBeenLastCalledWith({});
203140
});
204141

205142
it('switch all to right', async () => {

0 commit comments

Comments
 (0)