Cypress Assertion: 9 Fakten, die Sie kennen sollten

Cypress Assertion hilft uns, ein bestimmtes zu behaupten. Assertions sind Validierungsschritte, die sicherstellen, dass das erwartete Ergebnis dem tatsächlichen Ergebnis entspricht. Bei der Testautomatisierung bestätigen wir eine Aussage, um zu verifizieren, dass der Test das erwartete Ergebnis generiert. Wenn die Assertion fehlschlägt, schlägt der Testfall fehl, um sicherzustellen, dass ein Fehler vorliegt. In diesem Artikel werden wir darüber diskutieren Cypress Assertion mit Handson-Implementierung und Beispielen.

Inhaltsverzeichnis

Zypresse-Behauptung

Was ist Cypress Assertion?

Cypress verwendet und verpackt die Chai-Assertion-Bibliothek und Erweiterungen wie Sinon und JQuery. Cypress wartet automatisch und versucht es erneut, bis die Assertion aufgelöst ist. Assertions können verwendet werden, um zu beschreiben, wie die Anwendung aussehen soll. Wir können Cypress-Assertions mit einer Kombination aus Waits, Retry, Block verwenden, bis der gewünschte Zustand erreicht ist.

Cypress Assert-Text

Im allgemeinen Englisch würden wir eine Behauptung in etwa beschreiben wie: Ich würde erwarten, dass der Button einen Login-Text hat. Die gleiche Behauptung kann in Cypress geschrieben werden als

cy.get('button').should('have.value', 'login')

Die obige Behauptung wird bestanden, wenn die Schaltfläche den Wert 'Login' hat.

Allgemeine Behauptungen der Zypresse

Es gibt eine Reihe gängiger Cypress-Behauptungen, die wir in unseren Testfällen verwenden. Wir werden sie mit verwenden .should() . Schauen wir uns den Anwendungsfall und die Beispiele an.

Einige der häufigsten Zypressen-Behauptungen sind unten aufgeführt

  1. Länge
  2. Wert
  3. Textkontext
  4. Klasse
  5. Existenz
  6. CSS
  7. Sichtbarkeit
  8. Bundesstaat
  9. Behindertengerechtes Eigentum

Behauptung der Zypressenlänge

length() prüft, ob das jeweilige Element eine Länge hat

cy.get('dropdown').should('have.length', 5)

Wertbehauptung von Cypress

Der Cypress-Wert wird bestätigt, wenn das bestimmte Element den erwarteten Wert hat

cy.get('textfield').should('have.value', 'first name')

Cypress-Textkontext-Assertion

Der Textkontext wird bestätigt, wenn das Element den bestimmten Text enthält

cy.get('#user-name').should('have.text', 'John Doe')

Behauptung der Cypress-Klasse

Gibt an, ob die Klasse vorhanden ist oder das bestimmte Element die Klasse haben soll

cy.get('form').find('input').should('have.class', 'disabled')

Existenzbehauptung von Zypresse

Der Existenzbefehl prüft, ob das jeweilige Element vorhanden ist oder im DOM existiert oder nicht

cy.get('#button').should('exist')

Cypress CSS-Assertion

CSS Assertion prüft, ob das jeweilige Element eine bestimmte Eigenschaft hat

cy.get('.completed').should('have.css', 'text-decoration', 'line-through')

Sichtbarkeitsbehauptung von Cypress

Die Cypress Visibility Assertion bestätigt, ob das DOM-Element in der Benutzeroberfläche sichtbar ist

cy.get('#form-submit').should('be.visible')

Behauptung des Staates Cypress

Bestätigt den Zustand des DOM-Elements

cy.get(':radio').should('be.checked')

Cypress-Behauptung für behinderte Eigentumsrechte

Die Cypress Disabled-Eigenschaftszusicherung bestätigt, ob das Element deaktiviert ist

cy.get('#example-input').should('be.disabled')

Cypress-Wiederholungs-Behauptung

Ein einzelner Befehl gefolgt von einer Assertion wird der Reihe nach ausgeführt. Zunächst wird der Befehl ausgeführt und dann wird die Assertion ausgeführt. Ein einzelner Befehl, gefolgt von mehreren Assertionen, wird ebenfalls der Reihe nach ausgeführt – erste bzw. zweite Assertion. Wenn also die erste Assertion erfolgreich ist, werden die erste und die zweite Assertion zusammen mit den Befehlen erneut ausgeführt.

Der folgende Befehl enthält beispielsweise beides .should() und .and() Assertion-Befehle, wobei .and() ist auch bekannt als .should()

cy.get('.todo-list li') // Befehl .should('have.length', 2) // Behauptung .and(($li) => { // 2 weitere Behauptungen erwartet($li.get (0)

Beispiele für Cypress-Assertionen

In diesem Abschnitt werden wir die verschiedenen Arten von Behauptungen in Cypress diskutieren, wie z

  • Implizite Behauptung
  • Explizite Behauptung

Wir werden uns die beiden Typen mit Beispielen im Detail ansehen

Implizite Behauptung in Zypresse

In impliziter Behauptung verwenden wir .should() or .and() Befehle. Diese Assertionsbefehle gelten für das aktuell zurückgegebene Subjekt in der Befehlskette. Sie sind abhängig vom zuvor gelieferten Thema.

Wir werden uns ein Beispiel zur Verwendung ansehen .should() or .and() Befehle

cy.get('button').should('have.class', 'enabled')

Mit der .and() was ist ein Alias ​​von .should() , können wir mehrere Behauptungen verketten. Diese Befehle sind besser lesbar.

cy.get('#title') .should('have.class', 'active') .and('have.attr', 'href', '/post')

Das obige Beispiel ist verkettet mit .should() Es sollte die Klasse "aktiv" haben, gefolgt von .and() wird gegen den gleichen Befehl ausgeführt. Dies ist sehr hilfreich, wenn wir mehrere Befehle bestätigen möchten.

Explizite Behauptung in Zypresse

Das Übergeben eines expliziten Subjekts in den Assertionen fällt unter den expliziten Typ der Cypress-Assertion. Hier verwenden wir expect und assert Befehle als Behauptung. Explizite Zusicherungen werden verwendet, wenn wir mehrere Zusicherungen für dasselbe Thema verwenden möchten. Wir verwenden auch die explizite Zusicherung in Cypress, wenn wir benutzerdefinierte machen wollen Logik vor der Behauptung.

Wir werden in die schauen Beispiel für explizite Cypress Behauptung

Expect(true).to.be.true //Prüft auf einen booleschen Wert. Expect(object).to.equal(object)

Negative Zypressen-Behauptung

Ähnlich wie positive Behauptungen gibt es in Cypress negative Behauptungen. Wir verwenden das Schlüsselwort „not“, das dem Präfix der Assertionsanweisung hinzugefügt wird. Sehen wir uns ein Beispiel für eine negative Behauptung an

cy.get('#loading').should('not.be.visible')

Eine negative Behauptung wird nur in Fällen empfohlen, um zu überprüfen, ob eine bestimmte Bedingung nicht mehr verfügbar ist, nachdem eine bestimmte Aktion von der Anwendung ausgeführt wurde.

Nehmen wir zum Beispiel an, dass ein Umschalter aktiviert ist und überprüfen Sie, ob er entfernt wurde

// zuerst wird das Item als abgeschlossen markiert cy.contains('li.todo', 'Write tests') .should('have.class', 'completed') .find('.toggle') .click() / / die CSS-Klasse wurde entfernt cy.contains('li.todo', 'Write tests').should('not.have.class', 'completed')

Benutzerdefinierte Cypress-Assertion-Nachricht

Mit Cypress können wir zusätzliche Informationen oder benutzerdefinierte Nachrichten für Assertionen bereitstellen, indem wir eine Bibliothek von Matchern verwenden. Matchers besteht aus kleinen Funktionen, die Werte unterscheiden und detaillierte Fehlermeldungen ausgeben. Chai Assertion-Bibliothek wird dazu beitragen, dass unser Code lesbarer aussieht und Testfehler sehr nützlich sind

const Expect = require('chai').expect it('überprüft eine Zahl', () => { const value = 10 const erwartet = 3 Expect(value).to.equal(expected) })
cyyy
Cypress Custom Fehlermeldung

Best Practices für die Behauptung von Cypress

Wir können mehrere Assertionen in einem einzigen Block schreiben, indem wir eine Befehlskette verwenden. Es ist nicht notwendig, eine einzelne Assertion wie bei Unit-Tests zu schreiben. Viele schreiben Behauptungen wie unten. Es ist in Ordnung, auf diese Weise zu schreiben, aber es erhöht die Codezeile und die Redundanz.

description('my form', () => { before(() => { cy.visit('/users/new') cy.get('#first').type('ashok') }) it( 'hat Validierungsattribut', () => { cy.get('#first').should('have.attr', 'data-validation', 'required') // bestätigt, ob #first ein Pflichtfeld hat } ) it('hat aktive Klasse', () => { cy.get('#first').should('have.class', 'active') // bestätigen, ob #first eine aktive Klasse hat }) it( 'hat formatierten Vornamen', () => { cy.get('#first').should('have.value', 'Ashok') // bestätigen, ob #first einen großgeschriebenen Anfangsbuchstaben hat }) })

Wie Sie oben sehen, wird derselbe Selektor- und Assertionstyp wiederholt. Stattdessen können wir diese Befehle in einer einzigen Assertion verketten, die alle Prüfungen auf lineare Weise durchführt.

description('my form', () => { before(() => { cy.visit('/users/new') }) it('validiert und formatiert den Vornamen', () => { cy.get ('#first') .type('ashok') .should('have.attr', 'data-validation', 'required') .and('have.class', 'active') .and('have .value', 'Ashok') }) })

Wie oben erwähnt, können wir den einzelnen Selektor mit mehreren Assertionen verketten! Dies ist eine der empfohlenen Best Practices zum Schreiben von Assertionen in Cypress.

Um mehr über das Seitenobjektmodell in Cypress zu erfahren, klicken Sie auf hier.