ci test

.github/workflows/code-qa.yml

@@ -14,14 +14,16 @@ jobs:
                       action: pnpm ts:check
                     - name: Deadcode
                       action: pnpm deadcode
+                    - name: Test
+                      action: pnpm test
         steps:
             - uses: actions/checkout@v3
             - uses: pnpm/action-setup@v2
               with:
-                  version: 8.5.0
+                  version: 8.15.6
             - uses: actions/setup-node@v2
               with:
-                  node-version: 18
+                  node-version: 20
                   cache: "pnpm"
                   cache-dependency-path: pnpm-lock.yaml
             - name: ${{ matrix.name }}

app/level/[level]/round/[round]/CharacterQuizChoiceStepContent.tsx

@@ -2,7 +2,7 @@ import { type CharacterQuizChoiceStep } from "@/data/levels"
 import { useState } from "react"
 import { Button } from "@/components/Button"
 import { CharacterDisplay } from "@/components/CharacterDisplay"
-import { useLevelStore } from "./LevelStoreProvider"
+import { useLevelStore } from "@/store/LevelStore"
 
 type CharacterQuizChoiceStepContentProps = {
     step: CharacterQuizChoiceStep

app/level/[level]/round/[round]/KeywordChallengeStepContent.test.tsx

@@ -0,0 +1,19 @@
+import { renderWithContext } from "@/test-utils/renderWithContext"
+import { KeywordChallengeStepContent } from "./KeywordChallengeStepContent"
+import { StepType } from "@/data/levels"
+
+describe("KeywordChallengeStepContent", () => {
+    it("should render successfully", () => {
+        expect(() => {
+            renderWithContext(
+                <KeywordChallengeStepContent
+                    step={{
+                        type: StepType.KEYWORD_CHALLENGE,
+                        keyword: "うえ",
+                        pronounciation: [["u"], ["e"]],
+                    }}
+                />,
+            )
+        }).not.toThrow()
+    })
+})

app/level/[level]/round/[round]/Round.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { useLevelStore } from "./LevelStoreProvider"
+import { useLevelStore } from "@/store/LevelStore"
 import { observer } from "mobx-react-lite"
 import { Step } from "./Step"
 

app/level/[level]/round/[round]/Step.tsx

@@ -3,7 +3,7 @@ import { InfoStepContent } from "./InfoStepContent"
 import { CharacterQuizChoiceStepContent } from "./CharacterQuizChoiceStepContent"
 import { KeywordChallengeStepContent } from "./KeywordChallengeStepContent"
 import { observer } from "mobx-react-lite"
-import { useLevelStore } from "./LevelStoreProvider"
+import { useLevelStore } from "@/store/LevelStore"
 import { AnimatePresence } from "framer-motion"
 import { StepType } from "@/data/levels"
 

app/level/[level]/round/[round]/page.tsx

@@ -2,7 +2,7 @@ import z from "zod"
 import { levels } from "@/data/levels"
 import { RedirectType, redirect } from "next/navigation"
 import { Round } from "./Round"
-import { LevelStoreProvider } from "./LevelStoreProvider"
+import { LevelStoreProvider } from "@/store/LevelStore"
 
 const paramsSchema = z.object({
     level: z.number({ coerce: true }).int().catch(1),

jest.config.js

@@ -0,0 +1,13 @@
+const nextJest = require("next/jest.js")
+
+const createJestConfig = nextJest({
+    dir: "./",
+})
+
+/**  @type {import('jest').Config} */
+const config = {
+    coverageProvider: "v8",
+    testEnvironment: "jsdom",
+}
+
+module.exports = createJestConfig(config)

package.json

@@ -41,7 +41,6 @@
     "postcss": "^8",
     "prettier": "^3.2.5",
     "tailwindcss": "^3.3.0",
-    "ts-node": "^10.9.2",
     "typescript": "^5.4.4"
   }
 }