Cypress raporty z mochawesome reporter

Cypress raporty z mochawesome reporter – to wpis pokazujący w jaki sposób w kilku krótkich krokach spowodować aby generować raporty z wykorzystaniem tej biblioteki. Jeżeli jesteś zainteresowany innymi wpisami dotyczącymi Cypressa, zapraszamy do odpowiedniego działu.

Wprowadzenie

Tworząc testy automatyczne z wykorzystaniem Cypressa może się zdarzyć, że lub ludzie z biznesu zapragną mieć ładne raporty, które będą wizualizować im wyniki z naszych testów. Mochawesome-reporter to niestandardowy reporter, który generuje samodzielny raport z wykorzystaniem HTML/CSS, aby pomóc w wizualizacji przebiegów testów. Raport ten ma prosty, czysty i nowoczesny design. Raport zawiera również filtry do wyświetlania tylko żądanych testów. Możemy też wyfiltrować np. tylko testy które zakończyły się niepowodzeniem.

Instalacja

Są dwa rodzaje instalacji tego elementu – przez npm lub yarn.

npm i --save-dev cypress-mochawesome-reporter

lub

yarn add -D cypress-mochawesome-reporter

Drugim krokiem jest dodanie w pliku cypress/support/index.js

import 'cypress-mochawesome-reporter/register';

Kolejnym krokiem jest dodanie wpisu w pliku cypress/plugins/index.js

module.exports = (on, config) => {
  require('cypress-mochawesome-reporter/plugin')(on);
};

Jeżeli chcemy otrzymywać ładne raporty należy iść do pliku cypress.json i dodać:

{
  "reporter": "cypress-mochawesome-reporter",
  "reporterOptions": {
    "reportDir": "cypress/report",
    "charts": true,
    "reportPageTitle": "Nasz-tytul"
  }
}

Uruchomienie

Zgodnie z dobrymi praktykami – aby uzyskać raport, musimy uruchomić test z poziomu terminala (linii poleceń).

npx cypress run --spec "cypress/integration/NaszTest.js" --browser chrome

Po wykonaniu takiego polecenia – zostanie wykonany test ze wskazanego pliku a następnie wygenerowany raport – w miejscu gdzie wskażemy w pliku cypress.json (w reportDir).

Dodatkowe opcje

name	type	default	description
embeddedScreenshots	boolean	false	Embedded external screenshots into HTML using base64, use with inlineAssets option to produce a single HTML file
quiet	boolean	false	Silence console messages
saveAllAttempts	boolean	true	Save screenshots of all test attempts, set to false to save only the last attempt
debug	boolean	false	Creates log file with debug data

Podsumowanie

Cypress raporty z mochawesome reporter – to kolejny wpis mający zachęcić Was do instalacji i sprawdzenia narzędzia. Z racji popularyzacji narzędzia i dużego wsparcia które otrzymał Cypress na rozwój, będziemy poszerzać wpisy na ten temat. Wszelkie artykuły związane z Cypress IO znajdziecie w dedykowanym dziale.