Softonic

مولّد إعداد Jest

خطوة 1 / 2 إعداد jest
التالي

اختر حزمتك التقنية، TypeScript أو React أو خادم Node أو Svelte، ويُخرج المولّد ملف jest.config.js بالمحوّلات الصحيحة، ومخطط الوحدات، وبيئة الاختبار، وعتبات التغطية. يتضمن كل خيار ينساه الناس: moduleNameMapper لـ CSS/الصور، وsetupFilesAfterEach، وtestPathIgnorePatterns لـ node_modules وdist.

كيف تبني إعداد Jest

  1. 1

    اختر حزمتك التقنية

    TypeScript أو React أو Vue أو Svelte أو Node خالص أو مزيج. يملأ كل منها المحوّلات الصحيحة مسبقا.

  2. 2

    اختر بيئة الاختبار

    jsdom لكود المتصفح، وnode للخلفية، أو بيئة مخصصة.

  3. 3

    فعّل الميزات

    عتبات التغطية، واختبار اللقطات، ومسارات المحاكاة، وملفات الإعداد المخصصة، وأنماط تجاهل التحويل.

  4. 4

    نزّل الإعداد

    المخرج هو `jest.config.js` أو `jest.config.ts` معلّق، إضافة إلى سكربتات npm التي ينبغي أن تضيفها إلى `package.json`.

مخرج نموذجي: مشروع React + TypeScript

module.exports = {
  preset: "ts-jest",
  testEnvironment: "jsdom",
  setupFilesAfterEach: ["<rootDir>/jest.setup.ts"],
  moduleNameMapper: {
    "\\.(css|less|scss|sass)$": "identity-obj-proxy",
    "\\.(jpg|jpeg|png|gif|svg)$": "<rootDir>/__mocks__/fileMock.js",
    "^@/(.*)$": "<rootDir>/src/$1"
  },
  testPathIgnorePatterns: ["/node_modules/", "/dist/", "/build/"],
  transform: {
    "^.+\\.tsx?$": ["ts-jest", { tsconfig: "tsconfig.test.json" }]
  },
  collectCoverageFrom: [
    "src/**/*.{ts,tsx}",
    "!src/**/*.d.ts",
    "!src/**/*.stories.*"
  ],
  coverageThreshold: {
    global: { branches: 80, functions: 80, lines: 85, statements: 85 }
  }
};

دليل القرار: أي بيئة؟

يعمل كودك في… استخدم
المتصفح (DOM، window) jsdom (أو @happy-dom/jest-environment للسرعة)
خادم Node node
عمال الخدمة بيئة مخصصة، بأساس node
React Native إعداد react-native المسبق

ورقة المحوّلات

نوع المصدر المحوّل
TypeScript ts-jest أو @swc/jest
JSX المترجم بـ Babel babel-jest (افتراضي)
Vue SFC @vue/vue3-jest + babel-jest
Svelte svelte-jester
الصور الثابتة محاكاة يدوية في moduleNameMapper

عتبات التغطية: أي أرقام؟

  • المسار الحرج / المكتبات: 90%+ أسطر، 85%+ فروع.
  • فرق الميزات: 80% أسطر، 70% فروع.
  • واجهة سريعة التغير: 60-70% أسطر؛ استهدف أعلى لمنطق الأعمال، وأقل للتخطيط.
  • النماذج الأولية: عطّل العتبات تماما؛ تتبّع التغطية كرقم، لا كبوابة.

الأخطاء الشائعة

  • استخدام jsdom لكود Node الخالص. اختبارات أبطأ دون مكسب، تحول إلى node.
  • فقدان transformIgnorePatterns لحزم ESM. تأتي الحزم الحديثة بصيغة ESM فقط؛ ويحتاج Jest إلى إخباره بتحويلها.
  • محاكاة الصور / CSS دون مخطط. استورد ملف .png في اختبار ويتعثر Jest دون وحدة محاكاة.
  • ضبط clearMocks على false. تتسرب المحاكاة عبر الاختبارات وتصبح الإخفاقات غير حتمية. فعّلها افتراضيا.

الأسئلة الشائعة

SWC (@swc/jest) أسرع بـ 10-20 مرة من ts-jest لأنه يتخطى التحقق الكامل من الأنواع داخل Jest. شغّل التحقق من الأنواع بشكل منفصل كـ tsc --noEmit في CI. استخدم ts-jest عندما تريد أن تفشل الاختبارات بسبب أخطاء الأنواع؛ واستخدم SWC للسرعة.

happy-dom أسرع بنحو 2-3 مرات من jsdom وينفّذ مجموعة فرعية كبيرة من واجهات DOM. يفوّت بعض الحالات الحدية، فإذا واجهت خطأ «غير منفّذ»، فارجع إلى jsdom.

نعم، إذا كانت مكوناتك تستورد ملفات .css أو .scss مباشرة. اربطها بـ identity-obj-proxy (لوحدات CSS) أو ببديل فارغ صغير. بدون هذا، ستخطئ اختباراتك وقت الاستيراد.

نعم. اختر خيار مخرجات TypeScript ويُخرج المولّد jest.config.ts. يحمّل Jest 27+ تلقائيا إعدادات .ts عند تثبيت ts-node.

أدوات ذات صلة

مرجع جدول ASCII

جدول ASCII كامل من 0 إلى 127 مع التمثيل العشري والست عشري والثماني والثنائي والمرجع الرقمي في HTML لكل محرف، بما في ذلك أكواد التحكم مثل NUL وLF وDEL.

مرجع أحرف HTML

قائمة قابلة للبحث بكيانات HTML، مع رموزها المسمّاة والرقمية، بالإضافة إلى خيار النسخ بنقرة واحدة للأحرف والرموز الخاصة.

مرجع اختصارات لوحة المفاتيح

ابحث في الاختصارات الافتراضية الموثقة لـ VS Code وChrome وBash مع GNU Readline على macOS وWindows وLinux.

مدقق البريد الإلكتروني

تحقق من عنوان بريد إلكتروني: فحص صياغة RFC 5322، واستعلام حي عن سجل MX، بالإضافة إلى تفاصيل الجزء المحلي والنطاق والطول. لا يتم إرسال أي بريد.

مولد EditorConfig

أنشئ ملف .editorconfig بقواعد نمط المسافة البادئة وحجمها ونهاية السطر ومجموعة الأحرف والمسافات البيضاء، لتنسيق موحّد عبر بيئات التطوير المتكاملة (IDEs) والمحررات.

منسق HTML

نسّق HTML محلياً في المتصفح بمسافة بادئة من مسافتين أو أربع مسافات. لا يُرفع HTML ولا يُتحقق منه.

الأداة متاحة بلغات أخرى