diff --git a/superset-frontend/src/explore/components/ExploreChartPanel.test.jsx b/superset-frontend/src/explore/components/ExploreChartPanel.test.jsx
index 63417da86ebfb..c8241d6125e0b 100644
--- a/superset-frontend/src/explore/components/ExploreChartPanel.test.jsx
+++ b/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()).toBe(true);
});
- it('renders with alert banner', () => {
+ test('renders with alert banner', async () => {
const props = createProps({
chartIsStale: true,
chart: { chartStatus: 'rendered', queriesResponse: [{}] },
@@ -77,31 +77,35 @@ describe('ChartContainer', () => {
}),
);
render(, { 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(, { 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(, { 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: [{}] },
@@ -109,11 +113,11 @@ describe('ChartContainer', () => {
});
render(, { 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(, { useRedux: true });
- const cached = screen.queryByText('Cached');
+ const cached = await screen.findByText('Cached');
expect(cached).toBeInTheDocument();
userEvent.click(cached);
@@ -135,7 +139,7 @@ describe('ChartContainer', () => {
expect(updateQueryFormData).toHaveBeenCalledTimes(1);
});
- it('should hide cached button', () => {
+ test('should hide cached button', async () => {
const props = createProps({
chart: {
chartStatus: 'rendered',
@@ -143,6 +147,7 @@ describe('ChartContainer', () => {
},
});
render(, { useRedux: true });
- expect(screen.queryByText('Cached')).not.toBeInTheDocument();
+ expect(await screen.findByRole('timer')).toBeInTheDocument();
+ expect(screen.queryByText(/cached/i)).not.toBeInTheDocument();
});
});