אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » מדריכים » Express » בדיקות אוטומטיות עם express.js – התקנה ועבודה עם supertest

בדיקות אוטומטיות עם express.js – התקנה ועבודה עם supertest

רן בר-זיק יולי 17, 2016 7:07 am אין תגובות

כיצד מתחילים לעבוד עם mocha ו-supertest כדי להתחיל ולכתוב בדיקות אוטומטיות לאפליקצית express.js.

המאמר הקודם בסדרת המדריכים על expresדפי 500 ו-400 ב-express.js
המאמר הבא בסדרת המדריכים ל-expressעבודה מתקדמת עם supertest לבדיקת express
כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

כתבתי במדריך על node.js על בדיקות אוטומטיות ב-node.js והסברתי איך כותבים אותן. במאמר הזה אני ארחיב על בדיקות אוטומטיות עם express. בדיקות אוטומטיות הן חלק מהותי וחשוב מאוד מכל תהליך של continuous integration ואני לא חושב שאפשר לפתח היום ללא כתיבת בדיקות אוטומטיות. באופן אישי, כאשר אני מפתח, אני משתמש בתהליך שנקרא Test Driven Development, כלומר כותב את הבדיקות קודם ורק את הקוד אחר כך.

התקנת סביבת הבדיקות הראשונית

על מנת להריץ בדיקות אנחנו צריכים פריימוורק של בדיקות. קוד שידע לקחת את הבדיקות שאנחנו כותבים ולהריץ אותן. הפריימוורק שאני משתמש בו ב-node.js הוא mocha. על מנת להשתמש בו, אנחנו צריכים להתקין אותו באופן גלובלי באופן הבא:


npm install -g mocha

אחרי ההתקנה, אם תכתבו mocha -V (שימו לב, ה-V גדולה) בכל מקום באמצעות הקונסולה, נראה את הגרסה של mocha.

אם אנחנו משתמשים ב-mocha בפרויקט שלנו, מקובל לכלול אותו גם ב-package.json בחלק של ה-dev. עושים את זה באמצעות:


npm install mocha --save-dev

בתיקית הפרויקט. זה לא נדרש על מנת שהכל יעבוד, אבל מקובל מאוד.

השלב הבא הוא לפתוח תיקית test בפרויקט שלנו. באופן דיפולטיבי, mocha תמיד מסתכלת בתיקית test. בתוכה ניצור קובץ עם סיומת js, למשל test.js. על מנת שהכל עובד, נכתוב בדיקת דמה כלשהי בתוך test.js:


var assert = require("assert"); // core module
describe('Array', function() {
  describe('#indexOf()', function () {
    it('should return -1 when the value is not present', function () {
      assert.equal(-1, [1,2,3].indexOf(5));
      assert.equal(-1, [1,2,3].indexOf(0));
    });
  });
});

אם הכל תקין והסביבה מקונפגת יפה, כשנכתוב mocha בתיקיה הראשית של הפרויקט. נראה משהו כזה:

$ mocha     Array     #indexOf()       √ should return -1 when the value is not present     1 passing (7ms)
$ mocha
Array
#indexOf()
√ should return -1 when the value is not present
1 passing (7ms)

אם זה עדיין נראה לכם כמו סינית ואתם לא מבינים את הסינטקס של הבדיקה, אני ממליץ לכם לרענן את הידע בבדיקות בסביבת node.js עם mocha.

טעינת אפליקצית express ועבודה עם supertest

עכשיו ניגש לאפליקציה שלנו, שהיא אפליקצית express. יש כמה דרכים לבדוק אפליקציה כזו, אבל אני אדבר על הדרך שבה אני בודק אותה – וזה בדיקת התוצר הסופי. אם נסתכל על האפליקציה שבניתי, שמחזירה מידע אם אני נכנס ל /help/about-me/, הבדיקה שלי תהיה בעצם הרמת השרת, יצירת 'דפדפן' וירטואלי, כניסה אל הכתובת ובדיקה שהדף קיים ויש בו את התוכן שאני רוצה.

אני רק רוצה להזכיר שיש לנו app.js שנראה ככה:


var express = require('express');
var app = express();
var help = require('./help');

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

app.set('view engine', 'ejs');

//Routers.
app.use('/help', help);

//The 404 Route (ALWAYS Keep this as the last route).
app.get('*', function(req, res){
  res.send('404 page', 404);
  //You can use template too! res.render('404-page');

});

//500 Middleware
app.use(function(err, req, res, next) {
  console.error(err.stack);
  res.status(500).send('Something broke!');
  //You can use template too! res.render('500-page');
});

module.exports = app;

אני רוצה שתשימו לב לשורה האחרונה – השורה הזו לא נדרשת לתפקוד ה-express באופן רגיל, אך היא קריטית לבדיקה האוטומטית ואנחנו צריכים אותה. מה שהיא עושה (למי ששכחת node.js בסיסי) זה לחשוף את app.js החוצה למי שיקרא לו.

הראוטר שלנו הוא help והוא מכיל כתובת אחת של about-me. זה נראה ככה:


var express = require('express');
var router = express.Router();

router.get('/about-me', function(req, res) {

  var children = [
    { id: 1, name: "Omri" },
    { id: 2, name: "Kfir" },
    { id: 3, name: "Daniel" },
    { id: 3, name: "Michal" }
  ];

  res.render('about-me', {pageName : 'About Me', children: children});
});

module.exports = router;

אם אני מפעיל את ה-express שלי עם node app.js, ואכנס אל http://localhost:3000/help/about-me, אני אראה את שמות הילדים.

עכשיו, אני רוצה לכתוב את הבדיקה. אמרתי שאחת ממטרות הבדיקה היא ליצור דפדפן 'וירטואלי'. כלומר מודול שישלח בקשה ל-localhost. המודול שאני משתמש בו נקרא supertest והוא בנוי על superagent. הוא מאפשר לי בקלות ליצור בקשות לכל כתובת שהיא. על מנת להתקינו אני אכתוב בקונסולה:


npm install supertest --save-dev

כזכור, הפלאג save-dev מכניס את המודול הזה ל-package.json בחלק של ה-dev. עכשיו כל מה שנותר לנו לעשות זה לכתוב את הבדיקה. כך זה נראה:


var request = require('supertest'),
  app = require('../app.js');

describe('help router', function(){ //Name of the tests collection
  it('GET about-me should return 200', function(done){ //Single test
    request(app) //Initiating the supertest with the app
      .get('/help/about-me')//Send GET to localhost:3000/help/about-me
      .expect(200, done);
  });
});

מה בעצם קורה פה? מה שמעניין הוא ה-supertest שנכנס לתוך request. אנחנו מאתחלים אותו על ידי העברת ארגומנט app שהוא אפליקצית ה-express שלנו. עכשיו אנחנו משתמשים במתודת get כדי ליצור בקשת GET ושם אנחנו מפרטים את היעד ומציינים שאנחנו רוצים לקבל 200.

אם נכתוב mocha, נראה שהבדיקה רצה בהצלחה:

$ mocha   Example app listening on port 3000!   help router     √ GET about-me should return 200
$ mocha
Example app listening on port 3000!
help router
√ GET about-me should return 200
כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
לכל המאמרים בסדרת המדריכים על express
express.js

השארת תגובה

ביטול

ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

    הפרויקטים שאני כותב ושוחררו לציבור ברישיון קוד פתוח נמצאים ברובם בגיטהאב.
חיפוש

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד