نحوه استفاده از فریمورک Nightwatch.js برای تست خودکار – بخش اول

آفلاین
user-avatar
عرفان حشمتی
04 بهمن 1399, خواندن در 9 دقیقه

سلنیوم ابزاری است که به طور گسترده برای تست خودکار مرورگر مورد استفاده قرار می‌گیرد. متن باز بودن این امکان را به سلنیوم می‌داد که با چندین فریمورک اتوماسیون تست برای زبان‌های مختلف برنامه نویسی سازگار باشد و اگر در مورد تست اتوماسیون با سلنیوم و جاوااسکریپت صحبت کنیم، یک فریمورک خاص وجود دارد که هرگز نتوانست در کانون توجه قرار گیرد و آن Nightwatch.js است. به همین دلیل تصمیم گرفتیم آموزش Nightwatch.js را برای مبتدیان ترتیب دهیم.

در این مقاله گام به گام به آموزش Nightwatch JS خواهیم پرداخت تا تست با سلنیوم و جاوااسکریپت را برای تست خودکار مرورگر انجام دهیم. همچنین چگونگی نصب و راه اندازی Nightwatch JS را بررسی خواهیم کرد و به جزئیات مربوط به پیکربندی آن و فایلهای مهم و ساختار دایرکتوری خواهیم پرداخت. سپس اولین اسکریپت تست Nightwatch.js را انجام می‌دهیم و برخی از مشکلاتی که ممکن است با آنها روبه رو شویم را برطرف خواهیم کرد. بیایید ابتدا با یک مقدمه اساسی شروع کنیم.

Nightwatch.js چیست؟

Nightwatch.js یک فریمورک تست خودکار متن باز است که هدف آن ارائه راه‌حل‌های کامل E2E برای خودکار کردن تست با سلنیوم جاوااسکریپت برای برنامه‌های تحت وب، برنامه‌های مرورگر و وب سایت‌ها است. این فریمورک متکی به سلنیوم است و چندین دستور را برای انجام عملیات بر روی عناصر DOM ارائه می‌دهد. همچنین از API قدرتمند W3C WebDriver یا Selenium WebDriver استفاده می‌کند و نوشتن تست‌های خودکار end-to-end را در Node.js ساده می‌کند و بدون زحمت برای ادغام مداوم تنظیم می‌شود.

چرا Nightwatch.js اینقدر محبوب است؟

قبل از اینکه در این آموزش Nightwatch.js به اجرای اسکریپت‌های تست عمیق بپردازیم، درک دلایل محبوبیت Nightwatch.js اهمیت دارد. Nightwatch.js باعث ساده‌تر شدن تست عملکردی end-to-end مرورگر در یک محیط node.js می‌شود که تست برنامه‌های وب مستقل از نرم‌افزار شخص ثالث را امکان پذیر می‌سازد. هدف اصلی فریمورک‌های تست خودکار سبک و قوی مانند Nightwatch.js این است که یک راه‌حل واحد و یکپارچه برای تست برنامه داشته باشید. از آنجایی که Nightwatch JS بر روی Node.js ساخته شده است، دارای مزایای عمده‌ای نسبت به سایر ابزارهای تست اتوماسیون سلنیوم است. این تست خودکار مرورگر با استفاده از Nightwatch.js عامل وابستگی به نرم‌افزار شخص ثالث را از بین می‌برد و در نتیجه باعث افزایش یکپارچگی داده‌ها در میان اجزای مختلف سیستم می‌گردد.

Nightwatch JS ویژگی‌های زیر را به صورت out of the box ارائه می‌دهد:

  • تست داخلی: همراه با یک مجموعه آزمایشی خط فرمان با پشتیبانی Grunt برای اجرای تست‌های خودکار.
  • استراتژی تست: این ویژگی را دارد که تست‌ها را به طور کارآمد اجرا می‌کند و از بسیاری جهات مانند موازی، ترتیبی و گروهی قابل انجام است.
  • سرویس‌های ابری: با ارائه یکپارچه سازی توسط سرویس دهندگان تست سلنیوم مبتنی بر ابر مانند LambdaTest، پشتیبانی خوبی از Cross Browser Testing با جاواسکریپت سلنیوم را فراهم می‌کند.
  • سرور سلنیوم: امکان کنترل خودکار سرور سلنیوم مستقل با گزارش JUnit XML داخلی.
  • CSS و XPath: چندین دستور برای عملیات DOM، سلکتورهای CSS و XPath می‌توانند به منظور شناسایی عناصر موجود در صفحه مورد استفاده قرار گیرند. این امر باعث می‌شود که فریمورک Nightwatch JS انعطاف پذیر بوده و به راحتی در هنگام اجرای دستورات و اعلان‌های مخصوص برنامه، توسعه یابد.
  • یکپارچگی: این فریمورک پشتیبانی خوبی از یکپارچگی مداوم ارائه می‌دهد، از این رو می‌تواند برای ادغام تست با سیستم‌های پردازش مانندJenkins ، TeamCity و ... همچنین کمک به توسعه دهندگان در ساخت و تست نرم‌افزار به طور مداوم استفاده شود.

جدا از همه ویژگی‌های فوق که ارائه می‌دهد، داشتن یک سینتکس تمیز و ساده بسیار عالی است و فقط با استفاده از سلکتورهای CSS Node.js و مکان یاب XPath در سلنیوم نوشتن تست‌ها را به راحتی هر چه تمام انجام می‌دهد.

Nightwatch JS چگونه کار می‌کند؟

Nightwatch از طریق یک پروتکل API restful که در W3C WebDriver API تعریف شده است ارتباط برقرار می‌کند و به یک HTI API restful با سرور وب درایور سلنیوم جاوااسکریپت نیاز دارد.

برای انجام هر عملیاتی به عنوان مثال یک دستور یا یک اعلان، Nightwatch معمولا نیاز به ارسال حداقل دو درخواست دارد که به شرح زیر است:

  • درخواست اول، عنصر مورد نیاز را با عبارت XPath یا سلکتور CSS تعیین شده قرار می‌دهد.
  • درخواست دوم، عنصر را می‌گیرد و عملیات واقعی command یا assertion را انجام می‌دهد.

نصب و پیش نیازهای Nightwatch.js

برخی از پیش نیازهای اساسی وجود دارد که برای شروع با این آموزش Nightwatch JS برای تست با سلنیوم و جاوااسکریپت لازم است.

  • Node.js: ماژول Nightwatch توسط Node.js ساخته شده که نشان می‌دهد Node.js برای نصب روی سیستم لازم است.
  • Node Package Manager (npm): پس از نصب Node.js، مدیر بسته node یعنی npm می‌تواند برای نصب پکیج که بزرگترین اکوسیستم پکیج‌ها است، استفاده شود.

اکنون برای نصب آخرین نسخه با استفاده از ابزار خط فرمان npm، دستور زیر اجرا می‌شود (در اینجا "g" برای نصب گلوبال است):

$ npm install -g nightwatch

دستور زیر (‘–save-dev’) اجرایی را در پوشه node_modules/.bin/. قرار می‌دهد.

$ npm install --save-dev nightwatch
  • جاوا - SDK: سلنیوم برای سرور سلنیوم از راه دور خود به جاوا نیاز دارد. از آنجا که Nightwatch به Selenium WebDriver API متکی است و همچنین به یک Selenium WebDriver Server احتیاج دارد، به همین دلیل به نصب کیت توسعه Java (JDK 7+) بر روی سیستم و پیکربندی محیط JAVA نیاز است.
  • سرور سلنیوم: به یک بسته سرور مستقل سلنیوم JAR نیاز دارد که می‌توانید آن را از صفحه سلنیوم دانلود کنید. پس از آن باید در پوشه bin پروژه قرار داده شود و می‌توان با استفاده از دستور زیر سرور سلنیوم را استارت زد:
selenium-server-standalone-{version}.jar
  • Chrome Driver: در آخر به یک درایور کروم نیاز دارد که یک سرور مستقل است و پروتکل W3C Web Driver را برای کرومیوم پیاده‌سازی می‌کند. این فایل اجرایی نیز باید درون همان پوشه bin قرار گیرد.
$ npm install --save-dev chromedriver</pre>

پیکربندی و تنظیمات Nightwatch.js

اکنون که اصول را به طور کامل شرح دادیم، زمان آن فرا رسیده است که به تست Nightwatch با سلنیوم و جاوااسکریپت از طریق این آموزش برای مبتدیان بپردازیم. Nightwatch.js یک تست داخلی ارائه می‌دهد و انتظار دارد یک فایل پیکربندی JSON منتقل شود. فایل پیکربندی پیش فرض nightwatch.json است که باید در دایرکتوری اصلی پروژه وجود داشته باشد. همچنین می‌توان از فایل پیکربندی nightwatch.conf.js نیز استفاده کرد و برای تست Nightwatch از مسیر اصلی پروژه دانلود می‌شود.

توجه: اگر هر دو فایل پیکربندی در دایرکتوری وجود داشته باشد، به nightwatch.conf.js اولویت داده می‌شود زیرا کمی انعطاف‌پذیری بیشتری برای ما ایجاد می‌کند.

حتی می‌توانید برای تست Nightwatch جزئیات خاصی را مانند محیط‌های آزمایش، تنظیمات سلنیوم و موارد دیگر اعلام کنید. به این ترتیب یک فایل پیکربندی nightwatch.json برای تست با سلنیوم و جاوااسکریپت به صورت زیر در نظر می‌گیریم.

{
  "src_folders" : ["tests"],
  "output_folder" : "reports",
  "custom_commands_path" : "",
  "custom_assertions_path" : "",
  "page_objects_path" : "",
  "globals_path" : "",
  "test_workers": {
    "enabled": true,
    "workers": "auto"
  },
  "selenium" : {
    "start_process" : true,
    "server_path" : "node_modules/selenium-standalone/.selenium/selenium-server/",
    "log_path" : "./reports",
    "host": "127.0.0.1",
    "port" : 4444,
    "cli_args" : {
      "webdriver.chrome.driver" : "",
      "webdriver.gecko.driver" : "",
      "webdriver.edge.driver" : ""
    }
  },
 
  "test_settings" : {
    "default" : {
      "launch_url" : "http://localhost",
      "selenium_port"  : 4444,
      "selenium_host"  : "localhost",
      "silent": true,
      "screenshots" : {
        "enabled" : false,
        "path" : ""
      },
      "desiredCapabilities": {
        "browserName": "firefox",
        "marionette": true,
        "javascriptEnabled": true,
        "acceptSslCerts": true
      }
    },
 
    "chrome" : {
      "desiredCapabilities": {
        "browserName": "chrome"
      }
    },
 
    "edge" : {
      "desiredCapabilities": {
        "browserName": "MicrosoftEdge"
      }
    }
  }
}

بیایید نگاهی دقیق به ساختار فایل پیکربندی nightwatch.json بیندازیم.

  • src_folders: این پوشه نشان‌دهنده مکانی است که مجموعه‌های تست را شامل می‌شود.
  • output_folder: این پوشه مکانی را نشان می‌دهد که شامل گزارش‌های تست است. به عنوان مثال فایل‌های گزارش JUnit، گزارش‌های XML، گزارش سلنیوم، تصاویر صفحه، گزارش‌های ویدئویی، گزارش‌های شبکه و غیره.
  • globals_path: مسیر فایل را نشان می‌دهد که در آن تمام پارامترهای گلوبال استفاده شده در مجموعه تست آغاز می‌شود. اینها بارگذاری شده و به عنوان یک ویژگی گلوبال در تست‌ها ارائه می‌شوند. همچنین می‌توانند در محیط test_settings اصلاح شوند.
  • test_workers: این ویژگی تعیین می‌کند که آیا می‌خواهیم مجموعه‌های تست را به طور موازی اجرا کنیم. اگر فعال بودن روی true تنظیم شده باشد، نشان میدهد که موازی سازی برای استراتژی تست مجاز است.
  • page_objects_path: محلی را نشان می‌دهد که فایل شی صفحه از آنجا بارگیری می‌شود.
  • selenium: شامل تمام اطلاعات و سفارشی سازی مربوط به پیکربندی سرور سلنیوم است. علاوه بر این شامل server_path و webdriver.chrome.driver است که به ترتیب مسیر دسترسی به سرور سلنیوم و درایور کروم را نشان می‌دهد. همچنین اگر پارامتر start_process روی true تنظیم شده باشد، به سرور سلنیوم اجازه می‌دهد تا به طور خودکار شروع به کار کند.
  • test_settings: شامل تمام اطلاعات مهم مربوط به تست‌ها و گزینه‌های پیکربندی آنها است و به ما امکان می‌دهد محیط‌های تست را تعریف و شخصی سازی کنیم.

اجرای اولین اسکریپت در Selenium WebDriver

تست اتوماسیون را با مثالی آغاز خواهیم کرد که در آن اسکریپت آزمایشی که قرار است اجرا کنیم Nightwatch را در گوگل جستجو کرده و سپس اسناد Nightwatch JS را در وبسایت بررسی می‌کنیم.

module.exports = {
  'NW test on Google' : function (client) {
    client
      .url('http://www.google.com')
      .waitForElementVisible('body', 1000)
      .assert.title('Google')
      .assert.visible('input[type=text]')
      .setValue('input[type=text]', 'Nightwatch JS')
      .waitForElementVisible('button[name=btnG]', 1000)
      .click('button[name=btnG]')
      .pause(1000)
      .assert.containsText('ol#rso li:first-child',
        'Nightwatch.js | Node.js powered End-to-End testing framework')
      .end()
  }
}

ما آزادیم که متناسب با نیاز خود فایل پیکربندی nightwatch.json و فایل ماژول گلوبال یعنی nightwatch.globals.js را اصلاح کنیم اما باید چیزی شبیه به فایل زیر باشد.

{
  "src_folders" : ["./tests"],
  "output_folder" : "./reports",
  "globals_path" : "nightwatch.globals.js",
  "test_workers": {
    "enabled": true,
    "workers": "auto"
  },
  "selenium" : {
    "start_process" : true,
    "server_path" : "./node_modules/selenium-server-standalone-jar/jar/selenium-server-standalone-3.141.59.jar",
    "log_path" : "nw/logs",
    "host" : "127.0.0.1",
    "port" : 4444,
    "cli_args" : {
      "webdriver.chrome.driver" : "./node_modules/chromedriver/bin/chromedriver",
      "webdriver.ie.driver" : ""
    }
  },
  "test_settings" : {
    "default" : {
      "launch_url" : "http://google.com",
      "selenium_port"  : 4444,
      "selenium_host"  : "localhost",
      "silent": true,
      "screenshots" : {
        "enabled" : true,
        "path" : ""
      },
      "desiredCapabilities": {
        "browserName": "chrome",
        "javascriptEnabled": true,
        "acceptSslCerts": true
      }
    },
    "french" : {
      "launch_url" : "http://google.fr",
      "desiredCapabilities": {
        "browserName": "firefox",
        "javascriptEnabled": true,
        "acceptSslCerts": true
      }
    }
  }
}

برای اجرای پوشه tests مهم است که بخش زیر را در فایل package.json اضافه کنید.

scripts": {
    "test": "./node_modules/.bin/nightwatch -e firefox,edge,safari test"
  },

آخرین کاری که باید انجام دهیم این است که تست Nightwatch را از دایرکتوری اصلی پروژه با استفاده از دستور زیر انجام دهیم:

`npm test`

این دستور با اعتبارسنجی تست‌ها و وابستگی‌ها، مجموعه آزمایشی را اجرا می‌کند که باعث باز شدن کروم و سپس رشته جستجوی داده شده در گوگل می‌شود. در زیر تصویری از اجرای آزمایش Nightwatch آورده شده است که نتیجه جستجو در گوگل را نشان می‌دهد.

ادامه مقاله را در بخش دوم دنبال کنید.

منبع

چه امتیازی به این مقاله می دید؟
خیلی بد
بد
متوسط
خوب
عالی

دیدگاه‌ها و پرسش‌ها

برای ارسال دیدگاه لازم است، ابتدا وارد سایت شوید.

در حال دریافت نظرات از سرور، لطفا منتظر بمانید

در حال دریافت نظرات از سرور، لطفا منتظر بمانید

آفلاین
user-avatar
عرفان حشمتی @heshmati74
مهندس معماری سیستم های کامپیوتری، طراح و توسعه دهنده وب سایت
دنبال کردن

گفتگو‌ برنامه نویسان

بخشی برای حل مشکلات برنامه‌نویسی و مباحث پیرامون آن وارد شو