Skip to content

Commit 766dc34

Browse files
kettanaitokettanaito
committed
03/05 wip
1 parent fe829eb commit 766dc34

File tree

30 files changed

+956
-3
lines changed

30 files changed

+956
-3
lines changed

‎exercises/03.best-practices/01.solution.accessibility-selectors/README.mdx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,3 +5,4 @@ Now that we have MSW set up, let's write some tests for the Discount code form!
55
- Why accessibility selectors matter?
66
- Why not `test-id`?
77
- Implicit benefits of selectors (validate the accessibility of your markup; you cannot force your way to things the user cannot "see" on the page)
8+
- Show how to see if an element has an _accessible name_. You can use Chrome devtools for that.

‎exercises/03.best-practices/03.solution.network-mocking/src/discount-code-form.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,7 @@ export function DiscountCodeForm() {
9999
.catch((error) => {
100100
console.error(error)
101101
notify('Failed to apply the discount code', 'error')
102+
dispatch({ type: 'idle' })
102103
})
103104
}
104105

‎exercises/03.best-practices/04.solution.inverse-assertions/src/discount-code-form.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,7 @@ export function DiscountCodeForm() {
109109
})
110110
.catch(() => {
111111
notify('Failed to apply the discount code', 'error')
112+
dispatch({ type: 'idle' })
112113
})
113114
}
114115

@@ -121,13 +122,13 @@ export function DiscountCodeForm() {
121122
const code = data.get('discountCode') as string
122123

123124
await removeDiscount(code)
124-
.then(() => {
125-
dispatch({ type: 'idle' })
126-
})
127125
.catch((error) => {
128126
console.error(error)
129127
notify('Failed to remove the discount code', 'error')
130128
})
129+
.finally(() => {
130+
dispatch({ type: 'idle' })
131+
})
131132
}
132133

133134
return (

‎exercises/03.best-practices/06.solution.page-navigation/README.mdx‎ renamed to ‎exercises/03.best-practices/05.solution.page-navigation/README.mdx‎

File renamed without changes.

‎exercises/03.best-practices/05.solution.page-navigation/index.html‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite App</title>
8+
<link rel="preconnect" href="https://fonts.googleapis.com" />
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
10+
</head>
11+
<body>
12+
<div id="root"></div>
13+
<script type="module" src="/src/main.tsx"></script>
14+
</body>
15+
</html>

‎exercises/03.best-practices/05.solution.page-navigation/package.json‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
{
2+
"type": "module",
3+
"name": "exercises_03.best-practices_05.solution.page-navigation",
4+
"scripts": {
5+
"dev": "vite",
6+
"test": "vitest"
7+
},
8+
"dependencies": {
9+
"react": "^19.0.0",
10+
"react-dom": "^19.0.0"
11+
},
12+
"devDependencies": {
13+
"@testing-library/dom": "^10.4.0",
14+
"@testing-library/react": "^16.1.0",
15+
"@types/node": "^22.10.6",
16+
"@types/react": "^19.0.6",
17+
"@types/react-dom": "^19.0.3",
18+
"@vitejs/plugin-react": "^4.3.4",
19+
"@vitest/browser": "^3.0.2",
20+
"autoprefixer": "^10.4.20",
21+
"msw": "^2.7.0",
22+
"playwright": "^1.49.1",
23+
"postcss": "^8.4.49",
24+
"tailwindcss": "^3.4.17",
25+
"vite": "^6.0.7",
26+
"vitest": "^3.0.2"
27+
},
28+
"msw": {
29+
"workerDirectory": [
30+
"public"
31+
]
32+
}
33+
}

‎exercises/03.best-practices/05.solution.page-navigation/postcss.config.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
export default {
2+
plugins: {
3+
tailwindcss: {},
4+
autoprefixer: {},
5+
},
6+
}

0 commit comments

Comments
 (0)