#1533 - update unit tests with landing page changes

ral-facilities · Mar 22, 2024 · 98eaeb6 · 98eaeb6
1 parent 490d6aa
commit 98eaeb6
Show file tree

Hide file tree

Showing 3 changed files with 108 additions and 23 deletions.
diff --git a/packages/datagateway-dataview/src/views/citationFormatter.component.tsx b/packages/datagateway-dataview/src/views/citationFormatter.component.tsx
@@ -131,7 +131,11 @@ const CitationFormatter = (
             : '')}
       </Typography>
       {doi && (
-        <FormControl id="citation-formatter" error={error} variant="standard">
+        <FormControl
+          id={`${label ? `${label}-` : ''}citation-formatter"`}
+          error={error}
+          variant="standard"
+        >
           <div style={{ display: 'flex', alignItems: 'center' }}>
             <Select
               sx={{ my: 1 }}
@@ -163,7 +167,11 @@ const CitationFormatter = (
             )}
           </div>
           {error && (
-            <FormHelperText id="citation-formatter-error-message">
+            <FormHelperText
+              id={`${
+                label ? `${label}-` : ''
+              }citation-formatter-error-message"`}
+            >
               {t('datapublications.details.citation_formatter.error')}
             </FormHelperText>
           )}
@@ -176,7 +184,7 @@ const CitationFormatter = (
       </Typography>
       {!copiedCitation ? (
         <Button
-          id="citation-formatter-copy-citation"
+          id={`${label ? `${label}-` : ''}citation-formatter-copy-citation"`}
           aria-label={t(
             'datapublications.details.citation_formatter.copy_citation_arialabel'
           )}
@@ -196,7 +204,7 @@ const CitationFormatter = (
         </Button>
       ) : (
         <Button
-          id="citation-formatter-copied-citation"
+          id={`${label ? `${label}-` : ''}citation-formatter-copied-citation"`}
           variant="contained"
           color="primary"
           size="small"

diff --git a/...s/datagateway-dataview/src/views/landing/dls/dlsDataPublicationLanding.component.test.tsx b/...s/datagateway-dataview/src/views/landing/dls/dlsDataPublicationLanding.component.test.tsx
@@ -15,7 +15,12 @@ import thunk from 'redux-thunk';
 import { createMemoryHistory, History } from 'history';
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { Router, generatePath } from 'react-router-dom';
-import { render, type RenderResult, screen } from '@testing-library/react';
+import {
+  render,
+  type RenderResult,
+  screen,
+  within,
+} from '@testing-library/react';
 import { UserEvent } from '@testing-library/user-event/setup/setup';
 import userEvent from '@testing-library/user-event';
 import DLSDataPublicationLanding from './dlsDataPublicationLanding.component';
@@ -129,16 +134,25 @@ describe('DLS Data Publication Landing page', () => {
           id: 10,
           identifier: 'doi 2',
           relationType: DOIRelationType.HasVersion,
+          createTime: '2024-01-03 12:00:00',
         },
         {
           id: 11,
           identifier: 'doi 3',
           relationType: DOIRelationType.IsSupplementedBy,
+          createTime: '2024-01-02 12:00:00',
+        },
+        {
+          id: 13,
+          identifier: 'doi 5',
+          relationType: DOIRelationType.HasVersion,
+          createTime: '2024-01-04 12:00:00',
         },
         {
           id: 12,
           identifier: 'doi 4',
           relationType: DOIRelationType.HasVersion,
+          createTime: '2024-01-03 12:00:00',
         },
       ],
       publicationDate: '2023-07-20',
@@ -173,10 +187,20 @@ describe('DLS Data Publication Landing page', () => {
     renderComponent();
 
     // displays doi + link correctly
+    expect(
+      screen.getByText('datapublications.concept datapublications.pid')
+    ).toBeInTheDocument();
     expect(
       await screen.findByRole('link', { name: 'DOI doi 1' })
     ).toHaveAttribute('href', 'https://doi.org/doi 1');
 
+    expect(
+      screen.getByText('datapublications.latest_version datapublications.pid')
+    ).toBeInTheDocument();
+    // should be 2 versions of the latest version DOI - one in the latest version label
+    // and one in the version panel
+    expect(screen.getAllByRole('link', { name: 'DOI doi 5' })).toHaveLength(2);
+
     expect(screen.getByText('2023-07-20')).toBeInTheDocument();
     expect(screen.getByText('Title')).toBeInTheDocument();
     expect(screen.getByText('foo bar')).toBeInTheDocument();
@@ -194,6 +218,19 @@ describe('DLS Data Publication Landing page', () => {
     expect(
       await screen.findByTestId('landing-dataPublication-user-2')
     ).toHaveTextContent('Experimenter: Jesse Smith');
+
+    // two citation formatters
+    expect(
+      screen.getByText(
+        'datapublications.latest_version datapublications.details.citation_formatter.label'
+      )
+    ).toBeInTheDocument();
+
+    expect(
+      screen.getByText(
+        'datapublications.concept datapublications.details.citation_formatter.label'
+      )
+    ).toBeInTheDocument();
   });
 
   it('renders correctly if info is missing', async () => {
@@ -241,35 +278,38 @@ describe('DLS Data Publication Landing page', () => {
       screen.queryByRole('button', { name: 'datapublications.edit_label' })
     ).not.toBeInTheDocument();
 
+    const versionPanel = await screen.findByRole('region', {
+      name: 'datapublications.details.version_panel_label',
+    });
+    expect(versionPanel).toBeInTheDocument();
+
     expect(
-      await screen.findByRole('button', {
-        name: 'datapublications.details.version_panel_label',
-      })
-    ).toBeInTheDocument();
-    expect(screen.getByRole('link', { name: 'DOI doi 2' })).toHaveAttribute(
-      'href',
-      'https://doi.org/doi 2'
-    );
+      within(versionPanel).getByRole('link', { name: 'DOI doi 2' })
+    ).toHaveAttribute('href', 'https://doi.org/doi 2');
     expect(
-      screen.queryByRole('link', { name: 'DOI doi 3' })
+      within(versionPanel).queryByRole('link', { name: 'DOI doi 3' })
     ).not.toBeInTheDocument();
-    expect(screen.getByRole('link', { name: 'DOI doi 4' })).toHaveAttribute(
-      'href',
-      'https://doi.org/doi 4'
-    );
+    expect(
+      within(versionPanel).getByRole('link', { name: 'DOI doi 4' })
+    ).toHaveAttribute('href', 'https://doi.org/doi 4');
+    expect(
+      within(versionPanel).getByRole('link', { name: 'DOI doi 5' })
+    ).toHaveAttribute('href', 'https://doi.org/doi 5');
   });
 
-  it('renders concept panel when showing a version DOI & does not show the edit button', async () => {
+  it('renders a version DOI correctly & does not show the edit button', async () => {
     initialData.relatedItems = [
       {
         id: 10,
         identifier: 'doi 2',
         relationType: DOIRelationType.IsVersionOf,
+        createTime: '2024-01-01 12:00:00',
       },
       {
         id: 11,
         identifier: 'doi 3',
         relationType: DOIRelationType.IsSupplementedBy,
+        createTime: '2024-01-02 12:00:00',
       },
     ];
     renderComponent();
@@ -279,9 +319,22 @@ describe('DLS Data Publication Landing page', () => {
     ).not.toBeInTheDocument();
 
     expect(
-      await screen.findByRole('button', {
-        name: 'datapublications.details.concept_panel_label',
+      screen.queryByRole('button', {
+        name: 'datapublications.details.version_panel_label',
       })
+    ).not.toBeInTheDocument();
+
+    expect(
+      screen.getByText('datapublications.details.citation_formatter.label')
+    ).toBeInTheDocument();
+
+    expect(screen.getByRole('link', { name: 'DOI doi 1' })).toHaveAttribute(
+      'href',
+      'https://doi.org/doi 1'
+    );
+
+    expect(
+      screen.getByText('datapublications.concept datapublications.pid')
     ).toBeInTheDocument();
     expect(screen.getByRole('link', { name: 'DOI doi 2' })).toHaveAttribute(
       'href',
@@ -311,7 +364,7 @@ describe('DLS Data Publication Landing page', () => {
     ).toBeInTheDocument();
   });
 
-  it('renders structured data correctly', async () => {
+  it('renders structured data correctly for concept DOI', async () => {
     renderComponent();
 
     expect(
@@ -327,4 +380,23 @@ describe('DLS Data Publication Landing page', () => {
       </script>
     `);
   });
+
+  it('does not render structured data for version dois', async () => {
+    initialData.relatedItems = [
+      {
+        id: 10,
+        identifier: 'doi 2',
+        relationType: DOIRelationType.IsVersionOf,
+        createTime: '2024-01-01 12:00:00',
+      },
+    ];
+
+    renderComponent();
+
+    expect(
+      await screen.findByTestId('landing-dataPublication-user-0')
+    ).toBeInTheDocument();
+
+    expect(document.getElementById('dataPublication-1')).toBeNull();
+  });
 });
diff --git a/...s/datagateway-dataview/src/views/landing/dls/dlsDataPublicationVersionPanel.component.tsx b/...s/datagateway-dataview/src/views/landing/dls/dlsDataPublicationVersionPanel.component.tsx
@@ -36,7 +36,12 @@ const DLSDataPublicationVersionPanel: React.FC<
 
   return (
     <Accordion defaultExpanded disableGutters elevation={0}>
-      <AccordionSummary sx={{ p: 0 }} expandIcon={<ExpandMoreIcon />}>
+      <AccordionSummary
+        sx={{ p: 0 }}
+        expandIcon={<ExpandMoreIcon />}
+        id="version-panel-header"
+        aria-controls="version-panel-content"
+      >
         <Typography fontWeight="bold">
           {t('datapublications.details.version_panel_label')}
         </Typography>