preface

I remember the last two years, Nightmare was really hot. So, I also integrated it in my own front-end scaffolding. However, the past so long, DO not know how the present form.

Recently, I found that the business of cross-border projects is becoming more and more complicated. Each team member is responsible for multiple projects, and they will work on A and B one time, and then they will be arranged to work on cross-border projects when they are available. As a result, a lack of concentration, coupled with a lack of understanding of the business, occasionally leads to writing bugs that affect previous logic.

This forced us to plan the automated regression test. Although the website business was cumbersome, at least we had to ensure that each modification of team members would not affect the main process.

list

First of all, I will list the E2E frameworks or libraries I researched to give you a general idea.

  1. PhantomJS is a headless WebKit scriptable with JavaScript. A webKit-based headless browser with no UI. Add: it’s just a browser, but the internal clicking, page-turning, and other human-related operations require programming.
  1. NightmareJSEnglish explanation: A high-level browser automation library. Under the covers it uses Electron, which is similar to PhantomJS but roughly twice as fast and more modern.

    A lightweight browser automation test library. Based on Electron, similar to PhantomJS, but about twice as fast and more modern.

    Bonus: Its interface is much friendlier than PhantomJS, making development much more efficient:

    And it also comes with chrome pluginsdaydreamIt records what you do on the page and generates the corresponding code. This is one of the important reasons why I chose it.

    But, for nowNightmareJSThe core code update was over a year ago, and daydream’s plugin installation page is 404. Discard decisively.

  1. PuppeteerEnglish explanation: Puppeteer is a Node library which provides a high-level API to control Chrome or Chromium over the DevTools Protocol. Puppeteer runs headless by default, but can be configured to run full (non-headless) Chrome or Chromium.

    Puppeteer is a software provider built on the DevTools protocol (devtools-protocol), controls the high-level API node libraries for Chrome or Chromium. Puppeteer runs without an interface by default, but can be configured to run Chrome or Chromium.

    Added: It is maintained by Chrome DevTools, andNightmareJSAlso available is the Chrome plugin – which automatically generates codepuppeteer-recorder. So it’s completely replaceableNightmareJSOr is itNightmareJSIt’s cold.

    Puppeteer also pointspuppeteerandpuppeteer-core, please refer to the differencepuppeteer-vs-puppeteer-core.

    In conclusion, if there is no requirement for individual browser compatibility testing, I think it is the best e2E automated testing library.

  1. Selenium- WebDriver Selenium is a browser automation library. Most often used for testing web-applications, Selenium may be used for any task that requires automating interaction with the browser. Selenium is a browser automation testing library. Mostly used to test Web applications, Selenium can be used to do any task that requires interaction with a browser. Supplement: the bottom layer is based on WebDriver implementation, so, you can automatically test all kinds of browsers, as long as the corresponding browser to achieve the WebDriver function (modern browser, IE is cool) can use it to automatically tune up and test. The Lancher /driver that starts the browser has been inherited into Selenium-WebDriver:
const webdriver = require('selenium-webdriver');
const chrome = require('selenium-webdriver/chrome');
const firefox = require('selenium-webdriver/firefox');
 
let driver = new webdriver.Builder()
    .forBrowser('firefox')
    .setChromeOptions(/ *... * /)
    .setFirefoxOptions(/ *... * /)
    .build();
Copy the code
  1. Nightwatch 英文解释 : end-to-end testing framework written in node.js and using the Webdriver API. Node.js invokes the end-to-end (E2E) testing framework implemented by the Webdriver API. Note that it is a framework and not a library. The libraries mentioned above often have to be combined with other libraries, such as Mocha, Chai, etc., and then combined with a lot of work to achieve the full testing functionality. The framework doesn’t mean that you don’t need to install any extra libraries or plug-ins, but the basics are already integrated into the framework, and it can greatly reduce your fidgeting time. As with Selenium, it is also based on webDriver implementation, so you can also automate testing of various browsers. Just install laucher/driver for each browser:
Geckodriver (Firefox):
Geckodriver is the WebDriver service used to drive the Mozilla Firefox Browser.
$ npm install geckodriver --save-dev
Chromedriver:
Chromedriver is the WebDriver service used to drive the Google Chrome Browser.
$ npm install chromedriver --save-dev
Copy the code
  1. Protractor E2E Test Framework for Angular Apps. E2e testing framework for Angular applications.

classification

When it comes to comparison, you have to categorize first and figure out the dimensions of service first.

  1. The Webdriver classes;
  2. Webdriver classes;

Non-webdriver can correspond to a single test browser;

The Webdriver class, as mentioned earlier, is not limited to a particular browser, as long as you want to test the browser has Webdriver capabilities can run automation.

contrast

The Protractor is too Angular specific to include a comparison:

The name of the Interface is easy to use The framework cross-browser Automatically generate code plug-ins The community is active
PhantomJS yes
NightmareJS yes yes
Puppeteer yes yes yes
Selenium yes yes yes
Nightwatch yes yes yes yes

So, the conclusion of comparison is:

  • If you need to cross browsers, I prefer Nightwatch;
  • If not required, Puppeteer is preferred.

The side road

In the process of research, I also found an interesting E2E testing framework — Cypress.

Its advantages:

  1. cool

    After starting it, it will have a visual interface for users to operate, and the operation process and results are reflected in the Web page, the whole test process high-end atmosphere grade.

  2. Convenient because it is a framework, so the basic things are integrated processing:

Its disadvantages:

  1. Don’t Cross Browsers When I see Unsupported-Browsers on it documents, I feel unscented;

  2. As we have seen before, non-WebDriver, while not cross-browser, is a convenient plug-in that provides auto-generated code. So, I don’t think it’s cool anymore, all that fancy stuff.

conclusion

Two important words:

  • If you need to cross browsers, I prefer Nightwatch;
  • If not required, Puppeteer is preferred.

The resources

Chromium

Comparison of browser engines

electronjs.org

The original

From CodeLittlePrince/blog/issues / 23