Set up component tests with happy-dom and Testing Library
メンテナーはふだん 1 日以内に返信
評価
- 難易度
- 3/5
- 見積もり時間
- 1〜2日
- 初心者へのやさしさ
- 67/100
- issue の種類
- 機能追加
- 明瞭さ
- 明確に書かれている
- 活発さ
- 活発
- 技術スタック
- react, typescript
調査の方向性
Start with vitest.config.ts, package.json, and CONTRIBUTING.md; check how lib/ tests are discovered and run. Add component test discovery and a happy-dom environment while keeping lib/ tests in node, then test components/shared/CopyButton.tsx inside ToastProvider from components/shared/Toast.tsx. Done when the test verifies clipboard writing and the “Copied” label, and the requested npm checks pass.
索引モデルが issue の本文から書いたものです。
説明
Tests only cover lib/ today. vitest.config.ts runs everything in the node environment and only picks up lib/**/*.test.ts, and there's no DOM library or Testing Library in package.json. So a fix inside a component can't come with a test that fails before the fix, like the invoice reset fixed in #201 or the theme toggle hydration error in #193.
What to do
- Add
happy-dom,@testing-library/reactand@testing-library/domas dev dependencies (chatcops's widget tests use happy-dom too) - Run component tests in happy-dom and keep the
lib/tests innode, for example with Vitestprojectsor a// @vitest-environment happy-domcomment at the top of each component test - Pick up
*.test.tsxfiles undercomponents/andapp/as well - Write one real test to show it works, for
components/shared/CopyButton.tsx: clicking it callsnavigator.clipboard.writeTextwith its value and the label changes to "Copied". It usesuseToast, so render it insideToastProviderfromcomponents/shared/Toast.tsx. - Add a line next to the one about
lib/__tests__/in CONTRIBUTING.md (line 94) saying where component tests go
Acceptance criteria
-
npm run testruns thelib/tests and the new component test, so CI runs both - The
lib/tests still run innode - The
CopyButtontest fails ifhandleCopystops callingnavigator.clipboard.writeText -
package-lock.jsonis updated withnpm installon Node 22, and only the new packages are added to it -
npm run lint,npm run testandnpm run buildpass
Want to work on this? Comment below and I'll assign it to you. Please take one issue at a time, branch off develop, and open your PR against develop with Closes #206 in the description.
- 主要言語
- TypeScript
- スター
- 1
- フォーク
- 9
- 平均マージ
- 10時間 24分
- マージ済み PR（30日）
- 93
環境構築
- Dockerfile・Docker Compose ファイルなし
- プルリクエストのテンプレートあり
- コントリビューションガイドを読む
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
codercops/toolbelt のほかの issue
-
bug good first issue hacktoberfest
難易度 2/5 1〜3時間 初心者へのやさしさ 90/100
メンテナーはふだん 1 日以内に返信
-
bug good first issue hacktoberfest
難易度 2/5 1〜3時間 初心者へのやさしさ 94/100
メンテナーはふだん 1 日以内に返信
-
bug good first issue hacktoberfest
難易度 2/5 1〜3時間 初心者へのやさしさ 92/100
メンテナーはふだん 1 日以内に返信
-
Stop the JSON formatter's Find bar from typing into the JSON対応中かも @kudala-bharani が 2 日前に担当しました。 オープンbug hacktoberfest help wanted
難易度 2/5 1〜3時間 初心者へのやさしさ 82/100
codercops/toolbelt#121 · コメント 2 件 · 担当者 1 名 ·
メンテナーはふだん 1 日以内に返信
-
JSON formatter: a duplicate key crashes the whole tool対応中かも @lb1192176991-lab が今日担当しました。 オープンbug good first issue hacktoberfest
難易度 2/5 1〜3時間 初心者へのやさしさ 35/100
codercops/toolbelt#218 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信
codercops/toolbelt の issue をすべて見る
似ている issue
-
frontend
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
メンテナーはふだん 1 日以内に返信
-
難易度 1/5 1時間未満 初心者へのやさしさ 86/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
ranxianglei/billion-context#4172 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
awslabs/threat-composer#362 ·
メンテナーはふだん 1 日以内に返信
-
Area/Cloud Needs Triage Type/Bug
難易度 1/5 1〜3時間 初心者へのやさしさ 86/100
wso2/product-integrator#2847 ·
メンテナーはふだん 1 日以内に返信