تطبيق صغير: من الصفر إلى اختبار أخضر

طريقان إلى نفس الفكرة

المتطلبات قبل البداية

المفاهيم الأساسية

كيف يعمل؟

شكل 1، ترتيب البناء: الاختبار قبل الكود، والمراجعة في النهاية لا في البداية

شكل 2، شكل المشروع: السهام المتقطّعة اختبارات، واحد يلمس المنطق مباشرة وواحد يمرّ بالشبكة

المشروع كاملًا، بمخرجات حقيقية

المشروع: واجهة برمجية صغيرة للمهام. GET /todos تُرجع القائمة، POST /todos تضيف، PATCH /todos/:id تقلب الحالة، DELETE /todos/:id تحذف. بلا حزم، بلا قاعدة بيانات.

هذا هو النطاق كاملًا. لاحظ أنه لا يعرف شيئًا عن HTTP:

// store.js - the whole domain, with no HTTP in it
let nextId = 1;
let items = [];

function reset() { nextId = 1; items = []; }
function list() { return items.slice(); }

function add(title) {
  if (typeof title !== "string" || title.trim() === "") {
    throw new TypeError("title must be a non-empty string");
  }
  const item = { id: nextId++, title: title.trim(), done: false };
  items.push(item);
  return item;
}

function toggle(id) {
  const item = items.find((t) => t.id === id);
  if (!item) return null;
  item.done = !item.done;
  return item;
}

function remove(id) {
  const before = items.length;
  items = items.filter((t) => t.id !== id);
  return items.length < before;
}

module.exports = { reset, list, add, toggle, remove };

والاختبار الذي كُتب قبله (مختصرًا):

// store.spec.js - no server, no network: the rules of the app
const assert = require("assert");
const store = require("./store");

check("a new store is empty", () => assert.deepStrictEqual(store.list(), []));

check("add returns the created item with id 1", () =>
  assert.deepStrictEqual(store.add("buy milk"), { id: 1, title: "buy milk", done: false }));

check("titles are trimmed", () =>
  assert.strictEqual(store.add("   spaced   ").title, "spaced"));

check("an empty title is rejected", () => assert.throws(() => store.add("   "), TypeError));

check("toggle flips done, twice returns it", () => {
  const t = store.add("x");
  assert.strictEqual(store.toggle(t.id).done, true);
  assert.strictEqual(store.toggle(t.id).done, false);
});

check("remove of a missing id returns false", () => assert.strictEqual(store.remove(999), false));

check("list returns a copy, not the live array", () => {
  store.add("a"); const copy = store.list(); copy.push({ id: 99 });
  assert.strictEqual(store.list().length, 1);
});

$ node store.spec.js
PASS  a new store is empty
PASS  add returns the created item with id 1
PASS  ids increase and do not repeat
PASS  titles are trimmed
PASS  an empty title is rejected
PASS  a non-string title is rejected
PASS  toggle flips done, twice returns it
PASS  toggle of a missing id returns null
PASS  remove deletes exactly one item
PASS  remove of a missing id returns false
PASS  list returns a copy, not the live array

11/11 checks passed

ثم طبقة النقل، قرارات صفر، توصيل فقط:

// server.js - HTTP only; every decision lives in store.js
const http = require("http");
const store = require("./store");

const server = http.createServer(async (req, res) => {
  const { method } = req;
  const path = req.url.split("?")[0];
  const idMatch = /^\/todos\/(\d+)$/.exec(path);

  if (method === "GET" && path === "/todos") return json(res, 200, store.list());

  if (method === "POST" && path === "/todos") {
    const body = await readBody(req);
    try { return json(res, 201, store.add(body.title)); }
    catch (e) { return json(res, 400, { error: e.message }); }
  }

  if (method === "PATCH" && idMatch) {
    const item = store.toggle(Number(idMatch[1]));
    return item ? json(res, 200, item) : json(res, 404, { error: "no such todo" });
  }

  if (method === "DELETE" && idMatch) {
    return store.remove(Number(idMatch[1]))
      ? json(res, 204, null)
      : json(res, 404, { error: "no such todo" });
  }

  return json(res, 404, { error: "unknown route" });
});

$ node http.spec.js
PASS  GET /todos starts empty
PASS  POST /todos returns 201 and the item
PASS  POST with an empty title returns 400
PASS  PATCH /todos/1 toggles done
PASS  PATCH a missing id returns 404
PASS  DELETE /todos/1 returns 204 and empties the list
PASS  an unknown route returns 404

7/7 checks passed

وهنا جاء الاقتراح الجميل الخطر

طلبنا «اختصر remove». الاقتراح كان أقصر فعلًا وأكثر شيوعًا في الكود المكتوب حول العالم:

// the suggestion: "shorter and more idiomatic"
function remove(id) {
  items.splice(items.findIndex((t) => t.id === id), 1);
  return true;
}

يبدو سليمًا. وهو كذلك، إلا في حالة واحدة. findIndex تُرجع -1 عند عدم الإيجاد، وsplice(-1, 1) تعني «ابدأ من آخر عنصر»:

$ node -e '...add two tasks, then remove a missing id...'
before       [ 'keep me', 'and me' ]
remove(999)  true
after        [ 'keep me' ]        <-- "and me" is gone

حذف المهمة الخطأ، وأعاد true كأن العملية نجحت. ولولا سطر واحد في الاختبار لمرّ هذا إلى الإنتاج:

$ node store.spec.js
FAIL  remove of a missing id returns false -> Expected values to be strictly equal:

true !== false

10/11 checks passed
$ echo $?
1

اعتقاد شائع × الحقيقة

جرّب بنفسك

بطاقات مراجعة سريعة

تحقّق من فهمك