Merge branch 'main' into 47-team-page

.eslintrc.cjs

@@ -27,6 +27,7 @@ module.exports = {
         '@typescript-eslint/prefer-nullish-coalescing': 'off',
         '@typescript-eslint/no-unsafe-call': ['off'],
         '@stylistic/ts/indent': ['error', 4],
+        '@stylistic/ts/semi': ['error', 'never'],
     },
     settings: {
         react: {

CONTRIBUTING.md

@@ -16,13 +16,14 @@
 I've set us up with a modern frontend tech stack so that we can practice together. This includes TypeScript, which has a bit of a learning curve. 
 
 ## Best Practices
-- Use Editorconfig to match expected style: https://editorconfig.org/
+- Use Editorconfig to match expected style: https://editorconfig.org/ (If you are a VSCode user this means installing an extention)
 - This project is set up with eslint for both style and code checking 🧹
+- Please disable Prettier plugins in your editor ([VSCode instructions](https://stackoverflow.com/a/75471109/1860768))
 
 ## Working on an Issue ☑️
 - Please assign yourself to any ticket you are working on. Please unassign yourself if you aren't able to move it forward. Feel free to ask for help if you get stuck.
 - Branch name should start with the ticket number, e.g. `11-dns-setup`
-- Please write unit tests for new enhancements 🧪
+- Please write unit and E2E tests for new enhancements 🧪
 
 ## PR Guidelines
 - All GH Actions should pass ☑️
@@ -32,6 +33,12 @@ I've set us up with a modern frontend tech stack so that we can practice togethe
 - Try to keep PRs under 500 lines of code 🤏 
 - Making multiple PRs to solve a single issue is okay! 🙆🏻‍♀️
 
+## Testing Guidelines
+- Unit tests have coverage metrics. 60 - 80% coverage is good ⭐
+- Try to approach writing tests the way a real user would interact with the site. [See Guiding Principles from Testing Library](https://testing-library.com/docs/guiding-principles/)
+- Rather than adding test ids, we prefer semantic selectors like `getByRole`, `getByLabel`, or `getByText`
+- Playwright is great for testing complex interactions across components or pages.
+
 
 ## Merging
 - Merging to main triggers a deploy to production. Please check that the site deploys correctly

e2e/home.spec.ts

@@ -1,8 +1,8 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
 
 test('has title', async ({ page }) => {
-    await page.goto('/');
+    await page.goto('/')
 
     // Expect a title "to contain" a substring.
-    await expect(page).toHaveTitle(/WiSE/);
-});
+    await expect(page).toHaveTitle(/WiSE/)
+})