react19-test-patterns
作者: github
提供用於將測試檔案遷移至 React 19 相容性的前後模式,包括 act() 匯入、Simulate 移除以及 StrictMode 呼叫次數變更。
npx skills add https://github.com/github/awesome-copilot --skill react19-test-patternsReact 19 Test Migration Patterns
Reference for all test file migrations required by React 19.
Priority Order
Fix test files in this order; each layer depends on the previous:
actimport fix first, it unblocks everything elseSimulate→fireEventfix immediately after act- Full react-dom/test-utils cleanup remove remaining imports
- StrictMode call counts measure actual, don't guess
- Async act wrapping for remaining "not wrapped in act" warnings
- Custom render helper verify once per codebase, not per test
1. act() Import Fix
// Before REMOVED in React 19:
import { act } from 'react-dom/test-utils';
// After:
import { act } from 'react';
If mixed with other test-utils imports:
// Before:
import { act, Simulate, renderIntoDocument } from 'react-dom/test-utils';
// After split the imports:
import { act } from 'react';
import { fireEvent, render } from '@testing-library/react'; // replaces Simulate + renderIntoDocument
2. Simulate → fireEvent
// Before Simulate REMOVED in React 19:
import { Simulate } from 'react-dom/test-utils';
Simulate.click(element);
Simulate.change(input, { target: { value: 'hello' } });
Simulate.submit(form);
Simulate.keyDown(element, { key: 'Enter', keyCode: 13 });
// After:
import { fireEvent } from '@testing-library/react';
fireEvent.click(element);
fireEvent.change(input, { target: { value: 'hello' } });
fireEvent.submit(form);
fireEvent.keyDown(element, { key: 'Enter', keyCode: 13 });
3. react-dom/test-utils Full API Map
| Old (react-dom/test-utils) | New location |
|---|---|
act | import { act } from 'react' |
Simulate | fireEvent from @testing-library/react |
renderIntoDocument | render from @testing-library/react |
findRenderedDOMComponentWithTag | getByRole, getByTestId from RTL |
findRenderedDOMComponentWithClass | getByRole or container.querySelector |
scryRenderedDOMComponentsWithTag | getAllByRole from RTL |
isElement, isCompositeComponent | Remove not needed with RTL |
isDOMComponent | Remove |
4. StrictMode Call Count Fixes
React 19 StrictMode no longer double-invokes useEffect in development. Spy assertions counting effect calls must be updated.
Strategy always measure, never guess:
# Run the failing test, read the actual count from the error:
npm test -- --watchAll=false --testPathPattern="[filename]" --forceExit 2>&1 | grep -E "Expected|Received"
// Before (React 18 StrictMode effects ran twice):
expect(mockFn).toHaveBeenCalledTimes(2); // 1 call × 2 (strict double-invoke)
// After (React 19 StrictMode effects run once):
expect(mockFn).toHaveBeenCalledTimes(1);
// Render-phase calls (component body) still double-invoked in React 19 StrictMode:
expect(renderSpy).toHaveBeenCalledTimes(2); // stays at 2 for render body calls
來自 github 的更多技能
console-rendering
github
在 Go 中使用基於結構體標籤的控制台渲染系統的說明
official
acquire-codebase-knowledge
github
當使用者明確要求對現有程式碼庫進行映射、文件化或入門引導時,使用此技能。觸發詞如「映射此程式碼庫」、「文件化…」等提示。
official
acreadiness-assess
github
Run the AgentRC readiness assessment on the current repository and produce a static HTML dashboard at reports/index.html. Wraps `npx github:microsoft/agentrc…
official
acreadiness-generate-instructions
github
透過 AgentRC 指令命令生成量身打造的 AI 代理指令檔案。產生 .github/copilot-instructions.md(預設,建議用於 VS Code 中的 Copilot…
official
acreadiness-policy
github
幫助使用者選取、撰寫或套用 AgentRC 政策。政策可透過停用不相關的檢查、覆寫影響/等級、設定…來自訂整備度評分。
official
add-educational-comments
github
為程式碼檔案添加教育性註解,將其轉化為有效的學習資源。根據三個可設定的知識層級(初學者、中級、進階)調整解釋深度與語氣。若未提供檔案,會自動請求提供,並以編號清單對應以便快速選取。僅透過教育性註解將檔案擴充最多125%(嚴格上限:400行新註解;超過1,000行的檔案上限為300行)。保留檔案編碼、縮排風格、語法正確性及……
official
adobe-illustrator-scripting
github
使用 ExtendScript (JavaScript/JSX) 編寫、除錯及最佳化 Adobe Illustrator 自動化腳本。適用於建立或修改操控…的腳本時。
official
agent-governance
github
宣告式政策、意圖分類與稽核軌跡,用於控制AI代理工具存取與行為。可組合的治理政策定義允許/封鎖的工具、內容過濾器、速率限制與核准要求——以配置而非程式碼形式儲存。語意意圖分類在工具執行前,透過基於模式的訊號偵測危險提示(資料外洩、權限提升、提示注入)。工具層級治理裝飾器在函式層級強制執行政策……
official