improve dashbaoard drawer test

grafana · Sep 21, 2022 · 50f365f · 50f365f
1 parent c475843
commit 50f365f
Showing 1 changed file with 39 additions and 38 deletions.
diff --git a/public/app/features/dashboard/components/SaveDashboard/SaveDashboardDrawer.test.tsx b/public/app/features/dashboard/components/SaveDashboard/SaveDashboardDrawer.test.tsx
@@ -26,65 +26,66 @@ jest.mock('app/core/services/backend_srv', () => ({
     getDashboardByUid: jest.fn().mockResolvedValue({ dashboard: {} }),
   },
 }));
-const mockOnDismiss = jest.fn();
-const mockPost = jest.fn();
 
-const setup = async () => {
-  const mockDashboard = new DashboardModel({
+const store = configureStore();
+const mockPost = jest.fn();
+const buildMocks = () => ({
+  dashboard: new DashboardModel({
     uid: 'mockDashboardUid',
     version: 1,
-  });
-  const store = configureStore();
+  }),
+  error: {
+    status: 412,
+    data: {
+      status: 'plugin-dashboard',
+    },
+    config: {},
+  },
+  onDismiss: jest.fn(),
+});
 
-  const { rerender } = await waitFor(() =>
-    render(
-      <Provider store={store}>
-        <SaveDashboardDrawer dashboard={mockDashboard} onDismiss={mockOnDismiss} />{' '}
-      </Provider>
-    )
-  );
+interface CompProps {
+  dashboard: DashboardModel;
+  onDismiss: () => void;
+}
+const CompWithProvider = (props: CompProps) => (
+  <Provider store={store}>
+    <SaveDashboardDrawer {...props} />
+  </Provider>
+);
 
-  return { rerender, mockDashboard, store };
-};
+const setup = (options: CompProps) => waitFor(() => render(<CompWithProvider {...options} />));
 
 describe('SaveDashboardDrawer', () => {
   beforeEach(() => {
     mockPost.mockClear();
+    jest.spyOn(console, 'error').mockImplementation();
   });
 
-  it("renders SaveDashboardErrorProxy if there's an error and it not yet handled", async () => {
-    jest.spyOn(console, 'error').mockImplementation();
-    mockPost.mockRejectedValueOnce({
-      status: 412,
-      data: {
-        status: 'plugin-dashboard',
-      },
-      config: {},
-    });
+  it("renders a modal if there's an unhandled error", async () => {
+    const { onDismiss, dashboard, error } = buildMocks();
+    mockPost.mockRejectedValueOnce(error);
 
-    const { rerender, store, mockDashboard } = await setup();
+    await setup({ dashboard, onDismiss });
 
     await userEvent.click(screen.getByRole('button', { name: /save/i }));
 
     expect(screen.getByRole('button', { name: /cancel/i })).toBeInTheDocument();
     expect(screen.getByRole('button', { name: /save as/i })).toBeInTheDocument();
     expect(screen.getByRole('button', { name: /overwrite/i })).toBeInTheDocument();
+  });
 
-    rerender(
-      <Provider store={store}>
-        <SaveDashboardDrawer dashboard={mockDashboard} onDismiss={mockOnDismiss} />{' '}
-      </Provider>
-    );
+  it('should render corresponding save modal once the errror is handled', async () => {
+    const { onDismiss, dashboard, error } = buildMocks();
+    mockPost.mockRejectedValueOnce(error);
+
+    const { rerender } = await setup({ dashboard, onDismiss });
+
+    await userEvent.click(screen.getByRole('button', { name: /save/i }));
+    rerender(<CompWithProvider dashboard={dashboard} onDismiss={onDismiss} />);
 
     mockPost.mockClear();
-    mockPost.mockRejectedValueOnce({
-      status: 412,
-      data: {
-        status: 'plugin-dashboard',
-      },
-      isHandled: true,
-      config: {},
-    });
+    mockPost.mockRejectedValueOnce({ ...error, isHandled: true });
 
     await userEvent.click(screen.getByRole('button', { name: /save/i }));