Set up cypress component testing

[allisonking]

Cypress introduced component testing a few versions ago. While thinking about the classify features which don't have endpoints to test with yet, I thought it would be useful to explore component testing. They're easier to build out in isolation, and are much faster than e2e tests

Component testing is kind of like a mix of storybook and jest tests: like storybook, it renders your component in a browser, but like jest, you can actually test things (although you can use cypress commands, which we already know and love). It looks like storybook now also has interaction testing which might be the same thing except for within storybook. However, since we're already using cypress, it was easier to set this up.

Code Changes

• Configure cypress to be able to use component testing (including tsconfigs and making it use chakra for theming)
• Add a stanza to GHA to run component tests
• Add a small test for DataCategoryInput

Steps to Confirm

• Run npm run cy:open. This will let you choose between E2E testing and component testing. Choose component testing, then watch it do its thing
• CI passes

Pre-Merge Checklist

• All CI Pipelines Succeeded
• Documentation Updated:
  • documentation complete, or draft/outline provided (tag docs-team to complete/review on this branch)
  • documentation issue created (tag docs-team to complete issue separately)
• Issue Requirements are Met
• Relevant Follow-Up Issues Created
• Update CHANGELOG.md

Description Of Changes

Traditionally this sort of test should live next to the component. We don't have a habit of putting our components in their own folders though, so it would make our folder structure kind of messy. We may want to consider putting our components in lil folders for purposes like this (maybe storybook files would also go here, css modules [not that we really have any], unit tests...). I put them in cypress/components (the default installation path) for now, but we can always move them if people feel strongly about it.

[ssangervasi]

Good stuff. I'm starting to really like cypress's approach of keeping test actions under the cy namespace, instead of other testing frameworks where you get a bunch of temporary variables flying around. Also, compared to storybook's configuration this is very intuitive.