0Pricing
Vibe Coding · درس

إضافة الاختبارات باستخدام AI

اكتشف الأعطال قبل المستخدمين

إضافة الاختبارات باستخدام AI درس مجاني في Vibe Coding على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Vibe Coding، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Vibe Coding 4 دروس في المجموع.

بعض أجزاء هذا الدرس لم تُترجم بعد وتظهر باللغة الإنجليزية.

Why Tests Save Your App

You vibe-coded an app. It works today. But next week you ask AI to add a feature, and something else silently breaks. Tests are tiny programs that check your app still does the right thing.

Think of tests as a safety net: every time you change code, they re-run and shout if anything broke. With AI, you don't even have to write them by hand — you describe what should happen and let the AI generate the tests.

What a Test Actually Looks Like

A test calls your code with some input and checks the output is what you expect. If it isn't, the test fails and points at the problem.

Here's a real, runnable example: a function plus a check.

function add(a, b) {
  return a + b;
}

// a tiny hand-made 'test'
function expectEqual(actual, expected, label) {
  if (actual === expected) console.log('PASS: ' + label);
  else console.log('FAIL: ' + label + ' (got ' + actual + ')');
}

expectEqual(add(2, 3), 5, 'adds two numbers');
expectEqual(add(-1, 1), 0, 'handles negatives');

Let AI Write the Tests

You rarely write tests from scratch anymore. You paste your function into Cursor, Claude Code, or Copilot and ask for tests. The key is telling the AI which cases matter: normal input, weird input, and edge cases (empty, zero, negative, huge).

Here is a prompt you can copy.

Here is my function:

function discount(price, percent) {
  return price - (price * percent / 100);
}

Write tests using Vitest. Cover:
- a normal case (100 at 20%)
- 0% discount
- 100% discount
- a negative price (should it even be allowed?)
Use describe/it/expect. Keep it short.

Test Runners: The Tool That Runs Tests

You don't run tests by hand. A test runner finds all your test files, runs them, and prints a clean PASS/FAIL report. For JavaScript the popular ones are Vitest and Jest.

Ask your AI tool to set one up — it knows the commands and config so you don't have to memorize them.

Set up Vitest in this project. Add the dependency, a "test" script in package.json, and a sample test file so I can run `npm test` and see it pass.

Anatomy of a Real Test File

Most JS tests share the same shape: describe groups related tests, it (or test) is one case, and expect checks a value. AI generates this pattern constantly, so it pays to recognize it.

This is what the AI typically hands back.

import { describe, it, expect } from 'vitest';
import { discount } from './pricing';

describe('discount', () => {
  it('takes 20% off 100', () => {
    expect(discount(100, 20)).toBe(80);
  });

  it('returns full price at 0%', () => {
    expect(discount(100, 0)).toBe(100);
  });
});

Tests as a Spec for the AI

Here's a power move: write the tests first, then ask AI to make them pass. The tests become a precise description of what you want, with zero ambiguity.

This flips the workflow — instead of describing behavior in fuzzy words, you describe it in checkable code.

These tests describe a function I want. Write the `slugify` function so ALL of these pass:

import { slugify } from './slug';
expect(slugify('Hello World')).toBe('hello-world');
expect(slugify('  Spaced  Out ')).toBe('spaced-out');
expect(slugify('A/B & C')).toBe('a-b-c');

Return only the function.

Don't Trust Tests That Always Pass

AI sometimes writes tests that can't fail — they assert something trivially true, or they re-implement the bug. A passing test that proves nothing is worse than no test.

Quick check: temporarily break your function on purpose. If the test still passes, it's a fake test. Ask the AI to make it actually verify the behavior.

// Suspicious: this passes no matter what discount() returns
it('works', () => {
  const result = discount(100, 20);
  expect(typeof result).toBe('number'); // too weak!
});

// Better: checks the actual value
it('takes 20% off 100', () => {
  expect(discount(100, 20)).toBe(80);
});

Cover the Edge Cases

Bugs hide in the unusual inputs: empty strings, zero, negative numbers, missing values, very large lists. AI is great at brainstorming these if you ask.

Use a prompt that pushes for the weird cases on purpose.

List the edge cases I should test for this function, then write a test for each:

function averageScore(scores) {
  return scores.reduce((a, b) => a + b, 0) / scores.length;
}

Think about: empty array, one item, negatives, non-numbers. What should happen for each?

Run Tests Automatically (CI)

The real win: tests run on every change, automatically. When you push to GitHub, a service like GitHub Actions re-runs your whole test suite. If something broke, you find out in minutes — not from an angry user.

You don't have to learn the YAML config. Ask your AI to write it.

Create a GitHub Actions workflow that runs `npm install` and `npm test` on every push and pull request. Use Node 20. Put it in .github/workflows/test.yml.

A Sensible Testing Rhythm

You don't need 100% coverage to benefit. A practical rhythm for vibe coders:

  • Test the logic that matters — pricing, auth, data parsing, anything users feel.
  • Skip trivial UI glue at first.
  • Add a test every time you fix a bug so it never comes back.

Ask AI: What are the 5 most important things to test in this app? and start there.

Reading the Test Report

When tests fail, the runner tells you exactly what it expected vs. what it got. Don't panic — copy that whole report to your AI and ask it to fix the code or the test (you decide which is wrong).

My test failed with this output:

FAIL  src/pricing.test.js
  discount > takes 20% off 100
  expected 80 but got 120

Here is the discount function: <paste it>
Is the function wrong or the test wrong? Fix the right one and explain.

Quick Check

You ask AI for tests and every single one passes immediately — even after you intentionally break the function. What's the most likely problem?

Recap: Tests Are Your Safety Net

You learned why tests matter when AI is changing your code, what a test looks like, and how to let AI write them for you. Key habits:

  • Tell the AI which cases matter, especially edge cases.
  • Use a runner like Vitest and run tests on every change with CI.
  • Verify tests can actually fail — break the code on purpose.
  • Add a test whenever you fix a bug.

Next up: keeping your AI-generated code secure.

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

هل درس «إضافة الاختبارات باستخدام AI» مجاني؟

نعم — نص درس «إضافة الاختبارات باستخدام AI» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Vibe Coding، انتقل إلى CoddyKit PRO. تتضمن دورة Vibe Coding 4 دروس في المجموع.

ماذا ستتعلم في «إضافة الاختبارات باستخدام AI»؟

اكتشف الأعطال قبل المستخدمين تتمرن على Vibe Coding مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Vibe Coding؟

لا تُشترط خبرة سابقة. Vibe Coding على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.

كم من الوقت يستغرق درس «إضافة الاختبارات باستخدام AI»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Vibe Coding هذا؟

نعم. كل درس في Vibe Coding يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. إضافة الاختبارات باستخدام AI
  2. أساسيات الأمان لتعليمات AI البرمجية
  3. الحفاظ على قابلية صيانة التعليمات البرمجية
  4. الأداء والتكلفة
← العودة إلى Vibe Coding