Merge remote-tracking branch 'origin/main' into sr-file-input-forward…

…-ref-958
trussworks · Jun 7, 2021 · 005f324 · 005f324
2 parents 4f902e5 + 4abf315
commit 005f324
Show file tree

Hide file tree

Showing 47 changed files with 2,305 additions and 750 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -2,10 +2,10 @@ version: 2.1
 jobs:
   build:
     docker:
-    - auth:
-        password: $DOCKER_PASSWORD
-        username: $DOCKER_USERNAME
-      image: circleci/node:14.15.3
+      - auth:
+          password: $DOCKER_PASSWORD
+          username: $DOCKER_USERNAME
+        image: circleci/node:14.15.3
     working_directory: ~/react-uswds
     steps:
       - checkout
@@ -21,7 +21,9 @@ jobs:
             - ~/.cache/yarn
           key: v1-yarn-{{ checksum "yarn.lock" }}
 
-      - run: yarn test -w 1
+      - run: yarn test:coverage -w 1
+
+      - run: yarn test:serverside
 
       - run:
           name: 'Happo'
@@ -54,5 +56,4 @@ workflows:
     jobs:
       - build:
           context:
-          - org-global
-
+            - org-global
diff --git a/.happo.js b/.happo.js
@@ -14,9 +14,10 @@ module.exports = {
     firefox: new RemoteBrowserTarget('firefox', {
       viewport: '1024x768',
     }),
-    edge: new RemoteBrowserTarget('edge', {
-      viewport: '1024x768',
-    }),
+    // happo has too many false postive diffs with edge to use it
+    // edge: new RemoteBrowserTarget('edge', {
+    //   viewport: '1024x768',
+    // }),
     'internet explorer': new RemoteBrowserTarget('internet explorer', {
       viewport: '1024x768',
     }),

diff --git a/example/package.json b/example/package.json
@@ -37,12 +37,12 @@
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^5.12.0",
-    "@testing-library/react": "^11.2.6",
+    "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^13.0.16",
     "@types/jest": "^26.0.23",
     "@types/node": "^14.14.31",
     "@types/react": "^17.0.4",
-    "@types/react-dom": "^17.0.3",
+    "@types/react-dom": "^17.0.6",
     "@types/react-redux": "^7.1.16",
     "@types/react-router-dom": "^5.1.7",
     "@types/yup": "^0.29.11",

diff --git a/example/yarn.lock b/example/yarn.lock
diff --git a/jest.config.js b/jest.config.js
@@ -12,4 +12,12 @@ module.exports = {
     '\\.(css|scss)$': '<rootDir>/__mocks__/styleMock.js',
   },
   setupFilesAfterEnv: ['./src/setupTests.ts'],
+  coverageThreshold: {
+    global: {
+      statements: 96,
+      branches: 87,
+      functions: 94,
+      lines: 96,
+    },
+  },
 }
diff --git a/package.json b/package.json
@@ -24,6 +24,7 @@
     "test:debug": "node --inspect node_modules/.bin/jest --runInBand",
     "test:watch": "jest --watch",
     "test:coverage": "jest --coverage",
+    "test:serverside": "yarn build && node src/serverSideTest.js",
     "storybook": "start-storybook -p 9009",
     "storybook:deploy": "storybook-to-ghpages",
     "build": "webpack --progress",
@@ -73,7 +74,7 @@
     "@testing-library/dom": "^7.22.3",
     "@testing-library/jest-dom": "^5.3.0",
     "@testing-library/react": "^11.0.2",
-    "@testing-library/react-hooks": "^5.0.0",
+    "@testing-library/react-hooks": "^7.0.0",
     "@testing-library/user-event": "^13.1.5",
     "@types/classnames": "^2.2.9",
     "@types/jest": "^26.0.0",
@@ -84,12 +85,12 @@
     "all-contributors-cli": "^6.20.0",
     "awesome-typescript-loader": "^5.2.1",
     "babel-eslint": "^10.0.3",
-    "babel-jest": "^26.1.0",
+    "babel-jest": "^27.0.2",
     "babel-loader": "^8.0.6",
     "classnames": "^2.2.6",
     "css-loader": "^5.0.0",
     "danger": "^10.0.0",
-    "dotenv": "^8.2.0",
+    "dotenv": "^10.0.0",
     "eslint": "^6.5.1",
     "eslint-config-prettier": "^6.3.0",
     "eslint-plugin-import": "^2.18.2",
@@ -103,7 +104,7 @@
     "happo.io": "^6.0.0",
     "husky": "^4.3.8",
     "jest": "^26.1.0",
-    "lint-staged": "^10.0.9",
+    "lint-staged": "^11.0.0",
     "mini-css-extract-plugin": "^1.0.0",
     "prettier": "^2.0.2",
     "react": "^17.0.1",

diff --git a/src/components/Collection/Collection.stories.tsx b/src/components/Collection/Collection.stories.tsx
diff --git a/src/components/Footer/Address/Address.stories.tsx b/src/components/Footer/Address/Address.stories.tsx
@@ -10,7 +10,7 @@ export default {
         component: `
 Display address items (most likely links or simple text) in a row, wrapped in address tag.  Used in USWDS 2.0 Footer component.
 
-Source: https://designsystem.digital.gov/components/form-controls/#footer
+Source: https://designsystem.digital.gov/components/footer
 `,
       },
     },

diff --git a/src/components/Footer/Footer/Footer.stories.tsx b/src/components/Footer/Footer/Footer.stories.tsx
@@ -23,7 +23,7 @@ export default {
         component: `
 ### USWDS 2.0 Footer component
 
-Source: https://designsystem.digital.gov/components/form-controls/#footer
+Source: https://designsystem.digital.gov/components/footer
 `,
       },
     },

diff --git a/src/components/Footer/FooterNav/FooterNav.stories.tsx b/src/components/Footer/FooterNav/FooterNav.stories.tsx
@@ -13,7 +13,7 @@ export default {
         component: `
 Display single list of nav items, or grouped nav items in an extended nav. Used in USWDS 2.0 Footer component.
 
-Source: https://designsystem.digital.gov/components/form-controls/#footer
+Source: https://designsystem.digital.gov/components/footer
 `,
       },
     },

diff --git a/src/components/Footer/Logo/Logo.stories.tsx b/src/components/Footer/Logo/Logo.stories.tsx
@@ -14,7 +14,7 @@ export default {
         component: `
 Display logo image with optional heading.  Used in USWDS 2.0 Footer component.
 
-Source: https://designsystem.digital.gov/components/form-controls/#footer
+Source: https://designsystem.digital.gov/components/footer
 `,
       },
     },

diff --git a/src/components/Footer/SocialLinks/SocialLinks.stories.tsx b/src/components/Footer/SocialLinks/SocialLinks.stories.tsx
@@ -11,7 +11,7 @@ export default {
         component: `
 Display social links in styled row. Used in USWDS 2.0 Footer component.
 
-Source: https://designsystem.digital.gov/components/form-controls/#footer
+Source: https://designsystem.digital.gov/components/footer
 `,
       },
     },

diff --git a/src/components/Identifier/Identifier/Identifier.stories.tsx b/src/components/Identifier/Identifier/Identifier.stories.tsx
@@ -47,55 +47,61 @@ const testIdentifierLogoSpanish = (
   />
 )
 
-const testLinks = [
-  <IdentifierLinkItem key="one">
-    <IdentifierLink href="#">About &lt;Parent shortname&gt;</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="two">
-    <IdentifierLink href="#">Accessibility support</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="three">
-    <IdentifierLink href="#">FOIA requests</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="four">
-    <IdentifierLink href="#">No FEAR Act data</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="five">
-    <IdentifierLink href="#">Office of the Inspector General</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="six">
-    <IdentifierLink href="#">Performance reports</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="seven">
-    <IdentifierLink href="#">Privacy policy</IdentifierLink>
-  </IdentifierLinkItem>,
-]
+const testLinks = (
+  <>
+    <IdentifierLinkItem key="one">
+      <IdentifierLink href="#">About &lt;Parent shortname&gt;</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="two">
+      <IdentifierLink href="#">Accessibility support</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="three">
+      <IdentifierLink href="#">FOIA requests</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="four">
+      <IdentifierLink href="#">No FEAR Act data</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="five">
+      <IdentifierLink href="#">Office of the Inspector General</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="six">
+      <IdentifierLink href="#">Performance reports</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="seven">
+      <IdentifierLink href="#">Privacy policy</IdentifierLink>
+    </IdentifierLinkItem>
+  </>
+)
 
-const testLinksSpanish = [
-  <IdentifierLinkItem key="one">
-    <IdentifierLink href="#">Acerca de &lt;Parent shortname&gt;</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="two">
-    <IdentifierLink href="#">Soporte de accesibilidad</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="three">
-    <IdentifierLink href="#">Solicitud a través de FOIA</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="four">
-    <IdentifierLink href="#">Datos de la ley No FEAR</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="five">
-    <IdentifierLink href="#">Oficina del Inspector General</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="six">
-    <IdentifierLink href="#">Informes de desempeño</IdentifierLink>
-  </IdentifierLinkItem>,
-  <IdentifierLinkItem key="seven">
-    <IdentifierLink href="#">Política de privacidad</IdentifierLink>
-  </IdentifierLinkItem>,
-]
+const testLinksSpanish = (
+  <>
+    <IdentifierLinkItem key="one">
+      <IdentifierLink href="#">
+        Acerca de &lt;Parent shortname&gt;
+      </IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="two">
+      <IdentifierLink href="#">Soporte de accesibilidad</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="three">
+      <IdentifierLink href="#">Solicitud a través de FOIA</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="four">
+      <IdentifierLink href="#">Datos de la ley No FEAR</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="five">
+      <IdentifierLink href="#">Oficina del Inspector General</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="six">
+      <IdentifierLink href="#">Informes de desempeño</IdentifierLink>
+    </IdentifierLinkItem>
+    <IdentifierLinkItem key="seven">
+      <IdentifierLink href="#">Política de privacidad</IdentifierLink>
+    </IdentifierLinkItem>
+  </>
+)
 
-const testIdentifierGovContent = [
+const testIdentifierGovContent = (
   <>
     <div className="usa-identifier__usagov-description">
       Looking for U.S. government information and services?
@@ -104,10 +110,10 @@ const testIdentifierGovContent = [
     <Link href="https://www.usa.gov/" className="usa-link">
       Visit USA.gov
     </Link>
-  </>,
-]
+  </>
+)
 
-const testIdentifierGovContentSpanish = [
+const testIdentifierGovContentSpanish = (
   <>
     <div className="usa-identifier__usagov-description">
       ¿Necesita información y servicios del Gobierno?
@@ -116,8 +122,8 @@ const testIdentifierGovContentSpanish = [
     <Link href="https://www.usa.gov/espanol/" className="usa-link">
       Visite USAGov en Español
     </Link>
-  </>,
-]
+  </>
+)
 
 export const identifierDefault = (): React.ReactElement => (
   <Identifier>