Thread by @Xotabu4

Sup
Cant concentrate on codding, so starting twitter thread with JS testing tools that i recommend. Mostly e2e/ui and API stuff

First - test runners.

#MochaJS if you don't know what runner to take. Has almost everything you need for UI and API tests. And recently parallelization out of the box was added! But also has hundreds of different reporters and plugins
mochajs.org

But #MochaJS does not have mocking/asserting features included. No worries, this is easy to add. For asserting - i recommend #ChaiJS. Choose one of 3 styles - assert(), expect(), or .should() - whatever you like more.
chaijs.com

For mocking (when you writing unit tests). Try #SinonJS sinonjs.org

But there are a lot of alternatives as well.

Actually if you are planning to write lower-level tests, you might better consider to take @fbjest - jestjs.io/docs/en/mock-f…
It has rich built-in assertions, parallelization and mocking.

Let's move on.
Other test runner to look at:
github.com/cucumber/cucum…
Unfortunately JS version has pretty poor documentation, and very unusual API comparing to other test runners. But human-readable tests attracts people a lot.

Alternative to #cucumberjs can be #gauge - gauge.org

Instead of writing Gherkin syntax, with gauge you can write regular markdown. Also has very tight integration with browser controlling lib - taiko.dev

But regular gherkin is more widely used.

If gherkin style is not for you, and want something more futuristic than mocha: github.com/avajs/ava

Killer feature - massive parallelization not only by files(usual for tests in js), but by separate tests inside one file as well. But be aware of his reporter API!

New runner (i didn't tried yet) - github.com/lukeed/uvu

It promises very small resources overhead for running your unit tests. This might be important if you run unit tests. But this speed will not be noticeable because of general slowness of e2e tests.

There are so many other test runners exist. Everyone can try to built something. Even i experimenting with some new ways of tests parallelization and declaration. But lets move on to browser controlling tools

First group: Webdriver protocol based.
My favorite one, of course @webdriverio
Awesome sync mode which makes switching from other languages much easier. Good TS support. A lot of points to extend every aspect. Rich ecosystem around. Familiar API.

If you are starting with @webdriverio keep in mind couple of specific things about it:
1) How to deal with 3rd party async code (webdriver.io/docs/api/brows…)

2) How you need to define and initialize pageobjects - github.com/webdriverio/we…

3) Read blog - webdriver.io/blog/ It has so many important articles! For example how to switch from webdriver protocol to devtools and all migration aspects from v4 -> v5 -> v6

Next framework, which is still popular:
@ProtractorTest - protractortest.org
Has good implementation of LazyElements pattern, even for collections of elements. Still has a lot of tools around. Community is huge. But updates comes rarely.

@davert wrote a nice explanantion article explaining whats the current state of protractor - dev.to/davert/5-reaso…

Definitely must-read if you planning to start project with protractor in 2020

And fresh encouraging news about protractor:
2 new contributors noticed in commits history
github.com/kyliau
and
github.com/alan-agius4
both from angular team. Fresh release v7 was made (dependencies versions bumps) - github.com/angular/protra…

Is this a reborn?

So only thing is left is:@angular someone has news about what is @ProtractorTest state now, thats will be super-cool. I can share these news in our t.me/js_for_testing community

Another webdriver-based tool to consider is npmjs.com/package/seleni…

It is not so widely known as webdriverio or protractor, but has very rich API with assertions, lazy-elements and automatic waits, and can be combined with almost every test runner.
Inspired by java @jselenide

Another all-in-one framework - codecept.io . Has awesome high-level api with very rich set of configurations and good extendability. Notice that is supports various frameworks as engine under the hood, even devtools based!

And recently @CodeceptJS added support for Playwright codecept.io/helpers/Playwr…

By default it is wraps mochajs, but can be used with cucumberjs as well.

Now non-webdriver based tools.

@Cypress_io is a king in this kind. Super-rich set of possibilities to control almost every aspect of your application. Easy to start, hard to break up. Stunning visualization of your tests execution, with time-travel (no Delorean needed)

My opinion - @Cypress_io i perfect for something like Component UI testing - where you cover each component in isolation, and can mock everything around. You don't really care about crossbrowser here, and synthetic generated events are fine.

@Cypress_io has pretty complex architecture under the hood, and with a great power comes great responsibility:
docs.cypress.io/guides/referen…

Must-read before choosing between cypress and webdriver.

And also cypress has some tweaks in API to look like synchronous (reminds me time, when webdriverjs had Promise control flow built in). @dmtrKovalenko wrote a nice twitter thread (RU):

https://twitter.com/jsunderhood/status/1248298052164730892

And since my arms are grow from the ass, i destroyed order of tweets, and it all mixed up. Tweets order is supplied by twitter ranking algorithm

Here is unrollled thread with correct tweets order - threadreaderapp.com/thread/1289109…

Another non-webdriver based tool is @DXTestCafe devexpress.github.io/testcafe/
Uses proxy to intercept requests and inject code into pages.

Supports cross-browser, and some other sweet things.

Unfortunately i haven't used it in real projects, and community is small (no one knows why)

Devtools protocol based tools!

A lot of people are predicting that they will eventually replace webdriver-protocol based tools.

I personally think that this is possible, since devtools protocol has much wider API, and bi-directional

Puppeteer!
github.com/puppeteer/pupp…
Huge API! Just take a look at possibilities that webdriver cant even dream about:
- request intercepting
- events listening
And much more: pptr.dev

And it is blazing fast, commands are executed much faster than webdriver

Puppeteer can be installed with own bundled chromium, or without (check pptr.dev/#?product=Pupp…)
I used it a lot for some scrapping/page manipulating stuff in browser. Once i created bot that completed tests for me!

Puppeteer got firefox support - github.com/puppeteer/pupp…

But anyway keep in mind, puppeteer is not a testing tool, you need to choose test runner, integrate it with puppeteer, think about reporting, and so on. You can try codecept+puppeteer instead codecept.io/helpers/Puppet…

Close to puppeteer - Playwright: playwright.dev
It has similar API, but has different approach in supporting browsers. @brekelov wrote a nice article with comparing puppeteer vs playwright - habr.com/ru/company/jug…

Lets finish this thread. There are spreadsheet created by js automation community and for community:
docs.google.com/spreadsheets/d…

It is not perfect, and your comments and ideas are welcome, but at least some place to start.

Next time will have a thread about tests infrastructure!