test: Fix act errors in ExploreChartPanel test

superset-frontend/src/explore/components/ExploreChartPanel.test.jsx

@@ -58,12 +58,12 @@ const createProps = (overrides = {}) => ({
 });
 
 describe('ChartContainer', () => {
-  it('renders when vizType is line', () => {
+  test('renders when vizType is line', () => {
     const props = createProps();
     expect(React.isValidElement(<ChartContainer {...props} />)).toBe(true);
   });
 
-  it('renders with alert banner', () => {
+  test('renders with alert banner', async () => {
     const props = createProps({
       chartIsStale: true,
       chart: { chartStatus: 'rendered', queriesResponse: [{}] },
@@ -77,43 +77,47 @@ describe('ChartContainer', () => {
       }),
     );
     render(<ChartContainer {...props} />, { useRedux: true });
-    expect(screen.getByText('Your chart is not up to date')).toBeVisible();
+    expect(
+      await screen.findByText('Your chart is not up to date'),
+    ).toBeVisible();
   });
 
-  it('doesnt render alert banner when no changes in control panel were made (chart is not stale)', () => {
+  test('doesnt render alert banner when no changes in control panel were made (chart is not stale)', async () => {
     const props = createProps({
       chartIsStale: false,
     });
     render(<ChartContainer {...props} />, { useRedux: true });
+    expect(await screen.findByText(/cached/i)).toBeInTheDocument();
     expect(
       screen.queryByText('Your chart is not up to date'),
     ).not.toBeInTheDocument();
   });
 
-  it('doesnt render alert banner when chart not created yet (no queries response)', () => {
+  test('doesnt render alert banner when chart not created yet (no queries response)', async () => {
     const props = createProps({
       chartIsStale: true,
       chart: { queriesResponse: [] },
     });
     render(<ChartContainer {...props} />, { useRedux: true });
+    expect(await screen.findByRole('timer')).toBeInTheDocument();
     expect(
       screen.queryByText('Your chart is not up to date'),
     ).not.toBeInTheDocument();
   });
 
-  it('renders prompt to fill required controls when required control removed', () => {
+  test('renders prompt to fill required controls when required control removed', async () => {
     const props = createProps({
       chartIsStale: true,
       chart: { chartStatus: 'rendered', queriesResponse: [{}] },
       errorMessage: 'error',
     });
     render(<ChartContainer {...props} />, { useRedux: true });
     expect(
-      screen.getByText('Required control values have been removed'),
+      await screen.findByText('Required control values have been removed'),
     ).toBeVisible();
   });
 
-  it('should render cached button and call expected actions', () => {
+  test('should render cached button and call expected actions', async () => {
     const setForceQuery = jest.fn();
     const postChartFormData = jest.fn();
     const updateQueryFormData = jest.fn();
@@ -126,7 +130,7 @@ describe('ChartContainer', () => {
     });
     render(<ChartContainer {...props} />, { useRedux: true });
 
-    const cached = screen.queryByText('Cached');
+    const cached = await screen.findByText('Cached');
     expect(cached).toBeInTheDocument();
 
     userEvent.click(cached);
@@ -135,14 +139,15 @@ describe('ChartContainer', () => {
     expect(updateQueryFormData).toHaveBeenCalledTimes(1);
   });
 
-  it('should hide cached button', () => {
+  test('should hide cached button', async () => {
     const props = createProps({
       chart: {
         chartStatus: 'rendered',
         queriesResponse: [{ is_cached: false }],
       },
     });
     render(<ChartContainer {...props} />, { useRedux: true });
-    expect(screen.queryByText('Cached')).not.toBeInTheDocument();
+    expect(await screen.findByRole('timer')).toBeInTheDocument();
+    expect(screen.queryByText(/cached/i)).not.toBeInTheDocument();
   });
 });