fix: resolve React act() warnings in ChatWindow tests and add TypeScript dependency

package-lock.json

@@ -20,6 +20,7 @@
         "@testing-library/user-event": "^14.5.0",
         "@vitejs/plugin-react": "^4.0.0",
         "jsdom": "^22.0.0",
+        "typescript": "^5.9.3",
         "vite": "^4.4.0",
         "vitest": "^0.34.0"
       }
@@ -4986,6 +4987,20 @@
         "node": ">=4"
       }
     },
+    "node_modules/typescript": {
+      "version": "5.9.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
+      "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=14.17"
+      }
+    },
     "node_modules/ufo": {
       "version": "1.6.3",
       "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.6.3.tgz",

package.json

@@ -12,19 +12,20 @@
     "lint": "eslint src --ext js,jsx --report-unused-disable-directives --max-warnings 0"
   },
   "dependencies": {
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "@capacitor/core": "^5.0.0",
+    "@capacitor/android": "^5.0.0",
     "@capacitor/cli": "^5.0.0",
-    "@capacitor/android": "^5.0.0"
+    "@capacitor/core": "^5.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@vitejs/plugin-react": "^4.0.0",
-    "vite": "^4.4.0",
-    "vitest": "^0.34.0",
-    "@testing-library/react": "^14.0.0",
     "@testing-library/jest-dom": "^5.17.0",
+    "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.5.0",
-    "jsdom": "^22.0.0"
+    "@vitejs/plugin-react": "^4.0.0",
+    "jsdom": "^22.0.0",
+    "typescript": "^5.9.3",
+    "vite": "^4.4.0",
+    "vitest": "^0.34.0"
   }
 }

src/components/ChatWindow.test.jsx

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import { render, screen, waitFor, act } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { ChatWindow } from '../components/ChatWindow.jsx'
 import { sendMessage } from '../utils/llmApi.js'
@@ -62,8 +62,11 @@ describe('ChatWindow', () => {
     render(<ChatWindow {...defaultProps} />)
 
     const input = screen.getByRole('textbox')
+
+    await act(async () => {
       await user.type(input, 'Hello')
       await user.click(screen.getByRole('button', { name: /Send/i }))
+    })
 
     expect(defaultProps.onAddMessage).toHaveBeenCalledWith('user', 'Hello')
     await waitFor(() => {
@@ -80,8 +83,11 @@ describe('ChatWindow', () => {
     render(<ChatWindow {...noEndpointProps} />)
 
     const input = screen.getByRole('textbox')
+
+    await act(async () => {
       await user.type(input, 'Hello')
       await user.click(screen.getByRole('button', { name: /Send/i }))
+    })
 
     expect(screen.getByText(/Please configure API endpoint/)).toBeInTheDocument()
   })