Merge branch 'dev' into snyk-upgrade-7cb7d96991fec278ac99495cb11c0898

.env.example

@@ -1,4 +1,3 @@
-NEXT_PUBLIC_BUILD_DATE = 12345
 AEM_GRAPHQL_ENDPOINT = "test.com"
 LOGGING_LEVEL = " info or debug" 
 MSCA_BASE_URL = "MSCA base url"

.teamcity/settings.kts

@@ -85,7 +85,7 @@ object Build_Main: BuildType({
                     path = "Dockerfile"
                 }
                 namesAndTags = "%env.ACR_DOMAIN%/%env.PROJECT%:%env.DOCKER_TAG%"
-                commandArgs = "--pull --build-arg BUILD_DATE=%system.build.start.date% --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
+                commandArgs = "--pull --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
             }
         }
         script {
@@ -147,7 +147,7 @@ object Build_Performance: BuildType({
                     path = "Dockerfile"
                 }
                 namesAndTags = "%env.ACR_DOMAIN%/%env.PROJECT%:%env.DOCKER_TAG%"
-                commandArgs = "--pull --build-arg BUILD_DATE=%system.build.start.date% --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
+                commandArgs = "--pull --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
             }
         }
         script {
@@ -208,7 +208,7 @@ object Build_Dynamic: BuildType({
                     path = "Dockerfile"
                 }
                 namesAndTags = "%env.ACR_DOMAIN%/%env.PROJECT%:%env.DOCKER_TAG%"
-                commandArgs = "--pull --build-arg BUILD_DATE=%system.build.start.date% --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
+                commandArgs = "--pull --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
             }
         }
         script {

Dockerfile

@@ -7,8 +7,6 @@ COPY . .
 FROM base AS build
 
 # Build envs
-ARG BUILD_DATE
-ENV BUILD_DATE=$BUILD_DATE
 ARG AEM_GRAPHQL_ENDPOINT
 ENV AEM_GRAPHQL_ENDPOINT=$AEM_GRAPHQL_ENDPOINT
 ARG AUTH_ECAS_BASE_URL

__tests__/components/ContextualAlert.test.js

@@ -10,6 +10,10 @@ describe('ContextualAlert', () => {
     <ContextualAlert
       data-testid="alert-icon"
       alt="alert_icon_alt_text"
+      id="alert_icon_id"
+      alert_icon_id="icon-id"
+      alert_icon_alt_text="alt"
+      type="info"
       message_heading="Information"
       message_body="You may wish to print this page..."
     />
@@ -27,7 +31,12 @@ describe('ContextualAlert', () => {
   it('has no a11y violations', async () => {
     render(
       <ContextualAlert
+        data-testid="alert-icon"
         alt="alert_icon_alt_text"
+        id="alert_icon_id"
+        alert_icon_id="icon-id"
+        alert_icon_alt_text="alt"
+        type="info"
         message_heading="Information"
         message_body="You may wish to print this page..."
       />

__tests__/components/Date.test.js

@@ -0,0 +1,24 @@
+import { render, screen } from '@testing-library/react'
+import '@testing-library/jest-dom/extend-expect'
+import { axe, toHaveNoViolations } from 'jest-axe'
+import { Date } from '../../components/Date'
+
+expect.extend(toHaveNoViolations)
+
+describe('Date', () => {
+  it('renders Date', () => {
+    render(<Date id="testID" date="20230331T00001" label="label" />)
+    const title = screen.getByTestId('testID')
+    const caption = screen.getByText('20230331')
+    const label = screen.getByText('label')
+    expect(title).toBeInTheDocument()
+    expect(caption).toBeInTheDocument()
+    expect(label).toBeInTheDocument()
+  })
+
+  it('has no a11y viollations', async () => {
+    const { container } = render(<Date id="testID" date="20230331" />)
+    const results = await axe(container)
+    expect(results).toHaveNoViolations()
+  })
+})

__tests__/components/ErrorPage.test.js

@@ -0,0 +1,30 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import { render } from '@testing-library/react'
+import '@testing-library/jest-dom/extend-expect'
+import { ErrorPage } from '../../components/ErrorPage.js'
+import { axe, toHaveNoViolations } from 'jest-axe'
+
+expect.extend(toHaveNoViolations)
+
+describe('Error Pages', () => {
+  it('has no a11y violations 404', async () => {
+    const { container } = render(<ErrorPage lang="en" errType="404" isAuth />)
+    const results = await axe(container)
+    expect(results).toHaveNoViolations()
+  })
+
+  it('has no a11y violations 500', async () => {
+    const { container } = render(<ErrorPage lang="en" errType="500" isAuth />)
+    const results = await axe(container)
+    expect(results).toHaveNoViolations()
+  })
+
+  it('has no a11y violations 503', async () => {
+    const { container } = render(<ErrorPage lang="en" errType="503" isAuth />)
+    const results = await axe(container)
+    expect(results).toHaveNoViolations()
+  })
+})

__tests__/components/LoadingSpinner.test.js

@@ -0,0 +1,25 @@
+import { render, screen } from '@testing-library/react'
+import '@testing-library/jest-dom/extend-expect'
+import { axe, toHaveNoViolations } from 'jest-axe'
+import LoadingSpinner from '../../components/LoadingSpinner'
+
+expect.extend(toHaveNoViolations)
+
+describe('LoadingSpinner', () => {
+  it('renders the LoadingSpinner', () => {
+    const { container } = render(
+      <LoadingSpinner dataTestid="loading-spinner" text={'Loading'} />
+    )
+    expect(container).toBeTruthy()
+    const text = screen.getByText('Loading')
+    expect(text).toBeInTheDocument()
+  })
+
+  it('has no a11y viollations', async () => {
+    const { container } = render(
+      <LoadingSpinner dataTestid={'loading-spinner'} text={'loading'} />
+    )
+    const results = await axe(container)
+    expect(results).toHaveNoViolations()
+  })
+})

__tests__/components/PhaseBanner.test.js

@@ -41,7 +41,13 @@ describe('PhaseBanner', () => {
         bannerButtonText={'bannerButtonText'}
         bannerButtonLink={'bannerButtonLink'}
         icon={'bell'}
-        popupContent={popupContent}
+        popupContent={{
+          popupId: 'popup id',
+          popupTitle: 'pop up title',
+          popupDescription: 'pop up desc',
+          popupPrimaryBtn: { id: 'Test Primary Id', text: 'Test Primary Text' },
+          popupSecondaryBtn: { id: 'Test secont Id', text: 'Test second Text' },
+        }}
       ></PhaseBanner>
     )
     const bannerBoldText = screen.getByText('bannerBoldText')
@@ -64,7 +70,13 @@ describe('PhaseBanner', () => {
         bannerButtonText={'bannerButtonText'}
         bannerButtonLink={'bannerButtonLink'}
         icon={'bell'}
-        popupContent={popupContent}
+        popupContent={{
+          popupId: 'popup id',
+          popupTitle: 'pop up title',
+          popupDescription: 'pop up desc',
+          popupPrimaryBtn: { id: 'Test Primary Id', text: 'Test Primary Text' },
+          popupSecondaryBtn: { id: 'Test secont Id', text: 'Test second Text' },
+        }}
       ></PhaseBanner>
     )
     const results = await axe(container)

__tests__/components/TableContents.test.js

@@ -0,0 +1,35 @@
+import { render, screen } from '@testing-library/react'
+import '@testing-library/jest-dom/extend-expect'
+import { axe, toHaveNoViolations } from 'jest-axe'
+import TableContents from '../../components/TableContents'
+
+expect.extend(toHaveNoViolations)
+
+describe('TableContents', () => {
+  const { container } = render(
+    <TableContents
+      locale="en"
+      sectionList={[
+        {
+          name: 'Telephone',
+          link: '#telephone',
+        },
+        {
+          name: 'Callback',
+          link: '#callback',
+        },
+      ]}
+    />
+  )
+  it('renders TableContents', () => {
+    const listitem1 = screen.getByText('Telephone')
+    const listitem2 = screen.getByText('Callback')
+    expect(listitem1).toBeInTheDocument()
+    expect(listitem2).toBeInTheDocument()
+  })
+
+  it('has no a11y viollations', async () => {
+    const results = await axe(container)
+    expect(results).toHaveNoViolations()
+  })
+})

__tests__/pages/_error.test.js → __tests__/pages/404.test.js

@@ -3,7 +3,7 @@
  */
 import { render, screen } from '@testing-library/react'
 import '@testing-library/jest-dom'
-import CustomError from '../../pages/_error'
+import Custom404 from '../../pages/404'
 
 jest.mock('../../graphql/mappers/beta-banner-opt-out', () => ({
   getBetaBannerContent: () => {
@@ -25,42 +25,31 @@ jest.mock('../../graphql/mappers/beta-popup-exit', () => ({
 }))
 
 describe('custom error', () => {
-  it('renders custom statusCode 500 without crashing', () => {
-    render(
-      <CustomError
-        lang="en"
-        errType="500"
-        isAuth={false}
-        homePageLink={'/en/my-dashboard'}
-        accountPageLink="/"
-      />
-    )
-    expect(screen.getByText('Error')).toBeInTheDocument()
-  })
-
   it('renders custom statusCode 404 without crashing', () => {
     render(
-      <CustomError
+      <Custom404
         lang="en"
         errType="404"
         isAuth={false}
         homePageLink={'/en/my-dashboard'}
         accountPageLink="/"
       />
     )
-    expect(screen.getByText('Error')).toBeInTheDocument()
+    const element = screen.getByTestId('errorType')
+    expect(element.textContent).toEqual('Error 404')
   })
 
   it('renders custom error page in french without crashing', () => {
     render(
-      <CustomError
+      <Custom404
         lang="fr"
         errType="404"
         isAuth={false}
         homePageLink={'/fr/my-dashboard'}
         accountPageLink="/"
       />
     )
-    expect(screen.getByText('Erreur')).toBeInTheDocument()
+    const element = screen.getByTestId('errorType')
+    expect(element.textContent).toEqual('Erreur 404')
   })
 })

__tests__/pages/500.test.js

@@ -0,0 +1,55 @@
+/**
+ * @jest-environment jsdom
+ */
+import { render, screen } from '@testing-library/react'
+import '@testing-library/jest-dom'
+import Custom500 from '../../pages/500'
+
+jest.mock('../../graphql/mappers/beta-banner-opt-out', () => ({
+  getBetaBannerContent: () => {
+    return new Promise(function (resolve, reject) {
+      resolve({
+        en: {},
+        fr: {},
+      })
+    })
+  },
+}))
+
+jest.mock('../../graphql/mappers/beta-popup-exit', () => ({
+  getBetaPopupExitContent: () => {
+    return new Promise(function (resolve, reject) {
+      resolve({ en: {}, fr: {} })
+    })
+  },
+}))
+
+describe('custom error', () => {
+  it('renders custom statusCode 500 without crashing', () => {
+    render(
+      <Custom500
+        lang="en"
+        errType="500"
+        isAuth={false}
+        homePageLink={'/en/my-dashboard'}
+        accountPageLink="/"
+      />
+    )
+    const element = screen.getByTestId('errorType')
+    expect(element.textContent).toEqual('Error 500')
+  })
+
+  it('renders custom error page in french without crashing', () => {
+    render(
+      <Custom500
+        lang="fr"
+        errType="500"
+        isAuth={false}
+        homePageLink={'/fr/my-dashboard'}
+        accountPageLink="/"
+      />
+    )
+    const element = screen.getByTestId('errorType')
+    expect(element.textContent).toEqual('Erreur 500')
+  })
+})

components/Date.js

@@ -0,0 +1,35 @@
+import PropTypes from 'prop-types'
+
+export function Date(props) {
+  const { id, label, date } = props
+  const dateFormatted = date ? date.split('T')[0] : 'NA'
+  return (
+    <dl id={id} data-testid={id} className="mt-8 py-2 font-body">
+      <dt className="inline">{label}</dt>
+      <dd className="inline">
+        {dateFormatted === 'NA' ? (
+          <time>{` ${dateFormatted}`}</time>
+        ) : (
+          <time dateTime={dateFormatted}>{` ${dateFormatted}`}</time>
+        )}
+      </dd>
+    </dl>
+  )
+}
+
+Date.propTypes = {
+  /**
+   * component id
+   */
+  id: PropTypes.string,
+
+  /**
+   * Text to show before date, defaults to "Date Modified: "
+   */
+  label: PropTypes.string,
+
+  /**
+   * Date string in format yyyyMMdd
+   */
+  date: PropTypes.string,
+}