#1291 - add tests for mint cart button

also improve downloadTab tests

packages/datagateway-download/src/downloadCart/downloadCartTable.component.test.tsx

@@ -4,23 +4,31 @@ import {
   RenderResult,
   screen,
   waitFor,
+  within,
 } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import type { UserEvent } from '@testing-library/user-event/dist/types/setup';
 import { fetchDownloadCart } from 'datagateway-common';
-import { createMemoryHistory } from 'history';
+import { createMemoryHistory, MemoryHistory } from 'history';
 import * as React from 'react';
-import { QueryClient, QueryClientProvider } from 'react-query';
+import { QueryClient, QueryClientProvider, setLogger } from 'react-query';
 import { Router } from 'react-router-dom';
 import { DownloadSettingsContext } from '../ConfigProvider';
 import { mockCartItems, mockedSettings } from '../testData';
 import {
   getDatafileCount,
   getSize,
+  isCartMintable,
   removeAllDownloadCartItems,
   removeFromCart,
 } from '../downloadApi';
 import DownloadCartTable from './downloadCartTable.component';
+import { createTheme } from '@mui/material';
+
+setLogger({
+  log: console.log,
+  warn: console.warn,
+  error: jest.fn(),
+});
 
 jest.mock('datagateway-common', () => {
   const originalModule = jest.requireActual('datagateway-common');
@@ -42,6 +50,7 @@ jest.mock('../downloadApi', () => {
     getDatafileCount: jest.fn(),
     getIsTwoLevel: jest.fn().mockResolvedValue(true),
     removeFromCart: jest.fn(),
+    isCartMintable: jest.fn(),
   };
 });
 
@@ -54,20 +63,25 @@ const createTestQueryClient = (): QueryClient =>
     },
   });
 
-const renderComponent = (): RenderResult =>
-  render(
-    <QueryClientProvider client={createTestQueryClient()}>
-      <DownloadSettingsContext.Provider value={mockedSettings}>
-        <Router history={createMemoryHistory()}>
-          <DownloadCartTable statusTabRedirect={jest.fn()} />
-        </Router>
-      </DownloadSettingsContext.Provider>
-    </QueryClientProvider>
-  );
+const renderComponent = (): RenderResult & { history: MemoryHistory } => {
+  const history = createMemoryHistory();
+  return {
+    history: history,
+    ...render(
+      <QueryClientProvider client={createTestQueryClient()}>
+        <DownloadSettingsContext.Provider value={mockedSettings}>
+          <Router history={history}>
+            <DownloadCartTable statusTabRedirect={jest.fn()} />
+          </Router>
+        </DownloadSettingsContext.Provider>
+      </QueryClientProvider>
+    ),
+  };
+};
 
 describe('Download cart table component', () => {
   let holder, queryClient;
-  let user: UserEvent;
+  let user: ReturnType<typeof userEvent.setup>;
 
   const resetDOM = (): void => {
     if (holder) document.body.removeChild(holder);
@@ -104,6 +118,9 @@ describe('Download cart table component', () => {
     (
       getDatafileCount as jest.MockedFunction<typeof getDatafileCount>
     ).mockResolvedValue(7);
+    (
+      isCartMintable as jest.MockedFunction<typeof isCartMintable>
+    ).mockResolvedValue(true);
   });
 
   afterEach(() => {
@@ -430,4 +447,91 @@ describe('Download cart table component', () => {
       })
     ).toBeTruthy();
   });
+
+  it('should go to DOI generation form when Generate DOI button is clicked', async () => {
+    const { history } = renderComponent();
+
+    await user.click(
+      screen.getByRole('link', { name: 'downloadCart.generate_DOI' })
+    );
+
+    expect(history.location).toMatchObject({
+      pathname: '/download/mint',
+      state: { fromCart: true },
+    });
+  });
+
+  it('should disable Generate DOI button when mintability is loading', async () => {
+    (
+      isCartMintable as jest.MockedFunction<typeof isCartMintable>
+    ).mockImplementation(
+      () =>
+        new Promise((_) => {
+          // do nothing, simulating pending promise to test loading state
+        })
+    );
+    const { history } = renderComponent();
+
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    const generateDOIButton = screen
+      .getByRole('link', { name: 'downloadCart.generate_DOI' })
+      .closest('span')!;
+
+    await user.hover(generateDOIButton);
+
+    expect(
+      await screen.findByText('downloadCart.mintability_loading')
+    ).toBeInTheDocument();
+
+    await user.click(generateDOIButton);
+
+    expect(history.location).not.toMatchObject({
+      pathname: '/download/mint',
+      state: { fromCart: true },
+    });
+  });
+
+  it('should disable Generate DOI button when cart is not mintable', async () => {
+    (
+      isCartMintable as jest.MockedFunction<typeof isCartMintable>
+    ).mockRejectedValue({
+      response: {
+        data: { detail: 'Not allowed to mint the following items: [2,4]' },
+        status: 403,
+      },
+    });
+    const { history } = renderComponent();
+
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    const generateDOIButton = screen
+      .getByRole('link', { name: 'downloadCart.generate_DOI' })
+      .closest('span')!;
+
+    await user.hover(generateDOIButton);
+
+    expect(
+      await screen.findByText('downloadCart.not_mintable')
+    ).toBeInTheDocument();
+
+    const tableRows = within(
+      screen.getByRole('rowgroup', { name: 'grid' })
+    ).getAllByRole('row');
+    const muiErrorColor = createTheme().palette.error.main;
+    expect(tableRows[1]).toHaveStyle(`background-color: ${muiErrorColor}`);
+    expect(tableRows[1]).toHaveStyle(`background-color: ${muiErrorColor}`);
+    expect(tableRows[0]).not.toHaveStyle(`background-color: ${muiErrorColor}`);
+    expect(tableRows[2]).not.toHaveStyle(`background-color: ${muiErrorColor}`);
+
+    await user.click(generateDOIButton);
+
+    expect(history.location).not.toMatchObject({
+      pathname: '/download/mint',
+      state: { fromCart: true },
+    });
+
+    await user.unhover(generateDOIButton);
+    for (const row of tableRows) {
+      expect(row).not.toHaveStyle(`background-color: ${muiErrorColor}`);
+    }
+  });
 });