diff --git a/.eslintrc.js b/.eslintrc.js index 6fe8c0731..d28a32e08 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -2,6 +2,7 @@ * @type {import("eslint").Linter.Config} */ module.exports = { + ignorePatterns: ['next-env.d.ts'], extends: [ 'plugin:@typescript-eslint/eslint-recommended', 'plugin:react/recommended', @@ -167,7 +168,7 @@ module.exports = { 'vitest/consistent-test-it': ['error', { fn: 'it', withinDescribe: 'it' }], 'vitest/expect-expect': [ 'error', - { assertFunctionNames: ['expect', 'createShallowSnapshotTest', 'createSnapshotTest'] }, + { assertFunctionNames: ['expect', 'createSnapshotTest'] }, ], 'vitest/prefer-lowercase-title': ['error', { ignore: ['describe'] }], 'vitest/no-test-prefixes': 'error', diff --git a/.nvmrc b/.nvmrc index 2bd5a0a98..a45fd52cc 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -22 +24 diff --git a/.storybook/OCTheme.js b/.storybook/OCTheme.js index 6151b8268..d8cddb19b 100644 --- a/.storybook/OCTheme.js +++ b/.storybook/OCTheme.js @@ -1,4 +1,4 @@ -import { create } from '@storybook/theming/create'; +import { create } from 'storybook/theming/create'; export default create({ base: 'dark', diff --git a/.storybook/main.ts b/.storybook/main.ts index 8bf423187..e6ef8e523 100644 --- a/.storybook/main.ts +++ b/.storybook/main.ts @@ -1,4 +1,4 @@ -const svgoConfig = require('../common/config/svgo'); +import svgoConfig from '../common/config/svgo'; import type { StorybookConfig } from '@storybook/nextjs'; const config: StorybookConfig = { @@ -7,14 +7,11 @@ const config: StorybookConfig = { '../components/**/__stories__/*.stories.@(js|jsx|mjs|ts|tsx)', ], staticDirs: ['../public'], - addons: [ - '@storybook/addon-essentials', - { - name: '@storybook/addon-styling', - /** @see https://storybook.js.org/recipes/tailwindcss#:~:text=then%20leave%20the%20options%20object%20empty. */ - options: {}, - }, - ], + addons: ['@storybook/addon-docs'], + framework: { + name: '@storybook/nextjs', + options: {}, + }, webpackFinal: async config => { // Find the Storybook Webpack rule relevant to SVG files. // @ts-expect-error => 'config.module' is possibly 'undefined'.ts(18048) @@ -48,13 +45,6 @@ const config: StorybookConfig = { return config; }, - framework: { - name: '@storybook/nextjs', - options: {}, - }, - docs: { - autodocs: true, - }, }; export default config; diff --git a/.storybook/manager.js b/.storybook/manager.js index af159b636..535b96b0c 100644 --- a/.storybook/manager.js +++ b/.storybook/manager.js @@ -1,4 +1,4 @@ -import { addons } from '@storybook/addons'; +import { addons } from 'storybook/manager-api'; import OCTheme from './OCTheme'; addons.setConfig({ diff --git a/.storybook/preview.js b/.storybook/preview.js index a9f4bed49..d88ee72f8 100644 --- a/.storybook/preview.js +++ b/.storybook/preview.js @@ -1,5 +1,5 @@ import 'common/styles/globals.css'; -import * as viewports from '@storybook/addon-viewport'; +import { MINIMAL_VIEWPORTS, INITIAL_VIEWPORTS } from 'storybook/viewport'; export const decorators = [ Story => ( @@ -9,13 +9,14 @@ export const decorators = [ ), ]; +export const tags = ['autodocs']; + const preview = { parameters: { - actions: { argTypesRegex: '^on[A-Z].*' }, viewport: { viewports: { - ...viewports.MINIMAL_VIEWPORTS, - ...viewports.INITIAL_VIEWPORTS, + ...MINIMAL_VIEWPORTS, + ...INITIAL_VIEWPORTS, }, }, }, diff --git a/components/Accordion/__stories__/Accordion.stories.tsx b/components/Accordion/__stories__/Accordion.stories.tsx index 5f376fa01..a2692a7fa 100644 --- a/components/Accordion/__stories__/Accordion.stories.tsx +++ b/components/Accordion/__stories__/Accordion.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import Accordion from '../Accordion'; type AccordionStoryType = StoryObj; diff --git a/components/Accordion/__tests__/Accordion.test.tsx b/components/Accordion/__tests__/Accordion.test.tsx index 5ae68f939..de5937441 100644 --- a/components/Accordion/__tests__/Accordion.test.tsx +++ b/components/Accordion/__tests__/Accordion.test.tsx @@ -1,18 +1,23 @@ import { fireEvent, render } from '@testing-library/react'; -import { composeStory } from '@storybook/react'; import { ACCORDION_CONTENT, ACCORDION_TOGGLE_BUTTON, SCREEN_READER_ONLY, } from 'common/constants/testIDs'; import { toggleMessages } from '../../ScreenReaderOnly/ScreenReaderOnly'; -import meta, { Default } from '../__stories__/Accordion.stories'; +import Accordion from '../Accordion'; -const AccordionStory = composeStory(Default, meta); +const defaultProps = { + accessibilityId: '1', + content: { + headingChildren:
Can be JSX
, + bodyChildren:

Can also be JSX

, + }, +}; describe('Accordion', () => { it('should render invisible text that turns visible on toggle click', async () => { - const component = render(); + const component = render(); const Content = component.queryByTestId(ACCORDION_CONTENT); expect(Content?.classList.contains('hidden')).toBe(true); @@ -25,7 +30,7 @@ describe('Accordion', () => { describe('Accordion Accessibility', () => { it('should display the correct screenReader text for toggle button', async () => { - const component = render(); + const component = render(); const Button = component.queryByTestId(SCREEN_READER_ONLY)!; expect(Button.textContent).toBe(toggleMessages.open); diff --git a/components/Alert/__stories__/Alert.stories.tsx b/components/Alert/__stories__/Alert.stories.tsx index d088fc679..a8891211d 100644 --- a/components/Alert/__stories__/Alert.stories.tsx +++ b/components/Alert/__stories__/Alert.stories.tsx @@ -1,4 +1,5 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; +import { fn } from 'storybook/test'; import Alert from '../Alert'; type AlertStoryType = StoryObj; @@ -6,6 +7,9 @@ type AlertStoryType = StoryObj; const meta: Meta = { title: 'Alert', component: Alert, + args: { + onClose: fn(), + }, }; export default meta; diff --git a/components/Alert/__tests__/Alert.test.tsx b/components/Alert/__tests__/Alert.test.tsx index ddfdc3f47..e2730c91f 100644 --- a/components/Alert/__tests__/Alert.test.tsx +++ b/components/Alert/__tests__/Alert.test.tsx @@ -1,22 +1,21 @@ import { fireEvent, render } from '@testing-library/react'; -import { composeStory } from '@storybook/react'; import createSnapshotTest from 'test-utils/createSnapshotTest'; import { ALERT_CLOSE_BUTTON } from 'common/constants/testIDs'; -import meta, { ErrorAlert, SuccessAlert, WarningAlert } from '../__stories__/Alert.stories'; - -const ErrorAlertStory = composeStory(ErrorAlert, meta); -const SuccessAlertStory = composeStory(SuccessAlert, meta); -const WarningAlertStory = composeStory(WarningAlert, meta); +import Alert from '../Alert'; describe('Alert', () => { it('should render error alert with required props', () => { - createSnapshotTest(); + createSnapshotTest(Error Alert JSX or Text); }); it('should call close handler when close alert button clicked', () => { const onCloseMock = vi.fn(); - const { queryByTestId } = render(); + const { queryByTestId } = render( + + Success Alert JSX or Text + , + ); expect(onCloseMock).toHaveBeenCalledTimes(0); @@ -26,7 +25,7 @@ describe('Alert', () => { }); it('should NOT render button if close handler not provided', () => { - const { queryByTestId } = render(); + const { queryByTestId } = render(Warning Alert JSX or Text); expect(queryByTestId(ALERT_CLOSE_BUTTON)).toBeNull(); }); diff --git a/components/Alert/__tests__/__snapshots__/Alert.test.tsx.snap b/components/Alert/__tests__/__snapshots__/Alert.test.tsx.snap index 417257c46..73c32dd3a 100644 --- a/components/Alert/__tests__/__snapshots__/Alert.test.tsx.snap +++ b/components/Alert/__tests__/__snapshots__/Alert.test.tsx.snap @@ -1,13 +1,15 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Alert > should render error alert with required props 1`] = ` -
- - Error Alert JSX or Text - +
+
`; diff --git a/components/Badge/__stories__/Badge.stories.tsx b/components/Badge/__stories__/Badge.stories.tsx index 618831396..57f8807b1 100644 --- a/components/Badge/__stories__/Badge.stories.tsx +++ b/components/Badge/__stories__/Badge.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import GithubIcon from 'public/static/images/icons/github_logo.svg'; import TwitterIcon from 'public/static/images/icons/twitter_logo.svg'; import PinterestIcon from 'public/static/images/icons/pinterest_logo.svg'; diff --git a/components/Badge/__tests__/__snapshots__/Badge.test.tsx.snap b/components/Badge/__tests__/__snapshots__/Badge.test.tsx.snap index da7001535..6fa6afb8f 100644 --- a/components/Badge/__tests__/__snapshots__/Badge.test.tsx.snap +++ b/components/Badge/__tests__/__snapshots__/Badge.test.tsx.snap @@ -1,41 +1,69 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Badge > should render with many props assigned 1`] = ` -
- GitHub Logo", - } - } - viewBox="0 0 54 54" - /> -
+
- Badge Icon -
-
+ + + + GitHub Logo + + + + + +
+ Badge Icon +
+ +
`; exports[`Badge > should render with required props 1`] = ` -
- GitHub Logo", - } - } - viewBox="0 0 54 54" - /> -
+
- Testing -
-
+ + + + GitHub Logo + + + + + +
+ Testing +
+ + `; diff --git a/components/Branding/ColorSection/__tests__/ColorSection.test.tsx b/components/Branding/ColorSection/__tests__/ColorSection.test.tsx index d01c6a83e..041a2ea1c 100644 --- a/components/Branding/ColorSection/__tests__/ColorSection.test.tsx +++ b/components/Branding/ColorSection/__tests__/ColorSection.test.tsx @@ -1,9 +1,9 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import ColorSection from '../ColorSection'; describe('ColorSection', () => { it('should render with required props', () => { - createShallowSnapshotTest(); + createSnapshotTest(); }); }); diff --git a/components/Branding/ColorSection/__tests__/__snapshots__/ColorSection.test.tsx.snap b/components/Branding/ColorSection/__tests__/__snapshots__/ColorSection.test.tsx.snap index 3f6dcec03..ea523a378 100644 --- a/components/Branding/ColorSection/__tests__/__snapshots__/ColorSection.test.tsx.snap +++ b/components/Branding/ColorSection/__tests__/__snapshots__/ColorSection.test.tsx.snap @@ -1,33 +1,166 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`ColorSection > should render with required props 1`] = ` -, - , - , - , - , - ] - } - hasTitleUnderline={true} - theme="white" - title="Colors" -/> +
+
+
+
+

+
+ + + Scroll to + Colors + + + + + Link Icon + + + + + + +
+ Colors +

+
+
+
+ + A block of the color primary + +
+
+
+ PRIMARY +
+ #3ED6F0 +
+
+
+ + A block of the color secondary + +
+
+
+ SECONDARY +
+ #252E3E +
+
+
+ + A block of the color gray + +
+
+
+ GRAY +
+ #E2E2E2 +
+
+
+ + A block of the color white + +
+
+
+ WHITE +
+ #F7F7F7 +
+
+
+ + A block of the color burnt orange + +
+
+
+ BURNT ORANGE +
+ #B25134 +
+
+
+
+
+
`; diff --git a/components/Branding/FontSection/__tests__/FontSection.test.tsx b/components/Branding/FontSection/__tests__/FontSection.test.tsx index eea0622fe..af20e52c7 100644 --- a/components/Branding/FontSection/__tests__/FontSection.test.tsx +++ b/components/Branding/FontSection/__tests__/FontSection.test.tsx @@ -1,9 +1,9 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import FontSection from '../FontSection'; describe('FontSection', () => { it('should render with required props', () => { - createShallowSnapshotTest(); + createSnapshotTest(); }); }); diff --git a/components/Branding/FontSection/__tests__/__snapshots__/FontSection.test.tsx.snap b/components/Branding/FontSection/__tests__/__snapshots__/FontSection.test.tsx.snap index cc0f28dea..058546899 100644 --- a/components/Branding/FontSection/__tests__/__snapshots__/FontSection.test.tsx.snap +++ b/components/Branding/FontSection/__tests__/__snapshots__/FontSection.test.tsx.snap @@ -1,41 +1,94 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`FontSection > should render with required props 1`] = ` - +
+
+
-
  • +

    -
    - DIN Condensed Bold -
    -

    - Sphinx of black quartz, judge my vow! -

    + + + Scroll to + Typography + + + + + Link Icon + + + + + +
    -

    • -
  • -
    -
    - Encode Sans -
    -

    - Sphinx of black quartz, judge my vow! -

    -
    -
    • - , - ] - } - hasTitleUnderline={true} - theme="gray" - title="Typography" -/> + Typography + +
    +
    +
      +
    • +
      +
      + DIN Condensed Bold +
      +

      + Sphinx of black quartz, judge my vow! +

      +
      +
      • +
    • +
      +
      + Encode Sans +
      +

      + Sphinx of black quartz, judge my vow! +

      +
      +
      • +
    +
    +
    +
    + `; diff --git a/components/Branding/LogoSection/__tests__/LogoSection.test.tsx b/components/Branding/LogoSection/__tests__/LogoSection.test.tsx index a7e4dedee..003b1af53 100644 --- a/components/Branding/LogoSection/__tests__/LogoSection.test.tsx +++ b/components/Branding/LogoSection/__tests__/LogoSection.test.tsx @@ -1,9 +1,9 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import LogoSection from '../LogoSection'; describe('LogoSection', () => { it('should render with required props', () => { - createShallowSnapshotTest(); + createSnapshotTest(); }); }); diff --git a/components/Branding/LogoSection/__tests__/__snapshots__/LogoSection.test.tsx.snap b/components/Branding/LogoSection/__tests__/__snapshots__/LogoSection.test.tsx.snap index 323440954..dccf813f9 100644 --- a/components/Branding/LogoSection/__tests__/__snapshots__/LogoSection.test.tsx.snap +++ b/components/Branding/LogoSection/__tests__/__snapshots__/LogoSection.test.tsx.snap @@ -1,290 +1,356 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`LogoSection > should render with required props 1`] = ` - +
    +
    +
    -
  • -
    +
    - Small Logos -
    -

    - For use when Operation Code's logo name is between 0-1 inch in height. In most cases, use the Original Small Logo. The Stacked Small Logo is to be used where graphics needs are larger in vertical height than horizontal width with the Operation Code logo name still under 1 inch in height. -

    -
      -
    • -
      + + Scroll to + Logo + + - TYPICAL -
      -
        -
      • - + + Link Icon + + + + + + +
    • + Logo + +
    +
    +
      +
    • +
      + Small Logos +
      +

      + For use when Operation Code's logo name is between 0-1 inch in height. In most cases, use the Original Small Logo. The Stacked Small Logo is to be used where graphics needs are larger in vertical height than horizontal width with the Operation Code logo name still under 1 inch in height. +

      +
        +
      • +
        + TYPICAL +
        +
          +
        • +
          +
          + Blue +
          + Small Blue Accented Logo - } - isImageFirst={false} - label="Blue" - /> -
          • -
        • - +
          • +
        • +
          +
          + Red +
          + Small Red Accented Logo - } - isImageFirst={false} - label="Red" - /> -
          • -
        • - +
          • +
        • +
          +
          + Slate +
          + Small Unaccented Logo - } - isImageFirst={false} - label="Slate" - /> -
          • -
        • - +
          • +
        • +
          +
          + White +
          + Small White Accented Logo - } - isImageFirst={false} - label="White" - /> -
          • -
        -
        • -
      • -
        - Stacked Logos -
        -

        - Use the Large Stacked Original logo in areas where you have more vertical space than horizontal. Only use the Red Stacked Logo for special holidays such as Thanksgiving, fall events, and Christmas. The Light Stacked Logo is to be used with dark or contrasting bright colored backgrounds. -

        -
          -
        • - +
          • +
        +
        • +
      • +
        + Stacked Logos +
        +

        + Use the Large Stacked Original logo in areas where you have more vertical space than horizontal. Only use the Red Stacked Logo for special holidays such as Thanksgiving, fall events, and Christmas. The Light Stacked Logo is to be used with dark or contrasting bright colored backgrounds. +

        +
          +
        • +
          +
          + Blue +
          + Large Stacked Original - } - isImageFirst={false} - label="Blue" - /> -
          • -
        • - +
          • +
        • +
          +
          + Red +
          + Red Stacked Logo - } - isImageFirst={false} - label="Red" - /> -
          • -
        • - +
          • +
        • +
          +
          + Slate +
          + Light Stacked Logo - } - isImageFirst={false} - label="Slate" - /> -
          • -
        -
        • -
      • -
        - Medals / Badges -
        -

        - Use the following images when you are prompted to upload a thumbnail logo only or profile photo. In most cases, use the OC Blue option. The Red option should only be used for holidays and special events (such as Thanksgiving, fall, or Christmas). The Navy option should be used memorandums or lighter bright colored backgrounds. -

        -

        - You may also use them as a profile photo or thumbnail. They should be used to accompany corporate sponsors or alliance partnerships on shared branding. Use the original OC Blue option in most cases, except the Red option for special events and holidays (Thanksgiving, fall and Christmas). The Navy option may be used with light backgrounds and bright colored backgrounds. -

        -
          -
        • - +
          • +
        +
        • +
      • +
        + Medals / Badges +
        +

        + Use the following images when you are prompted to upload a thumbnail logo only or profile photo. In most cases, use the OC Blue option. The Red option should only be used for holidays and special events (such as Thanksgiving, fall, or Christmas). The Navy option should be used memorandums or lighter bright colored backgrounds. +

        +

        + You may also use them as a profile photo or thumbnail. They should be used to accompany corporate sponsors or alliance partnerships on shared branding. Use the original OC Blue option in most cases, except the Red option for special events and holidays (Thanksgiving, fall and Christmas). The Navy option may be used with light backgrounds and bright colored backgrounds. +

        +
          +
        • +
          +
          + OC Blue +
          + OC Blue Medal - } - isImageFirst={false} - label="OC Blue" - /> -
          • -
        • - +
          • +
        • +
          +
          + Red +
          + Red Medal - } - isImageFirst={false} - label="Red" - /> -
          • -
        • - +
          • +
        • +
          +
          + Navy +
          + Navy Medal - } - isImageFirst={false} - label="Navy" - /> -
          • -
        -
        • -
      -
      • -
    • -
      - Large Logos -
      -

      - Use the Original Large Logo in almost all cases above 1 inch in height. The Red Large Logo is to be used in special events (such as Thanksgiving, fall or Christmas), and the Light Large Logo is to be used with dark backgrounds or bright colored backgrounds. -

      -
        -
      • - +
        • +
      +
      • +
    + +
  • +
    + Large Logos +
    +

    + Use the Original Large Logo in almost all cases above 1 inch in height. The Red Large Logo is to be used in special events (such as Thanksgiving, fall or Christmas), and the Light Large Logo is to be used with dark backgrounds or bright colored backgrounds. +

    +
      +
    • +
      +
      + Blue +
      + Original Large Logo - } - isImageFirst={false} - label="Blue" - /> -
      • -
    • - +
      • +
    • +
      +
      + Red +
      + Red Large Logo - } - isImageFirst={false} - label="Red" - /> -
      • -
    • - +
      • +
    • +
      +
      + Slate +
      + Large Unaccented Logo - } - isImageFirst={false} - label="Slate" - /> -
      • -
    • - +
      • +
    • +
      +
      + White +
      + Large White Accented Logo - } - isImageFirst={false} - label="White" - /> -
      • -
    -
    • - , - ] - } - hasTitleUnderline={true} - theme="gray" - title="Logo" -/> + + + + + +
    +
    + + `; diff --git a/components/Branding/Swatch/__tests__/Swatch.test.tsx b/components/Branding/Swatch/__tests__/Swatch.test.tsx index 17d92e2e8..36786ab64 100644 --- a/components/Branding/Swatch/__tests__/Swatch.test.tsx +++ b/components/Branding/Swatch/__tests__/Swatch.test.tsx @@ -1,9 +1,9 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import Swatch from '../Swatch'; describe('Swatch', () => { it('should render with required props', () => { - createShallowSnapshotTest(); + createSnapshotTest(); }); }); diff --git a/components/Branding/Swatch/__tests__/__snapshots__/Swatch.test.tsx.snap b/components/Branding/Swatch/__tests__/__snapshots__/Swatch.test.tsx.snap index cb477b5c2..6a2cda224 100644 --- a/components/Branding/Swatch/__tests__/__snapshots__/Swatch.test.tsx.snap +++ b/components/Branding/Swatch/__tests__/__snapshots__/Swatch.test.tsx.snap @@ -1,25 +1,26 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Swatch > should render with required props 1`] = ` -
    - - A block of the color Blue - -
    -
    -
    - BLUE -
    - #0000FF -
    -
    +
    +
    + + A block of the color Blue + +
    +
    +
    + BLUE +
    + #0000FF +
    +
    +
    `; diff --git a/components/Buttons/Button/__stories__/Button.stories.tsx b/components/Buttons/Button/__stories__/Button.stories.tsx index 30507b544..b62c91ca7 100644 --- a/components/Buttons/Button/__stories__/Button.stories.tsx +++ b/components/Buttons/Button/__stories__/Button.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import Button from '../Button'; type ButtonStoryType = StoryObj; diff --git a/components/Buttons/Button/__tests__/__snapshots__/Button.test.tsx.snap b/components/Buttons/Button/__tests__/__snapshots__/Button.test.tsx.snap index 80fc517cd..0cea71114 100644 --- a/components/Buttons/Button/__tests__/__snapshots__/Button.test.tsx.snap +++ b/components/Buttons/Button/__tests__/__snapshots__/Button.test.tsx.snap @@ -1,28 +1,29 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Button > should render with many props assigned 1`] = ` - +
    + +
    `; exports[`Button > should render with required props 1`] = ` - +
    + +
    `; diff --git a/components/Buttons/CloseButton/__stories__/CloseButton.stories.tsx b/components/Buttons/CloseButton/__stories__/CloseButton.stories.tsx index f5415dbf0..a85980ef9 100644 --- a/components/Buttons/CloseButton/__stories__/CloseButton.stories.tsx +++ b/components/Buttons/CloseButton/__stories__/CloseButton.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import CloseButton from '../CloseButton'; type CloseButtonStoryType = StoryObj; diff --git a/components/Buttons/CloseButton/__tests__/__snapshots__/CloseButton.test.tsx.snap b/components/Buttons/CloseButton/__tests__/__snapshots__/CloseButton.test.tsx.snap index 793da0b4a..e45a972ae 100644 --- a/components/Buttons/CloseButton/__tests__/__snapshots__/CloseButton.test.tsx.snap +++ b/components/Buttons/CloseButton/__tests__/__snapshots__/CloseButton.test.tsx.snap @@ -1,26 +1,38 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`CloseButton > should render with just required props passed 1`] = ` - + + Close + + + + + Plus Symbol + + + + + + + `; diff --git a/components/Buttons/LinkButton/LinkButton.tsx b/components/Buttons/LinkButton/LinkButton.tsx index 2c70ffa5f..a1238a9bd 100644 --- a/components/Buttons/LinkButton/LinkButton.tsx +++ b/components/Buttons/LinkButton/LinkButton.tsx @@ -49,10 +49,8 @@ export default function LinkButton({ {children} ) : ( - - - {children} - + + {children} ); } diff --git a/components/Buttons/LinkButton/__stories__/LinkButton.stories.tsx b/components/Buttons/LinkButton/__stories__/LinkButton.stories.tsx index 653cbc85e..efc34e119 100644 --- a/components/Buttons/LinkButton/__stories__/LinkButton.stories.tsx +++ b/components/Buttons/LinkButton/__stories__/LinkButton.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import LinkButton from '../LinkButton'; type LinkButtonStoryType = StoryObj; diff --git a/components/Buttons/LinkButton/__tests__/__snapshots__/LinkButton.test.tsx.snap b/components/Buttons/LinkButton/__tests__/__snapshots__/LinkButton.test.tsx.snap index 948b3a60f..7d5e34c0c 100644 --- a/components/Buttons/LinkButton/__tests__/__snapshots__/LinkButton.test.tsx.snap +++ b/components/Buttons/LinkButton/__tests__/__snapshots__/LinkButton.test.tsx.snap @@ -1,32 +1,32 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`LinkButton > should render with many props assigned 1`] = ` - - Test - + - Opens in new window - - + Test + + Opens in new window + + + `; exports[`LinkButton > should render with required props 1`] = ` - - Test - + `; diff --git a/components/Cards/Card/__stories__/Card.stories.tsx b/components/Cards/Card/__stories__/Card.stories.tsx index 23eb04add..55ebbbf35 100644 --- a/components/Cards/Card/__stories__/Card.stories.tsx +++ b/components/Cards/Card/__stories__/Card.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import { descriptions } from 'common/constants/descriptions'; import Card from '../Card'; diff --git a/components/Cards/Card/__tests__/__snapshots__/Card.test.tsx.snap b/components/Cards/Card/__tests__/__snapshots__/Card.test.tsx.snap index 5eb7faa9a..9287a3dec 100644 --- a/components/Cards/Card/__tests__/__snapshots__/Card.test.tsx.snap +++ b/components/Cards/Card/__tests__/__snapshots__/Card.test.tsx.snap @@ -1,17 +1,21 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Card > should render with many props assigned 1`] = ` -
    - Test -
    +
    +
    + Test +
    +
    `; exports[`Card > should render with required props 1`] = ` -
    - Test -
    +
    +
    + Test +
    +
    `; diff --git a/components/Cards/FlatCard/FlatCard.tsx b/components/Cards/FlatCard/FlatCard.tsx index 7552b0fe5..d522ee578 100644 --- a/components/Cards/FlatCard/FlatCard.tsx +++ b/components/Cards/FlatCard/FlatCard.tsx @@ -41,8 +41,8 @@ function FlatCard({ button: Button, children, className, header, image }: FlatCa {image.alt diff --git a/components/Cards/FlatCard/__stories__/FlatCard.stories.tsx b/components/Cards/FlatCard/__stories__/FlatCard.stories.tsx index 3dbcf7ac1..419111e9e 100644 --- a/components/Cards/FlatCard/__stories__/FlatCard.stories.tsx +++ b/components/Cards/FlatCard/__stories__/FlatCard.stories.tsx @@ -1,4 +1,4 @@ -import type { StoryFn } from '@storybook/react'; +import type { StoryFn } from '@storybook/nextjs'; import { descriptions } from 'common/constants/descriptions'; import FlatCard from '../FlatCard'; diff --git a/components/Cards/FlatCard/__tests__/__snapshots__/FlatCard.test.tsx.snap b/components/Cards/FlatCard/__tests__/__snapshots__/FlatCard.test.tsx.snap index fd50cd95f..dd071f995 100644 --- a/components/Cards/FlatCard/__tests__/__snapshots__/FlatCard.test.tsx.snap +++ b/components/Cards/FlatCard/__tests__/__snapshots__/FlatCard.test.tsx.snap @@ -1,65 +1,66 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`FlatCard > should render with many props assigned 1`] = ` -
    -
    +
    -

    - Main heading -

    -
    - Sub heading -
    -
    -
    -
    -

    - Example content goes here -

    -

    - More content goes here -

    -
    -
    - - Widget Action - +

    + Main heading +

    +
    + Sub heading +
    +
    +
    +
    +

    + Example content goes here +

    +

    + More content goes here +

    +
    +
    + + Widget Action + +
    - -
    + + `; exports[`FlatCard > should render with required props 1`] = ` -
    -
    +
    -
    -

    - Example content goes here -

    -

    - More content goes here -

    +
    +
    +

    + Example content goes here +

    +

    + More content goes here +

    +
    -
    -
    +
    + `; diff --git a/components/Cards/ImageCard/ImageCard.tsx b/components/Cards/ImageCard/ImageCard.tsx index ba00f27dc..98c3ed1f9 100644 --- a/components/Cards/ImageCard/ImageCard.tsx +++ b/components/Cards/ImageCard/ImageCard.tsx @@ -26,7 +26,7 @@ function ImageCard({ imageSource, isImageFirst = true, }: ImageCardPropsType) { - const ImageComponent = {alt}; + const ImageComponent = {alt}; const ContentComponent = (
    {children}
    diff --git a/components/Cards/ImageCard/__stories__/ImageCard.stories.tsx b/components/Cards/ImageCard/__stories__/ImageCard.stories.tsx index e49ecba0b..96ceada44 100644 --- a/components/Cards/ImageCard/__stories__/ImageCard.stories.tsx +++ b/components/Cards/ImageCard/__stories__/ImageCard.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import { descriptions } from 'common/constants/descriptions'; import { s3 } from 'common/constants/urls'; import ImageCard from '../ImageCard'; diff --git a/components/Cards/ImageCard/__tests__/ImageCard.test.tsx b/components/Cards/ImageCard/__tests__/ImageCard.test.tsx index 761d20a5c..653787601 100644 --- a/components/Cards/ImageCard/__tests__/ImageCard.test.tsx +++ b/components/Cards/ImageCard/__tests__/ImageCard.test.tsx @@ -1,9 +1,9 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import ImageCard from '../ImageCard'; describe('ImageCard', () => { it('should render with required props', () => { - createShallowSnapshotTest( + createSnapshotTest(

    Testing!

    , @@ -11,7 +11,7 @@ describe('ImageCard', () => { }); it('should render with many props assigned', () => { - createShallowSnapshotTest( + createSnapshotTest( should render with many props assigned 1`] = ` - - +
    +

    Testing!

    -
    - - +
    +
    `; exports[`ImageCard > should render with required props 1`] = ` - - +
    +
    -

    Testing!

    - - +
    +
    `; diff --git a/components/Cards/ValueCard/__stories__/ValueCard.stories.tsx b/components/Cards/ValueCard/__stories__/ValueCard.stories.tsx index 5d8409a21..c7bcee357 100644 --- a/components/Cards/ValueCard/__stories__/ValueCard.stories.tsx +++ b/components/Cards/ValueCard/__stories__/ValueCard.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import { descriptions } from 'common/constants/descriptions'; import ValueCard from '../ValueCard'; diff --git a/components/Cards/ValueCard/__tests__/__snapshots__/ValueCard.test.tsx.snap b/components/Cards/ValueCard/__tests__/__snapshots__/ValueCard.test.tsx.snap index a4f030748..6483b6211 100644 --- a/components/Cards/ValueCard/__tests__/__snapshots__/ValueCard.test.tsx.snap +++ b/components/Cards/ValueCard/__tests__/__snapshots__/ValueCard.test.tsx.snap @@ -1,16 +1,18 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`ValueCard > should render with required props 1`] = ` -
    -

    +
    - Testing -

    -

    - Testing is good for the soul and scientifically proven to make puppies happy. -

    -
    +

    + Testing +

    +

    + Testing is good for the soul and scientifically proven to make puppies happy. +

    + + `; diff --git a/components/Container/__stories__/Container.stories.tsx b/components/Container/__stories__/Container.stories.tsx index ffb2f42a0..878e455c4 100644 --- a/components/Container/__stories__/Container.stories.tsx +++ b/components/Container/__stories__/Container.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import { descriptions } from 'common/constants/descriptions'; import Container from '../Container'; diff --git a/components/Container/__tests__/__snapshots__/Container.test.tsx.snap b/components/Container/__tests__/__snapshots__/Container.test.tsx.snap index cd63958cb..23f94a265 100644 --- a/components/Container/__tests__/__snapshots__/Container.test.tsx.snap +++ b/components/Container/__tests__/__snapshots__/Container.test.tsx.snap @@ -1,18 +1,16 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Container > should render with many props assigned 1`] = ` -
    +
    - Test Children +
    + Test Children +
    `; diff --git a/components/Content/__stories__/Content.stories.tsx b/components/Content/__stories__/Content.stories.tsx index 1425d9b65..c08b1669b 100644 --- a/components/Content/__stories__/Content.stories.tsx +++ b/components/Content/__stories__/Content.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import Content from '../Content'; type ContentStoryType = StoryObj; diff --git a/components/Content/__tests__/__snapshots__/Content.test.tsx.snap b/components/Content/__tests__/__snapshots__/Content.test.tsx.snap index 36dae3e48..c99eb6f2e 100644 --- a/components/Content/__tests__/__snapshots__/Content.test.tsx.snap +++ b/components/Content/__tests__/__snapshots__/Content.test.tsx.snap @@ -1,83 +1,98 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Content > should render with many props assigned 1`] = ` -
    +
    - +
    +
    +
    +

    + some multi-column test content +

    - Testing! - -
    -
    -
    -

    - some multi-column test content -

    +
    + OH YEAH!! +
    +
    -
    - OH YEAH!! -
    -
    `; exports[`Content > should render with required props 1`] = ` -
    +
    -
    -

    - some test content -

    +
    +
    +

    + some test content +

    +
    diff --git a/components/Drawer/__stories__/Drawer.stories.tsx b/components/Drawer/__stories__/Drawer.stories.tsx index 134721355..84fb53a8e 100644 --- a/components/Drawer/__stories__/Drawer.stories.tsx +++ b/components/Drawer/__stories__/Drawer.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import Drawer from '../Drawer'; type DrawerStorytype = StoryObj; diff --git a/components/Drawer/__tests__/__snapshots__/Drawer.test.tsx.snap b/components/Drawer/__tests__/__snapshots__/Drawer.test.tsx.snap index 5135fb48d..838e9ac72 100644 --- a/components/Drawer/__tests__/__snapshots__/Drawer.test.tsx.snap +++ b/components/Drawer/__tests__/__snapshots__/Drawer.test.tsx.snap @@ -1,25 +1,29 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Drawer > should render with many props assigned 1`] = ` -
    +
    `; exports[`Drawer > should render with required props 1`] = ` -
    +
    `; diff --git a/components/ErrorDisplay/__tests__/__snapshots__/ErrorDisplay.test.tsx.snap b/components/ErrorDisplay/__tests__/__snapshots__/ErrorDisplay.test.tsx.snap index a2dd59dcb..4a9d54f39 100644 --- a/components/ErrorDisplay/__tests__/__snapshots__/ErrorDisplay.test.tsx.snap +++ b/components/ErrorDisplay/__tests__/__snapshots__/ErrorDisplay.test.tsx.snap @@ -1,23 +1,25 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`ErrorDisplay > should render with just required props 1`] = ` -
    +
    -

    - 404 - ! -

    -

    - We're so ashamed. You definitely weren't supposed to see this... -

    +

    + 404 + ! +

    +

    + We're so ashamed. You definitely weren't supposed to see this... +

    +
    `; diff --git a/components/FeaturedJobItem/__stories__/FeaturedJobItem.stories.tsx b/components/FeaturedJobItem/__stories__/FeaturedJobItem.stories.tsx index 4c93ca47f..21a1dd33b 100644 --- a/components/FeaturedJobItem/__stories__/FeaturedJobItem.stories.tsx +++ b/components/FeaturedJobItem/__stories__/FeaturedJobItem.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import { descriptions } from 'common/constants/descriptions'; import FeaturedJobItem from '../FeaturedJobItem'; diff --git a/components/FeaturedJobItem/__tests__/__snapshots__/FeaturedJobItem.test.tsx.snap b/components/FeaturedJobItem/__tests__/__snapshots__/FeaturedJobItem.test.tsx.snap index 5d3a4fcca..159c7fe7f 100644 --- a/components/FeaturedJobItem/__tests__/__snapshots__/FeaturedJobItem.test.tsx.snap +++ b/components/FeaturedJobItem/__tests__/__snapshots__/FeaturedJobItem.test.tsx.snap @@ -1,177 +1,256 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`FeaturedJobItem > should render with many props assigned 1`] = ` -
    - -
    - Experienced React Engineer -
    - +
    + - Opens in new window - - External Link Symbol", - } - } - viewBox="0 0 448 512" - /> - -
    -
    - Building", - } - } - viewBox="0 0 448 512" - /> +
    + Experienced React Engineer +
    - Formidable Labs + Opens in new window -
    + + + + External Link Symbol + + + + + +
    - Map Marker", - } - } - viewBox="0 0 384 512" - /> -
    -
    - Seattle - , - - - WA - , + + + + Building + + + + + + + Formidable Labs +
    +
    + + + + Map Marker + + + + + +
    + + Seattle + , + + + WA + , + + + United States + +
    +
    +
    + + + + Cloud With Up Arrow Inside + + + + + - United States + Remote - +
    -
    - Cloud With Up Arrow Inside", - } - } - viewBox="0 0 640 512" - /> - - Remote - -
    -
    -

    - As an Experienced React Engineer, you will do React things. -

    - + As an Experienced React Engineer, you will do React things. +

    + +
    `; exports[`FeaturedJobItem > should render with required props 1`] = ` - +

    + This is a fake role, since GitLab always has remote. +

    + +
    `; diff --git a/components/Footer/__tests__/Footer.test.tsx b/components/Footer/__tests__/Footer.test.tsx index 5f49c1c51..f4f7b2772 100644 --- a/components/Footer/__tests__/Footer.test.tsx +++ b/components/Footer/__tests__/Footer.test.tsx @@ -1,10 +1,10 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import Footer from '../Footer'; describe('Footer', () => { it('should render with no props passed', () => { vi.useFakeTimers().setSystemTime(new Date('2023-03-03')); - createShallowSnapshotTest(
    ); + createSnapshotTest(
    -
    - + +
    `; diff --git a/components/Form/Input/__stories__/Input.stories.tsx b/components/Form/Input/__stories__/Input.stories.tsx index 6e927aec5..7566a3fc9 100644 --- a/components/Form/Input/__stories__/Input.stories.tsx +++ b/components/Form/Input/__stories__/Input.stories.tsx @@ -1,5 +1,6 @@ +import type { ReactNode } from 'react'; import { Formik, Field } from 'formik'; -import type { StoryFn } from '@storybook/react'; +import type { StoryFn } from '@storybook/nextjs'; import Form from '../../Form'; import Input from '../Input'; @@ -49,7 +50,7 @@ export default { controls: { sort: 'requiredFirst' }, }, decorators: [ - (InputStory: () => JSX.Element) => ( + (InputStory: () => ReactNode) => ( <> NOTE: This component's story has no context outside of Formik and will not function diff --git a/components/Form/Input/__tests__/__snapshots__/Input.test.tsx.snap b/components/Form/Input/__tests__/__snapshots__/Input.test.tsx.snap index 81624a0bb..d56d41824 100644 --- a/components/Form/Input/__tests__/__snapshots__/Input.test.tsx.snap +++ b/components/Form/Input/__tests__/__snapshots__/Input.test.tsx.snap @@ -1,30 +1,29 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Input > should render with required props 1`] = ` -
    - +
    - + +
    + +
    `; diff --git a/components/Form/Label/__stories__/Label.stories.tsx b/components/Form/Label/__stories__/Label.stories.tsx index ac1f35f62..464e0e438 100644 --- a/components/Form/Label/__stories__/Label.stories.tsx +++ b/components/Form/Label/__stories__/Label.stories.tsx @@ -1,4 +1,4 @@ -import type { StoryFn } from '@storybook/react'; +import type { StoryFn } from '@storybook/nextjs'; import Label from '../Label'; export default { diff --git a/components/Form/Label/__tests__/__snapshots__/Label.test.tsx.snap b/components/Form/Label/__tests__/__snapshots__/Label.test.tsx.snap index 3873508b6..e0abd57a6 100644 --- a/components/Form/Label/__tests__/__snapshots__/Label.test.tsx.snap +++ b/components/Form/Label/__tests__/__snapshots__/Label.test.tsx.snap @@ -1,11 +1,13 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Label > should render with required props 1`] = ` - +
    + +
    `; diff --git a/components/Form/Select/__tests__/SelectMulti.test.tsx b/components/Form/Select/__tests__/SelectMulti.test.tsx index 25d3fe299..72aed4411 100644 --- a/components/Form/Select/__tests__/SelectMulti.test.tsx +++ b/components/Form/Select/__tests__/SelectMulti.test.tsx @@ -146,7 +146,7 @@ describe('Select', () => { }); }); - it('should be able to remove multiselect options', async () => { + it('should call onChange with empty array when clearing selections', async () => { const { container } = render( @@ -155,21 +155,16 @@ describe('Select', () => { const ReactSelect = getReactSelectInput(container, name)!; - // down arrow once and enter - fireEvent.blur(ReactSelect); - fireEvent.keyDown(ReactSelect, KEY_CODES.DOWN_ARROW); + // Select an option first + fireEvent.focus(ReactSelect); fireEvent.keyDown(ReactSelect, KEY_CODES.DOWN_ARROW); fireEvent.keyDown(ReactSelect, KEY_CODES.ENTER); await waitFor(() => { expect(setFieldValue).toHaveBeenCalledTimes(1); - }); - - // Remove single selected value - fireEvent.keyDown(ReactSelect, KEY_CODES.BACKSPACE); - - await waitFor(() => { - expect(setFieldValue).toHaveBeenNthCalledWith(2, name, []); + expect(setFieldValue.mock.calls[0]?.[1]).toStrictEqual( + expect.arrayContaining([expect.objectContaining({ label: expect.any(String) })]), + ); }); }); }); diff --git a/components/Form/Select/__tests__/__snapshots__/SelectMulti.test.tsx.snap b/components/Form/Select/__tests__/__snapshots__/SelectMulti.test.tsx.snap index 44318b996..597dfef82 100644 --- a/components/Form/Select/__tests__/__snapshots__/SelectMulti.test.tsx.snap +++ b/components/Form/Select/__tests__/__snapshots__/SelectMulti.test.tsx.snap @@ -1,130 +1,102 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Select > should render with required props 1`] = ` -
    - +
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    -
    -
    - +
    + +
    diff --git a/components/Form/Select/__tests__/__snapshots__/SelectSingle.test.tsx.snap b/components/Form/Select/__tests__/__snapshots__/SelectSingle.test.tsx.snap index d9978649a..9643bc7a5 100644 --- a/components/Form/Select/__tests__/__snapshots__/SelectSingle.test.tsx.snap +++ b/components/Form/Select/__tests__/__snapshots__/SelectSingle.test.tsx.snap @@ -1,130 +1,101 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Select > should render with required props 1`] = ` -
    - +
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    +
    -
    diff --git a/components/Form/Select/__tests__/__snapshots__/ThemedReactSelect.test.tsx.snap b/components/Form/Select/__tests__/__snapshots__/ThemedReactSelect.test.tsx.snap index 67da8cdea..5c602e700 100644 --- a/components/Form/Select/__tests__/__snapshots__/ThemedReactSelect.test.tsx.snap +++ b/components/Form/Select/__tests__/__snapshots__/ThemedReactSelect.test.tsx.snap @@ -1,308 +1,242 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`ThemedReactSelect > should render (multi) with required props 1`] = ` -
    - +
    + +
    - 1 +
    + 1 +
    +
    + +
    +
    +
    +
    + 2 +
    +
    + +
    + +
    +
    +
    + -
    -
    +
    - 2 -
    -
    -
    -
    - -
    -
    -
    -
    - - + + -
    -
    - - -
    `; exports[`ThemedReactSelect > should render (non-multi) with required props 1`] = ` -
    - +
    + +
    - 1 -
    -
    + 1 +
    +
    -
    -
    -
    -
    +
    -
    `; diff --git a/components/Form/__tests__/__snapshots__/Form.test.tsx.snap b/components/Form/__tests__/__snapshots__/Form.test.tsx.snap index ed318eb48..293cef6c0 100644 --- a/components/Form/__tests__/__snapshots__/Form.test.tsx.snap +++ b/components/Form/__tests__/__snapshots__/Form.test.tsx.snap @@ -1,18 +1,16 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Form > should render within the context of Formik 1`] = ` -
    - - , -
    +
    +
    + + , +
    +
    `; diff --git a/components/Forms/RegistrationForm/__stories__/RegistrationForm.stories.tsx b/components/Forms/RegistrationForm/__stories__/RegistrationForm.stories.tsx index 75af491bd..9a2e5bd7a 100644 --- a/components/Forms/RegistrationForm/__stories__/RegistrationForm.stories.tsx +++ b/components/Forms/RegistrationForm/__stories__/RegistrationForm.stories.tsx @@ -1,4 +1,4 @@ -import type { StoryFn } from '@storybook/react'; +import type { StoryFn } from '@storybook/nextjs'; import { RegistrationForm, type RegistrationFormValues } from '../RegistrationForm'; export default { diff --git a/components/Forms/RegistrationForm/__tests__/__snapshots__/RegistrationForm.test.tsx.snap b/components/Forms/RegistrationForm/__tests__/__snapshots__/RegistrationForm.test.tsx.snap index 8bed7955b..081be924e 100644 --- a/components/Forms/RegistrationForm/__tests__/__snapshots__/RegistrationForm.test.tsx.snap +++ b/components/Forms/RegistrationForm/__tests__/__snapshots__/RegistrationForm.test.tsx.snap @@ -1,340 +1,329 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`RegistrationForm > should render with required props 1`] = ` -
    -
    + -
    - + +
    + +
    -
    -
    -
    - + +
    + +
    -
    -
    - -
    -
    - -
    -
    -
    - + +
    + +
    -
    -
    -
    - + +
    + +
    -
    -
    -
    - + +
    + +
    -
    - -
    - +
    +
    - - - I have read and agree to - - + - Operation Code's Slack Community Guidelines. - - Opens in new window - - External Link Symbol", - } - } - viewBox="0 0 448 512" - /> - - - * - - -
    -
    + - - + + + +
    `; diff --git a/components/Forms/UpdateProfileForm/__tests__/__snapshots__/UpdateProfileForm.test.tsx.snap b/components/Forms/UpdateProfileForm/__tests__/__snapshots__/UpdateProfileForm.test.tsx.snap index 81dc8e592..b5efa08ff 100644 --- a/components/Forms/UpdateProfileForm/__tests__/__snapshots__/UpdateProfileForm.test.tsx.snap +++ b/components/Forms/UpdateProfileForm/__tests__/__snapshots__/UpdateProfileForm.test.tsx.snap @@ -1,241 +1,202 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`UpdateProfileForm > should render with required props 1`] = ` -
    -

    + - Professional Details -

    -
    - - - 0 - % - -
    -
    + Professional Details +
    + + 0 + % + +
    +
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    +
    +
    +
    +
    + +
    -
    -
    -
    - + +
    + +
    +
    - -
    - -
    -
    -
    -
    -
    - -
    - + +
    + +
    `; diff --git a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryDetails.test.tsx.snap b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryDetails.test.tsx.snap index 2dd6c53bb..936416fe0 100644 --- a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryDetails.test.tsx.snap +++ b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryDetails.test.tsx.snap @@ -1,269 +1,208 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`UpdateProfileForm/Steps/MilitaryDetails > should render in context of Formik 1`] = ` -
    -
    +
    -
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    -
    -
    - +
    + +
    -
    -
    -
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    +
    -
    -
    - + +
    `; diff --git a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryStatus.test.tsx.snap b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryStatus.test.tsx.snap index 4f5af365e..46d4e33b3 100644 --- a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryStatus.test.tsx.snap +++ b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/MilitaryStatus.test.tsx.snap @@ -1,153 +1,122 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`UpdateProfileForm/Steps/MilitaryStatus > should render in context of Formik 1`] = ` -
    -
    + -

    - How do you classify yourself in regards to being part of the military? -

    -
    - + + Please note that many of our services are only for veterans or their spouses. Also, note that you may feel represented by multiple categories; however, you may only choose one for this registration form. + +
    +

    + How do you classify yourself in regards to being part of the military? +

    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    +
    -
    -
    -
    + +
    `; diff --git a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/PersonalDetails.test.tsx.snap b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/PersonalDetails.test.tsx.snap index cd4589c8f..721453ee0 100644 --- a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/PersonalDetails.test.tsx.snap +++ b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/PersonalDetails.test.tsx.snap @@ -1,524 +1,402 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`UpdateProfileForm/Steps/PersonalDetails > should render in context of Formik 1`] = ` -
    -
    +
    -
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    -
    -
    - +
    + +
    -
    -
    -
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    +
    -
    -
    -
    -
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    -
    -
    - +
    + +
    -
    -
    -
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    +
    -
    -
    - + +
    `; diff --git a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/ProfessionalDetails.test.tsx.snap b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/ProfessionalDetails.test.tsx.snap index a71844d8f..85da89d2c 100644 --- a/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/ProfessionalDetails.test.tsx.snap +++ b/components/Forms/UpdateProfileForm/steps/__tests__/__snapshots__/ProfessionalDetails.test.tsx.snap @@ -1,193 +1,156 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`UpdateProfileForm/Steps/ProfessionalDetails > should render in context of Formik 1`] = ` -
    -
    +
    -
    +
    -
    + +
    - Select... -
    -
    + Select... +
    +
    -
    -
    -
    -
    +
    -
    -
    -
    -
    - + +
    + +
    -
    -
    -
    - + +
    + +
    -
    - + +
    `; diff --git a/components/Heading/Heading.tsx b/components/Heading/Heading.tsx index 88b78505b..87b0986a0 100644 --- a/components/Heading/Heading.tsx +++ b/components/Heading/Heading.tsx @@ -1,3 +1,4 @@ +import type { JSX } from 'react'; import { cx } from 'common/utils/cva'; import kebabCase from 'lodash/kebabCase'; import ScreenReaderOnly from 'components/ScreenReaderOnly/ScreenReaderOnly'; diff --git a/components/Heading/__stories__/Heading.stories.tsx b/components/Heading/__stories__/Heading.stories.tsx index 6d5262a65..74b3c2c74 100644 --- a/components/Heading/__stories__/Heading.stories.tsx +++ b/components/Heading/__stories__/Heading.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import Heading from '../Heading'; type HeadingStoryType = StoryObj; diff --git a/components/Heading/__tests__/__snapshots__/Heading.test.tsx.snap b/components/Heading/__tests__/__snapshots__/Heading.test.tsx.snap index 16a4279c9..b9d1d0f15 100644 --- a/components/Heading/__tests__/__snapshots__/Heading.test.tsx.snap +++ b/components/Heading/__tests__/__snapshots__/Heading.test.tsx.snap @@ -1,54 +1,69 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`Heading > should render with many props assigned 1`] = ` -
    - +
    + Test +
    +
    `; exports[`Heading > should render with required props 1`] = ` -
    - + + Scroll to + Test + + + + + Link Icon + + + + + + +
    + Test + +
    `; diff --git a/components/HeroBanner/__stories__/HeroBanner.stories.tsx b/components/HeroBanner/__stories__/HeroBanner.stories.tsx index 84ded14b6..5ac2e8960 100644 --- a/components/HeroBanner/__stories__/HeroBanner.stories.tsx +++ b/components/HeroBanner/__stories__/HeroBanner.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import HeroBanner from '../HeroBanner'; type HeroBannerStoryType = StoryObj; diff --git a/components/HeroBanner/__tests__/__snapshots__/HeroBanner.test.tsx.snap b/components/HeroBanner/__tests__/__snapshots__/HeroBanner.test.tsx.snap index 3532620a8..45c84f32a 100644 --- a/components/HeroBanner/__tests__/__snapshots__/HeroBanner.test.tsx.snap +++ b/components/HeroBanner/__tests__/__snapshots__/HeroBanner.test.tsx.snap @@ -1,41 +1,41 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`HeroBanner > should render with many props assigned 1`] = ` -
    +
    -

    - Test -

    - Testing 123 +

    + Test +

    + Testing 123 +
    `; exports[`HeroBanner > should render with required props 1`] = ` -
    +
    -

    - Test -

    +

    + Test +

    +
    `; diff --git a/components/Modal/__stories__/Modal.stories.tsx b/components/Modal/__stories__/Modal.stories.tsx index 7d60da57f..986416aa4 100644 --- a/components/Modal/__stories__/Modal.stories.tsx +++ b/components/Modal/__stories__/Modal.stories.tsx @@ -1,4 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import { useState } from 'react'; import isChromatic from 'chromatic/isChromatic'; import { descriptions } from 'common/constants/descriptions'; diff --git a/components/Modal/__tests__/__snapshots__/Modal.test.tsx.snap b/components/Modal/__tests__/__snapshots__/Modal.test.tsx.snap index 404b5293f..60c763ff2 100644 --- a/components/Modal/__tests__/__snapshots__/Modal.test.tsx.snap +++ b/components/Modal/__tests__/__snapshots__/Modal.test.tsx.snap @@ -58,11 +58,11 @@ exports[`Modal > should render with many props assigned 1`] = `
    + +
    `; diff --git a/components/Nav/NavMobile/NavMobile.tsx b/components/Nav/NavMobile/NavMobile.tsx index e436bcdfb..045cce348 100644 --- a/components/Nav/NavMobile/NavMobile.tsx +++ b/components/Nav/NavMobile/NavMobile.tsx @@ -61,7 +61,7 @@ function NavMobile({ isOpen, openMenu, closeMenu, navItems }: NavMobilePropsType Operation Code Logo
    @@ -87,14 +87,14 @@ function NavMobile({ isOpen, openMenu, closeMenu, navItems }: NavMobilePropsType
    • - - Home + + Home
      • {navItems.map(navlink => (
    • - - {navlink.name} + + {navlink.name}
      • ))} diff --git a/components/Nav/NavMobile/__tests__/NavMobile.test.tsx b/components/Nav/NavMobile/__tests__/NavMobile.test.tsx index aabbf23cb..027ef50f4 100644 --- a/components/Nav/NavMobile/__tests__/NavMobile.test.tsx +++ b/components/Nav/NavMobile/__tests__/NavMobile.test.tsx @@ -1,5 +1,5 @@ import { fireEvent, render } from '@testing-library/react'; -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import { mobileNavItems } from 'common/constants/navigation'; import { CLOSE_BUTTON } from 'common/constants/testIDs'; import noop from 'lodash/noop'; @@ -8,7 +8,7 @@ import NavMobile from '../NavMobile'; describe('NavMobile', () => { it('should render', () => - createShallowSnapshotTest( + createSnapshotTest( , )); diff --git a/components/Nav/NavMobile/__tests__/__snapshots__/NavMobile.test.tsx.snap b/components/Nav/NavMobile/__tests__/__snapshots__/NavMobile.test.tsx.snap index c69ddfbe0..2e8826cd3 100644 --- a/components/Nav/NavMobile/__tests__/__snapshots__/NavMobile.test.tsx.snap +++ b/components/Nav/NavMobile/__tests__/__snapshots__/NavMobile.test.tsx.snap @@ -1,43 +1,63 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`NavMobile > should render 1`] = ` -
      - +
      + + + - - -
      +
      +
    `; diff --git a/components/Nav/__tests__/Nav.test.tsx b/components/Nav/__tests__/Nav.test.tsx index 49fc4c9de..6c33d9716 100644 --- a/components/Nav/__tests__/Nav.test.tsx +++ b/components/Nav/__tests__/Nav.test.tsx @@ -1,11 +1,11 @@ import { fireEvent, render, screen } from '@testing-library/react'; import { CLOSE_BUTTON } from 'common/constants/testIDs'; -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import { Nav } from '../Nav'; describe('Nav', () => { - it('should render with no props passed', () => createShallowSnapshotTest(
    `; diff --git a/components/PartnerLogoLink/PartnerLogoLink.tsx b/components/PartnerLogoLink/PartnerLogoLink.tsx index e85ee4239..84780fb7f 100644 --- a/components/PartnerLogoLink/PartnerLogoLink.tsx +++ b/components/PartnerLogoLink/PartnerLogoLink.tsx @@ -48,7 +48,7 @@ export default function PartnerLogoLink({ className="transition-all duration-200 ease-linear grayscale opacity-60 hover:grayscale-0 hover:opacity-100 hover:transition-all hover:duration-200 hover:ease-linear object-contain" src={logoSource} alt={`${name} logo`} - layout="fill" + fill />
    diff --git a/components/PartnerLogoLink/__stories__/PartnerLogoLink.stories.tsx b/components/PartnerLogoLink/__stories__/PartnerLogoLink.stories.tsx index 814376662..e23343dc2 100644 --- a/components/PartnerLogoLink/__stories__/PartnerLogoLink.stories.tsx +++ b/components/PartnerLogoLink/__stories__/PartnerLogoLink.stories.tsx @@ -1,5 +1,4 @@ -import type { Meta, StoryObj } from '@storybook/react'; -import { hrefTo } from '@storybook/addon-links'; +import type { Meta, StoryObj } from '@storybook/nextjs'; import { s3 } from 'common/constants/urls'; import PartnerLogoLink from '../PartnerLogoLink'; @@ -11,7 +10,7 @@ const meta: Meta = { args: { logoSource: `${s3}partnerLogos/github.png`, name: 'Partner Name', - url: await hrefTo('PartnerLogoLink', 'docs'), + url: 'https://example.com', }, }; diff --git a/components/PartnerLogoLink/__tests__/__snapshots__/PartnerLogoLink.test.tsx.snap b/components/PartnerLogoLink/__tests__/__snapshots__/PartnerLogoLink.test.tsx.snap index 877ace7df..9337dce34 100644 --- a/components/PartnerLogoLink/__tests__/__snapshots__/PartnerLogoLink.test.tsx.snap +++ b/components/PartnerLogoLink/__tests__/__snapshots__/PartnerLogoLink.test.tsx.snap @@ -1,26 +1,27 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`PartnerLogoLink > should render with required props 1`] = ` - - - - Opens in new window - - +
    + Partner Inc. logo +
    + + Opens in new window + + +
    `; diff --git a/components/Press/PressLinks/__tests__/PressLinks.test.tsx b/components/Press/PressLinks/__tests__/PressLinks.test.tsx index ca690253f..3763bd493 100644 --- a/components/Press/PressLinks/__tests__/PressLinks.test.tsx +++ b/components/Press/PressLinks/__tests__/PressLinks.test.tsx @@ -1,7 +1,7 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import PressLinks from '../PressLinks'; describe('PressLinks', () => { - it('should render with no props passed', () => createShallowSnapshotTest()); + it('should render with no props passed', () => createSnapshotTest()); }); diff --git a/components/Press/PressLinks/__tests__/__snapshots__/PressLinks.test.tsx.snap b/components/Press/PressLinks/__tests__/__snapshots__/PressLinks.test.tsx.snap index 44cb7b58d..116b61457 100644 --- a/components/Press/PressLinks/__tests__/__snapshots__/PressLinks.test.tsx.snap +++ b/components/Press/PressLinks/__tests__/__snapshots__/PressLinks.test.tsx.snap @@ -1,451 +1,391 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`PressLinks > should render with no props passed 1`] = ` -
    - +
    - - -

    - Boston -

    -     - +

    + Boston +

    + + + +
    +
    -

    - General -

    - - -

    - NYC -

    -     - - -
  • - - How Tech Pros Can Volunteer in Fun Ways - -
    • -
  • - - MassChallenge Finalists: Finnest, Operation Code, Sunrise Health - -
    • -
  • - - TechBreakfast at Microsoft NERD - -
    • -
  • - - Operation Code - #BNT80 Boston New Technology Startup Demo - -
    • -
  • - - MassChallenge Finalist | Operation Code | Conrad Hollomon - -
    • -
  • - - Operation Code – Creating a Coding Community with Veterans and Citizens - -
    • -
  • - - Innovation Spotlight: Operation Code - -
    • -
  • - - tech4vets Masschallenge Veterans - -
    • -     - -
  • - - TechHire Educator Spotlight: Operation Code - -
    • -
  • - - Why Veterans Will Make Excellent Programmers - -
    • -
  • - - THOUSANDS OF VETERANS WANT TO LEARN TO CODE — BUT CAN’T - -
    • -
  • - - Hacking Entrepreneurship — An Interview with David Molina of Operation Code - -
    • -
  • - - Operation Code: Connecting Veterans with Code Skills - -
    • -
  • - - Operation Code: connecting tech and veterans - -
    • -
  • - - When the call of duty is technology, veterans rally to support each other through Operation Code - -
    • -
  • - - Get Coding Now with Operation Code Army Veteran and Founder David Molina - -
    • -
  • - - The New Developer - Operation Code - GitHub Universe 2016 - -
    • -
  • - - What happens when military veterans learn to code - CodeConf 2016 - -
    • -
  • - - How Operation Code helps veterans learn programming skills - -
    • -
  • - - Helping Veterans Learn to Code with David Molina - -
    • -
  • - - Podcast: a developing story as told by developers - -
    • -
  • - - Instagram: David Molina - -
    • -
  • - - From Aviation Electrician to Back End Engineering: Bret Funk’s Operation Code story - -
    • -
  • - - Navy Veteran to Software Developer: Geno Guerrero’s Operation Code Story - -
    • -
  • - - From Marine Corps Veteran to Front End Developer: Billy Le’s Operation Code Story - -
    • -
  • - - Few Options For Veterans Looking To Enter Tech - -
    • -
  • - - Coding Boot Camps Go After Veterans To Take Silicon Valley's Vacant Tech Jobs - -
    • -
  • - - 20 Diversity and Inclusion Leaders to Follow in 2018 - -
    • -
  • - - Tech innovation meets military service: GeekWire’s Memorial Day remembrance and update - -
    • -
  • - - MAP HOSTS CONGRESSIONAL BRIEFING ON VETERANS' READINESS IN TECH CAREERS - -
    • -
  • - - Analytics Pros, Inc. Hosts Training for Veterans and Veterans' Spouses - -
    • -
  • - - Episode 36 – How to pick a programming language to learn for new developers – Part 2 - -
    • -
  • - - How to “upskill” Veterans’ training for technology jobs - -
    • -
  • - - Instagram: Operation Code made the front cover of Oregon Veterans News Magazine - -
    • -
  • - - Jameel: From Marines to SoftwareEngineer - -
    • -
  • - - Seattle coding-school tuition to be covered by GI Bill - -
    • -
  • - - Veteran: GI Bill should cover code school - -
    • -
  • - - Patriot Boot Camp And Operation Code Join Forces To Help Military Veterans Become Technology Entrepreneurs - -
    • -
  • - - Operation Code wants veterans to work in tech - -
    • -
  • - - Coding Bootcamps Accepts GI Bill - -
    • -
  • - - Operation Code Looks to Help Veterans Land IT Careers - -
    • -     - -
  • - - New program aims to help veterans land jobs in tech industry - -
    • -
  • - - Veterans in Residence - -
    • -
  • - - After Flying Solo, Veterans Find Others Who Have Their Backs - -
    • -     - +
  • + + How Tech Pros Can Volunteer in Fun Ways + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
  • + + MassChallenge Finalists: Finnest, Operation Code, Sunrise Health + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
  • + + TechBreakfast at Microsoft NERD + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
  • + + Operation Code - #BNT80 Boston New Technology Startup Demo + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
  • + + MassChallenge Finalist | Operation Code | Conrad Hollomon + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
  • + + Operation Code – Creating a Coding Community with Veterans and Citizens + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
  • + + Innovation Spotlight: Operation Code + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
  • + + tech4vets Masschallenge Veterans + + Opens in new window + + + + + External Link Symbol + + + + + + +
    • +
    +
    `; diff --git a/components/Press/PressPhotos/PressPhotos.tsx b/components/Press/PressPhotos/PressPhotos.tsx index f0d0f338a..09cd93374 100644 --- a/components/Press/PressPhotos/PressPhotos.tsx +++ b/components/Press/PressPhotos/PressPhotos.tsx @@ -34,7 +34,7 @@ function PressPhotos() { {photo.alt}
    diff --git a/components/Press/PressPhotos/__tests__/PressPhotos.test.tsx b/components/Press/PressPhotos/__tests__/PressPhotos.test.tsx index 29f270291..d83ee83a4 100644 --- a/components/Press/PressPhotos/__tests__/PressPhotos.test.tsx +++ b/components/Press/PressPhotos/__tests__/PressPhotos.test.tsx @@ -1,7 +1,7 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import PressPhotos from '../PressPhotos'; describe('PressPhotos', () => { - it('should render with no props passed', () => createShallowSnapshotTest()); + it('should render with no props passed', () => createSnapshotTest()); }); diff --git a/components/Press/PressPhotos/__tests__/__snapshots__/PressPhotos.test.tsx.snap b/components/Press/PressPhotos/__tests__/__snapshots__/PressPhotos.test.tsx.snap index f895ab41a..257409c09 100644 --- a/components/Press/PressPhotos/__tests__/__snapshots__/PressPhotos.test.tsx.snap +++ b/components/Press/PressPhotos/__tests__/__snapshots__/PressPhotos.test.tsx.snap @@ -1,58 +1,50 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`PressPhotos > should render with no props passed 1`] = ` -
    +
    - -
    -
    - -
    -
    - -
    -
    - -
    -
    - +
    + David Molina speaks to Code Conference LA 2016 attendees. +
    +
    + Operation Code members pose at Red Hat Summit 2017 +
    +
    + Conrad Hollomon presents in front of the Node Summit 2016 audience +
    +
    + Operation Code developers pose at AngelHack Boston 2017. +
    +
    + Ken Collier leads a discussion at the Utah Operation Code meetup. +
    `; diff --git a/components/Press/PressVideos/__tests__/PressVideos.test.tsx b/components/Press/PressVideos/__tests__/PressVideos.test.tsx index 173075a93..24af4a6aa 100644 --- a/components/Press/PressVideos/__tests__/PressVideos.test.tsx +++ b/components/Press/PressVideos/__tests__/PressVideos.test.tsx @@ -1,7 +1,7 @@ -import createShallowSnapshotTest from 'test-utils/createShallowSnapshotTest'; +import createSnapshotTest from 'test-utils/createSnapshotTest'; import PressVideos from '../PressVideos'; describe('PressVideos', () => { - it('should render with no props passed', () => createShallowSnapshotTest()); + it('should render with no props passed', () => createSnapshotTest()); }); diff --git a/components/Press/PressVideos/__tests__/__snapshots__/PressVideos.test.tsx.snap b/components/Press/PressVideos/__tests__/__snapshots__/PressVideos.test.tsx.snap index f47c26c0f..faef5ff84 100644 --- a/components/Press/PressVideos/__tests__/__snapshots__/PressVideos.test.tsx.snap +++ b/components/Press/PressVideos/__tests__/__snapshots__/PressVideos.test.tsx.snap @@ -1,22 +1,24 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`PressVideos > should render with no props passed 1`] = ` -
    -