diff --git a/superset-frontend/src/explore/components/controls/CollectionControl/CollectionControl.test.tsx b/superset-frontend/src/explore/components/controls/CollectionControl/CollectionControl.test.tsx
index 53d57030c9466..00ece2306901a 100644
--- a/superset-frontend/src/explore/components/controls/CollectionControl/CollectionControl.test.tsx
+++ b/superset-frontend/src/explore/components/controls/CollectionControl/CollectionControl.test.tsx
@@ -85,49 +85,58 @@ const createProps = () => ({
value: [{ key: 'hrYAZ5iBH' }],
});
-test('Should render', () => {
+test('Should render', async () => {
const props = createProps();
render();
- expect(screen.getByTestId('CollectionControl')).toBeInTheDocument();
+ expect(await screen.findByTestId('CollectionControl')).toBeInTheDocument();
});
-test('Should show the button with the label', () => {
+test('Should show the button with the label', async () => {
const props = createProps();
render();
- expect(screen.getByRole('button', { name: props.label })).toBeInTheDocument();
+ expect(
+ await screen.findByRole('button', { name: props.label }),
+ ).toBeInTheDocument();
expect(screen.getByRole('button', { name: props.label })).toHaveTextContent(
props.label,
);
});
-test('Should have add button', () => {
+test('Should have add button', async () => {
const props = createProps();
render();
+ expect(
+ await screen.findByRole('button', { name: 'plus-large' }),
+ ).toBeInTheDocument();
expect(props.onChange).toBeCalledTimes(0);
userEvent.click(screen.getByRole('button', { name: 'plus-large' }));
expect(props.onChange).toBeCalledWith([{ key: 'hrYAZ5iBH' }, undefined]);
});
-test('Should have remove button', () => {
+test('Should have remove button', async () => {
const props = createProps();
render();
+ expect(
+ await screen.findByRole('button', { name: 'remove-item' }),
+ ).toBeInTheDocument();
expect(props.onChange).toBeCalledTimes(0);
userEvent.click(screen.getByRole('button', { name: 'remove-item' }));
expect(props.onChange).toBeCalledWith([]);
});
-test('Should have SortableDragger icon', () => {
+test('Should have SortableDragger icon', async () => {
const props = createProps();
render();
- expect(screen.getByLabelText('drag')).toBeVisible();
+ expect(await screen.findByLabelText('drag')).toBeVisible();
});
-test('Should call Control component', () => {
+test('Should call Control component', async () => {
const props = createProps();
render();
+ expect(await screen.findByTestId('TestControl')).toBeInTheDocument();
expect(props.onChange).toBeCalledTimes(0);
userEvent.click(screen.getByTestId('TestControl'));
expect(props.onChange).toBeCalledWith([{ key: 'hrYAZ5iBH' }]);