await userEvent

Signed-off-by: Johan Haals <johan.haals@gmail.com>
This commit is contained in:
Johan Haals
2022-04-01 10:43:58 +02:00
parent 659111711e
commit b1190bf676
36 changed files with 177 additions and 174 deletions
@@ -124,7 +124,7 @@ describe('SearchBar', () => {
const value = 'value';
userEvent.type(textbox, value);
await userEvent.type(textbox, value);
act(() => {
jest.advanceTimersByTime(defaultDebounceTime);
@@ -152,7 +152,7 @@ describe('SearchBar', () => {
expect(screen.getByRole('textbox', { name })).toHaveValue(term);
});
userEvent.click(screen.getByRole('button', { name: 'Clear' }));
await userEvent.click(screen.getByRole('button', { name: 'Clear' }));
await waitFor(() => {
expect(screen.getByRole('textbox', { name })).toHaveValue('');
@@ -199,7 +199,7 @@ describe('SearchBar', () => {
const value = 'value';
userEvent.type(textbox, value);
await userEvent.type(textbox, value);
expect(query).not.toHaveBeenLastCalledWith(
expect.objectContaining({ term: value }),
@@ -208,7 +208,7 @@ describe('SearchBar', () => {
act(() => {
jest.advanceTimersByTime(debounceTime);
});
expect(textbox).toHaveValue(value);
await waitFor(() => {
expect(textbox).toHaveValue(value);
});
@@ -240,7 +240,7 @@ describe('SearchBar', () => {
const value = 'value';
userEvent.type(textbox, value);
await userEvent.type(textbox, value);
act(() => {
jest.advanceTimersByTime(debounceTime);
@@ -296,7 +296,7 @@ describe('SearchBar', () => {
const value = 'value';
userEvent.type(textbox, value);
await userEvent.type(textbox, value);
expect(analyticsApiSpy.getEvents()).toHaveLength(0);
@@ -321,7 +321,7 @@ describe('SearchBar', () => {
userEvent.clear(textbox);
// make sure new term is captured
userEvent.type(textbox, 'new value');
await userEvent.type(textbox, 'new value');
act(() => {
jest.advanceTimersByTime(debounceTime);
@@ -54,7 +54,7 @@ describe('SearchFilter.Autocomplete', () => {
const autocomplete = screen.getByRole('combobox');
const input = within(autocomplete).getByRole('textbox');
userEvent.click(input);
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
@@ -75,7 +75,7 @@ describe('SearchFilter.Autocomplete', () => {
const autocomplete = screen.getByRole('combobox');
const input = within(autocomplete).getByRole('textbox');
userEvent.click(input);
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
@@ -109,11 +109,11 @@ describe('SearchFilter.Autocomplete', () => {
// Select a value from the autocomplete filter.
const autocomplete = screen.getByRole('combobox');
const input = within(autocomplete).getByRole('textbox');
userEvent.click(input);
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
});
userEvent.click(screen.getByRole('option', { name: values[1] }));
await userEvent.click(screen.getByRole('option', { name: values[1] }));
// Wait for the autocomplete filter's value to change.
await waitFor(() => {
@@ -193,11 +193,11 @@ describe('SearchFilter.Autocomplete', () => {
// Select the first option in the autocomplete.
const autocomplete = screen.getByRole('combobox');
const input = within(autocomplete).getByRole('textbox');
userEvent.click(input);
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(screen.getByRole('option', { name: values[0] }));
// The value should be present in the context.
await waitFor(() => {
@@ -208,7 +208,7 @@ describe('SearchFilter.Autocomplete', () => {
// Click the "Clear" button to remove the value.
const clearButton = within(autocomplete).getByLabelText('Clear');
userEvent.click(clearButton);
await userEvent.click(clearButton);
// That value should have been unset from the context.
await waitFor(() => {
@@ -284,11 +284,11 @@ describe('SearchFilter.Autocomplete', () => {
const input = within(autocomplete).getByRole('textbox');
// Select the second value.
userEvent.click(input);
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
});
userEvent.click(screen.getByRole('option', { name: values[1] }));
await userEvent.click(screen.getByRole('option', { name: values[1] }));
await waitFor(() => {
expect(
screen.getByRole('button', { name: values[1] }),
@@ -296,11 +296,11 @@ describe('SearchFilter.Autocomplete', () => {
});
// Select the first value.
userEvent.click(input);
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(screen.getByRole('option', { name: values[0] }));
await waitFor(() => {
expect(
screen.getByRole('button', { name: values[0] }),
@@ -329,16 +329,16 @@ describe('SearchFilter.Autocomplete', () => {
// Select both values in the autocomplete.
const input = within(autocomplete).getByRole('textbox');
userEvent.click(input);
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
userEvent.click(input);
await userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(input);
await waitFor(() => {
screen.getByRole('listbox');
});
userEvent.click(screen.getByRole('option', { name: values[1] }));
await userEvent.click(screen.getByRole('option', { name: values[1] }));
// Both options should be present in the context.
await waitFor(() => {
@@ -349,7 +349,7 @@ describe('SearchFilter.Autocomplete', () => {
// Click the "Clear" button to remove the value.
const clearButton = within(autocomplete).getByLabelText('Clear');
userEvent.click(clearButton);
await userEvent.click(clearButton);
// There should be no content in the filter context.
await waitFor(() => {
@@ -134,7 +134,7 @@ describe('SearchFilter', () => {
const checkBox = screen.getByRole('checkbox', { name: values[0] });
// Check the box.
userEvent.click(checkBox);
await userEvent.click(checkBox);
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
expect.objectContaining({ filters: { field: [values[0]] } }),
@@ -142,7 +142,7 @@ describe('SearchFilter', () => {
});
// Uncheck the box.
userEvent.click(checkBox);
await userEvent.click(checkBox);
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
expect.objectContaining({ filters: {} }),
@@ -164,7 +164,7 @@ describe('SearchFilter', () => {
const checkBox = screen.getByRole('checkbox', { name: values[0] });
// Check the box.
userEvent.click(checkBox);
await userEvent.click(checkBox);
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
expect.objectContaining({
@@ -174,7 +174,7 @@ describe('SearchFilter', () => {
});
// Uncheck the box.
userEvent.click(checkBox);
await userEvent.click(checkBox);
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
expect.objectContaining({ filters }),
@@ -195,7 +195,7 @@ describe('SearchFilter', () => {
expect(screen.getByText(label)).toBeInTheDocument();
});
userEvent.click(screen.getByRole('button'));
await userEvent.click(screen.getByRole('button'));
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -227,7 +227,7 @@ describe('SearchFilter', () => {
).not.toBe('true');
});
userEvent.click(screen.getByRole('button'));
await userEvent.click(screen.getByRole('button'));
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -259,7 +259,7 @@ describe('SearchFilter', () => {
expect(screen.getByText(label)).toBeInTheDocument();
});
userEvent.click(screen.getByRole('button'));
await userEvent.click(screen.getByRole('button'));
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -293,7 +293,7 @@ describe('SearchFilter', () => {
expect(screen.getByText(label)).toBeInTheDocument();
});
userEvent.click(screen.getByRole('button'));
await userEvent.click(screen.getByRole('button'));
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -324,13 +324,13 @@ describe('SearchFilter', () => {
const button = screen.getByRole('button');
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(screen.getByRole('option', { name: values[0] }));
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
@@ -340,13 +340,13 @@ describe('SearchFilter', () => {
);
});
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
});
userEvent.click(screen.getByRole('option', { name: 'All' }));
await userEvent.click(screen.getByRole('option', { name: 'All' }));
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
@@ -375,13 +375,13 @@ describe('SearchFilter', () => {
const button = screen.getByRole('button');
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(screen.getByRole('option', { name: values[0] }));
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
@@ -391,13 +391,13 @@ describe('SearchFilter', () => {
);
});
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
});
userEvent.click(screen.getByRole('option', { name: 'All' }));
await userEvent.click(screen.getByRole('option', { name: 'All' }));
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
@@ -42,17 +42,14 @@ describe('SearchResultPager', () => {
await waitFor(() => {
expect(getByLabelText('previous page')).toBeInTheDocument();
userEvent.click(getByLabelText('previous page'));
});
await userEvent.click(getByLabelText('previous page'));
expect(fetchPreviousPage).toBeCalled();
await waitFor(() => {
expect(getByLabelText('next page')).toBeInTheDocument();
userEvent.click(getByLabelText('next page'));
});
await userEvent.click(getByLabelText('next page'));
expect(fetchNextPage).toBeCalled();
});
@@ -56,7 +56,7 @@ describe('SearchType', () => {
expect(screen.getByText(name)).toBeInTheDocument();
});
userEvent.click(screen.getByRole('button'));
await userEvent.click(screen.getByRole('button'));
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -86,7 +86,7 @@ describe('SearchType', () => {
expect(screen.getByText(name)).toBeInTheDocument();
});
userEvent.click(screen.getByRole('button'));
await userEvent.click(screen.getByRole('button'));
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -112,7 +112,7 @@ describe('SearchType', () => {
expect(screen.getByText(name)).toBeInTheDocument();
});
userEvent.click(screen.getByRole('button'));
await userEvent.click(screen.getByRole('button'));
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -140,13 +140,13 @@ describe('SearchType', () => {
const button = screen.getByRole('button');
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(screen.getByRole('option', { name: values[0] }));
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
@@ -156,7 +156,7 @@ describe('SearchType', () => {
);
});
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
@@ -181,13 +181,13 @@ describe('SearchType', () => {
const button = screen.getByRole('button');
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(screen.getByRole('option', { name: values[0] }));
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(
@@ -197,13 +197,13 @@ describe('SearchType', () => {
);
});
userEvent.click(button);
await userEvent.click(button);
await waitFor(() => {
expect(screen.getByRole('listbox')).toBeInTheDocument();
});
userEvent.click(screen.getByRole('option', { name: values[0] }));
await userEvent.click(screen.getByRole('option', { name: values[0] }));
await waitFor(() => {
expect(query).toHaveBeenLastCalledWith(expect.objectContaining([]));