📋 محتويات الصفحة
📖 الوصف
Testing Library هي عائلة من مكتبات الاختبار التي تركز على اختبار مكونات UI بنفس الطريقة التي يستخدمها المستخدمون. تشجع على الاختبار من خلالqueries على DOM بدلاً من التفاصيل الداخلية للمكونات. تشمل العائلة: DOM Testing Library، React Testing Library، Vue Testing Library، Cypress Testing Library، و N...
🎯 يستخدم في
مجالات استخدام هذه الأداة
اختبار مكونات React
اختبار مكونات Vue و Angular
Testing Accessibility
User-centric Testing
Component Integration
✨ المميزات
أبرز مميزات هذه الأداة
Easy User-centric Queries
easy Framework Agnostic
easy Accessibility Testing
easy Simple API
easy Good Practices
easy Community
easy TypeScript
⚠️ العيوب
نقاط يجب مراعاتها
يحتاج تغيير mental model
قد يكون محدوداً في بعض الحالات
غير مناسب لـ Implementation Testing
يحتاج تعلّم queries جديدة
💻 مثال على الاستخدام
كيفية استخدام هذه الأداة
// React Testing Library
import { render, screen, fireEvent, waitFor } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { Login } from './Login'
test('submits form with credentials', async () => {
const onLogin = jest.fn()
render(<Login onLogin={onLogin} />)
// استخدم دور accessibility
const emailInput = screen.getByRole('textbox', { name: /email/i })
const passwordInput = screen.getByLabelText(/password/i)
const submitButton = screen.getByRole('button', { name: /submit/i })
await userEvent.type(emailInput, 'john@example.com')
await userEvent.type(passwordInput, 'password123')
await userEvent.click(submitButton)
await waitFor(() => {
expect(onLogin).toHaveBeenCalledWith({
email: 'john@example.com',
password: 'password123'
})
})
})📚 أدوات أخرى في Testing
قد يعجبك أيضاً