frontend-testing

Umiejętność Claude'a do tworzenia testów jednostkowych i integracyjnych dla frontendu Dify. Automatycznie generuje testy dla komponentów, hooków i narzędzi, stosując się do konwencji projektu. Wspiera Vitest 4.0.16 i React Testing Library 16.0. Aktywuje się na żądania dotyczące testowania, plików spec, pokrycia kodu, a także na wzmianki o Viteście, RTL czy testach jednostkowych. Idealny dla deweloperów pracujących nad frontendem Dify, którzy chcą szybko pisać wysokiej jakości testy.

1. Zainstaluj umiejętność w swoim środowisku Claude'a, wskazując repozytorium langgenius/dify. Upewnij się, że masz dostęp do pliku web/docs/test.md, który zawiera autorytywne wytyczne testowania dla projektu.

2. Przygotuj kontekst, podając Claude'owi ścieżkę do komponentu, hooka lub narzędzia, które chcesz przetestować. Możesz użyć polecenia pnpm analyze-component <ścieżka>, aby wygenerować szczegółową analizę złożoności kodu.

3. Poproś Claude'a o napisanie testów, na przykład: "Napisz testy dla tego komponentu" lub "Przejrzyj istniejące testy pod kątem kompletności". Umiejętność automatycznie rozpozna żądanie i zastosuje odpowiednie wzorce testowania.

4. Claude wygeneruje pliki spec z rozszerzeniem .spec.tsx w tym samym katalogu co testowany kod, używając Vitest i React Testing Library. Testy będą zawierać mockowanie HTTP za pomocą nock i obsługę timerów poprzez API vi.*.

5. Uruchom wygenerowane testy poleceniem pnpm test <ścieżka/do/pliku.spec.tsx> lub pnpm test:watch, aby śledzić zmiany w czasie rzeczywistym.

6. Sprawdź pokrycie kodu za pomocą pnpm test:coverage i popros Claude'a o uzupełnienie brakujących scenariuszy testowych, jeśli jest to konieczne.