use waitFor in accordion test

src/__tests__/accordion-test.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import userEvent from '@testing-library/user-event';
-import {render, screen, waitForElementToBeRemoved} from '@testing-library/react';
+import {render, screen, waitFor} from '@testing-library/react';
 import {ThemeContextProvider, Text3, AccordionItem, Accordion} from '..';
 import {makeTheme} from './test-utils';
 
@@ -79,10 +79,12 @@ test('Accordion with index', async () => {
     await userEvent.click(screen.getByText('Title 2'));
     await userEvent.click(screen.getByText('Title 3'));
 
-    /** We need to wait for CSS transition to finish in order for panel to be removed */
-    await waitForElementToBeRemoved(screen.queryByText('Content 1'));
+    /** We need to wait for CSS transition to finish in order for panels to be removed */
+    await waitFor(async () => {
+        expect(screen.queryByText('Content 1')).not.toBeInTheDocument();
+        expect(screen.queryByText('Content 3')).not.toBeInTheDocument();
+    });
     expect(screen.getByText('Content 2')).toBeInTheDocument();
-    await waitForElementToBeRemoved(screen.queryByText('Content 3'));
 });
 
 test('Accordion with default index', async () => {
@@ -103,8 +105,10 @@ test('Accordion with default index', async () => {
     await userEvent.click(screen.getByText('Title 1'));
     await userEvent.click(screen.getByText('Title 2'));
 
-    /** We need to wait for CSS transition to finish in order for panel to be removed */
-    await waitForElementToBeRemoved(screen.queryByText('Content 1'));
+    /** We need to wait for CSS transition to finish in order for panels to be removed */
+    await waitFor(async () => {
+        expect(screen.queryByText('Content 1')).not.toBeInTheDocument();
+    });
     expect(screen.getByText('Content 2')).toBeInTheDocument();
     expect(screen.getByText('Content 3')).toBeInTheDocument();
 });
@@ -128,8 +132,10 @@ test('Accordion with singleOpen', async () => {
     await userEvent.click(screen.getByText('Title 2'));
     await userEvent.click(screen.getByText('Title 3'));
 
-    /** We need to wait for CSS transition to finish in order for panel to be removed */
-    await waitForElementToBeRemoved(screen.queryByText('Content 1'));
-    await waitForElementToBeRemoved(screen.queryByText('Content 2'));
+    /** We need to wait for CSS transition to finish in order for panels to be removed */
+    await waitFor(async () => {
+        expect(screen.queryByText('Content 1')).not.toBeInTheDocument();
+        expect(screen.queryByText('Content 2')).not.toBeInTheDocument();
+    });
     expect(screen.getByText('Content 3')).toBeInTheDocument();
 });