Το Cypress Assertion μας βοηθά να διεκδικήσουμε έναν συγκεκριμένο ισχυρισμό Οι ισχυρισμοί είναι βήματα επικύρωσης που διασφαλίζουν εάν το αναμενόμενο αποτέλεσμα είναι ίσο με το πραγματικό αποτέλεσμα. Στον αυτοματισμό δοκιμής, διεκδικούμε μια δήλωση για να επαληθεύσουμε ότι η δοκιμή παράγει το αναμενόμενο αποτέλεσμα. Εάν ο ισχυρισμός αποτύχει, τότε η δοκιμαστική περίπτωση αποτυγχάνει διασφαλίζοντας ότι υπάρχει σφάλμα. Σε αυτό το άρθρο, θα συζητήσουμε για Cypress Assertion με υλοποίηση Handson και παραδείγματα.

Πίνακας Περιεχομένων

• Τι είναι το Cypress Assertion;
• Cypress Assert Text
• Κυπαρίσσι Κοινό Ισχυρισμό
• Cypress Retry Assertion
• Παραδείγματα ισχυρισμού κυπαρισσιού
• Σιωπηρός ισχυρισμός στο Κυπαρίσσι
• Ρητός ισχυρισμός στο Κυπαρίσσι
• Αρνητικός ισχυρισμός κυπαρισσιού
• Μήνυμα προσαρμοσμένης δήλωσης Cypress
• Βέλτιστες πρακτικές Cypress Assertion

Τι είναι το Cypress Assertion;

Το Cypress χρησιμοποιεί και αναδιπλώνει τη βιβλιοθήκη βεβαιώσεων Chai και επεκτάσεις όπως το Sinon και το JQuery. Το Cypress περιμένει αυτόματα και προσπαθεί ξανά μέχρι να επιλυθεί ο ισχυρισμός. Οι ισχυρισμοί μπορούν να χρησιμοποιηθούν για να περιγράψουν πώς θα πρέπει να μοιάζει η εφαρμογή. Μπορούμε να χρησιμοποιήσουμε τους ισχυρισμούς Cypress με συνδυασμό αναμονής, να προσπαθήσουμε ξανά, να αποκλείσουμε μέχρι να φτάσει στην επιθυμητή κατάσταση.

Cypress Assert Text

Σε γενικές γραμμές στα αγγλικά, θα περιγράφαμε έναν ισχυρισμό κάπως σαν, Θα περίμενα το κουμπί να έχει κείμενο σύνδεσης. Ο ίδιος ισχυρισμός μπορεί να γραφτεί στο Κυπαρίσσι ως

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

Ο παραπάνω ισχυρισμός θα περάσει εάν το κουμπί έχει την τιμή «login».

Κυπαρίσσι Κοινοί ισχυρισμοί

Υπάρχει ένα σύνολο κοινών ισχυρισμών Cypress που χρησιμοποιούμε στις δοκιμαστικές μας περιπτώσεις. Θα τα χρησιμοποιήσουμε με .should() . Ας δούμε την περίπτωση χρήσης και τα παραδείγματα.

Μερικοί από τους κοινούς ισχυρισμούς Κυπαρισσιών παρατίθενται παρακάτω

1. Μήκος
2. αξία
3. Πλαίσιο κειμένου
4. Τάξη
5. Υπαρξη
6. CSS
7. Ορατότητα
8. Κατάσταση
9. Ιδιότητα με ειδικές ανάγκες

Δήλωση μήκους κυπαρισσιού

length() θα ελέγξει αν το συγκεκριμένο στοιχείο έχει μήκος

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

Δήλωση Αξίας Κυπαρισσιού

Η τιμή Cypress θα επιβεβαιώσει εάν το συγκεκριμένο στοιχείο έχει την αναμενόμενη τιμή

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

Cypress Text Context Assertation

Το πλαίσιο κειμένου θα επιβεβαιώσει εάν το στοιχείο έχει το συγκεκριμένο κείμενο

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

Κυπαρίσσι Class Assertion

Βεβαιώνει εάν η κλάση είναι παρούσα ή το συγκεκριμένο στοιχείο πρέπει να έχει την κλάση

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

Διαβεβαίωση ύπαρξης κυπαρισσιού

Η εντολή ύπαρξης ελέγχει εάν το συγκεκριμένο στοιχείο υπάρχει ή υπάρχει στο DOM ή όχι

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

Cypress CSS Assertion

Το CSS Assertion ελέγχει εάν τα συγκεκριμένα στοιχεία έχουν μια συγκεκριμένη ιδιότητα

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

Δήλωση ορατότητας κυπαρισσιού

Το Cypress Visibility Assertion βεβαιώνει εάν το στοιχείο DOM είναι ορατό στη διεπαφή χρήστη

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

Κυπαρισσιωτός κρατικός ισχυρισμός

Επιβεβαιώνει την κατάσταση του στοιχείου DOM

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

Δήλωση ιδιοκτησίας για άτομα με ειδικές ανάγκες Cypress

Ο ισχυρισμός ιδιότητας Cypress Disabled βεβαιώνει εάν το στοιχείο είναι απενεργοποιημένο

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

Cypress Retry Assertion

Μια μεμονωμένη εντολή που ακολουθείται από έναν ισχυρισμό θα εκτελεστεί με τη σειρά. Αρχικά, η εντολή εκτελείται και στη συνέχεια θα εκτελεστεί ο ισχυρισμός. Μια μεμονωμένη εντολή ακολουθούμενη από πολλαπλούς ισχυρισμούς θα εκτελεστεί επίσης με τη σειρά - πρώτος και δεύτερος ισχυρισμός αντίστοιχα. Έτσι, όταν περάσει ο πρώτος ισχυρισμός, ο πρώτος και ο δεύτερος ισχυρισμός θα εκτελεστούν ξανά μαζί με τις εντολές.

Για παράδειγμα, η παρακάτω εντολή περιέχει και τα δύο .should() και .and() εντολές διεκδίκησης, όπου .and() είναι αλλιώς γνωστή ως .should()

cy.get('.todo-list li') // command .should('have.length', 2) // assertion .and(($li) => { // 2 ακόμη ισχυρισμοί αναμένονται($li.get (0).textContent, 'πρώτο στοιχείο').to.equal('todo A') expect($li.get(1).textContent, 'second item').to.equal('todo B') })

Παραδείγματα ισχυρισμού κυπαρισσιού

Σε αυτή την ενότητα, θα συζητήσουμε για τους διαφορετικούς τύπους ισχυρισμών στο Cypress όπως π.χ

• Σιωπηρός ισχυρισμός
• Ρητός ισχυρισμός

Θα εξετάσουμε λεπτομερώς και τους δύο τύπους με παραδείγματα

Σιωπηρός ισχυρισμός στο Κυπαρίσσι

Σε σιωπηρή διαβεβαίωση, χρησιμοποιούμε .should() or .and() εντολές. Αυτές οι εντολές διεκδίκησης ισχύουν για το τρέχον θέμα στην αλυσίδα των εντολών. Εξαρτώνται από το προηγουμένως αποδοθέν θέμα.

Θα εξετάσουμε ένα παράδειγμα για τον τρόπο χρήσης .should() or .and() εντολές

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

Με .and() που είναι ψευδώνυμο του .should() , μπορούμε να αλυσιδώσουμε πολλαπλούς ισχυρισμούς. Αυτές οι εντολές είναι πιο ευανάγνωστες.

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

Το παραπάνω παράδειγμα συνδέεται με .should() δηλώνοντας ότι θα πρέπει να έχει την κλάση «active», ακολουθούμενη από .and() εκτελείται με την ίδια εντολή. Αυτό είναι πολύ χρήσιμο όταν θέλουμε να διεκδικήσουμε πολλές εντολές.

Ρητός ισχυρισμός στο Κυπαρίσσι

Η μετάβαση ρητού θέματος στους ισχυρισμούς εμπίπτει στον ρητό τύπο ισχυρισμού Κυπαρισσιού. Εδώ, θα χρησιμοποιήσουμε expect και assert εντολές ως ισχυρισμός. Οι ρητές ισχυρισμοί χρησιμοποιούνται όταν θέλουμε να χρησιμοποιήσουμε πολλαπλούς ισχυρισμούς για το ίδιο θέμα. Χρησιμοποιούμε επίσης ρητή δήλωση στο Κυπαρίσσι όταν θέλουμε να κάνουμε έθιμο λογική πριν κάνετε τον ισχυρισμό.

Θα εξετάσουμε το παράδειγμα για το ρητό Κυπαρίσσι ισχυρισμός

expect(true).to.be.true //ελέγχει για ένα boolean expect(object).to.equal(object)

Αρνητικός ισχυρισμός κυπαρισσιού

Παρόμοια με τους θετικούς ισχυρισμούς, υπάρχουν αρνητικοί ισχυρισμοί στο Cypress. Θα χρησιμοποιήσουμε τη λέξη-κλειδί «μη» που προστέθηκε στο πρόθεμα της δήλωσης ισχυρισμού. Ας δούμε ένα παράδειγμα αρνητικού ισχυρισμού

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

Ο αρνητικός ισχυρισμός συνιστάται μόνο σε περιπτώσεις για την επαλήθευση ότι μια συγκεκριμένη συνθήκη δεν είναι πλέον διαθέσιμη μετά την εκτέλεση μιας συγκεκριμένης ενέργειας από την εφαρμογή.

Για παράδειγμα, ας θεωρήσουμε ότι έχει ελεγχθεί μια εναλλαγή και ας επαληθεύσουμε ότι έχει αφαιρεθεί

// στην αρχή το στοιχείο επισημαίνεται ως ολοκληρωμένο cy.contains('li.todo', 'Write tests') .should('have.class', 'completed') .find('.toggle') .click() / / η κλάση CSS έχει αφαιρεθεί cy.contains('li.todo', 'Write tests').should('not.have.class', 'completed')

Μήνυμα προσαρμοσμένης δήλωσης Cypress

Με το Cypress, μπορούμε να παρέχουμε πρόσθετες πληροφορίες ή προσαρμοσμένο μήνυμα για ισχυρισμούς χρησιμοποιώντας μια βιβλιοθήκη αντιστοιχιστών. Το Matchs αποτελείται από μικρές συναρτήσεις που διαφοροποιούν τις τιμές και θα στείλουν λεπτομερές μήνυμα σφάλματος. Chai Η βιβλιοθήκη βεβαιώσεων θα βοηθήσει τον κώδικά μας να φαίνεται πιο ευανάγνωστος και η αποτυχία δοκιμής πολύ χρήσιμη

const expect = require('chai').expect it('ελέγχει έναν αριθμό', () => {const value = 10 const αναμενόμενη = 3 expect(value).to.equal(expected) })

Βέλτιστες πρακτικές Cypress Assertion

Μπορούμε να γράψουμε πολλαπλούς ισχυρισμούς σε ένα μόνο μπλοκ χρησιμοποιώντας μια αλυσίδα εντολών. Δεν είναι απαραίτητο να γράψετε μεμονωμένο ισχυρισμό όπως σε μοναδιαίες δοκιμές. Πολλοί γράφουν ισχυρισμούς όπως παρακάτω. Είναι εντάξει να γράφεις με αυτόν τον τρόπο, αλλά αυξάνει τη γραμμή κώδικα και τον πλεονασμό.

describe('my form', () => { before(() => {cy.visit('/users/new') cy.get('#first').type('ashok') }) it( 'has validation χαρακτηριστικό', () => { cy.get('#first').should('have.attr', 'data-validation', 'required') // επιβεβαιώνοντας εάν το #first έχει υποχρεωτικό πεδίο } ) it('has active class', () => { cy.get('#first').should('have.class', 'active') // επιβεβαιώνοντας εάν το #first έχει ενεργή κλάση }) it( 'has formatted first name', () => { cy.get('#first').should('have.value', 'Ashok') // επιβεβαιώνοντας εάν το #first έχει κεφαλαία το πρώτο γράμμα }) })

Όπως βλέπετε παραπάνω, ο ίδιος τύπος επιλογέα και ισχυρισμού επαναλαμβάνεται. Αντίθετα, μπορούμε να αλυσοδύνουμε αυτές τις εντολές σε μία μόνο δήλωση που εκτελεί όλους τους ελέγχους με γραμμικό τρόπο.

describe('my form', () => { before(() => { cy.visit('/users/new') }) it('validates and formats first name', () => { cy.get ('#first') .type('ashok') .should('have.attr', 'data-validation', 'required') .and('have.class', 'active') .and('have .value', 'Ashok') }) })

Όπως αναφέρθηκε παραπάνω, μπορούμε να αλυσοδένουμε τον μονό επιλογέα με πολλαπλούς ισχυρισμούς! Αυτή είναι μια από τις συνιστώμενες βέλτιστες πρακτικές συγγραφής ισχυρισμών στο Cypress.

Για να κατανοήσετε το μοντέλο αντικειμένου σελίδας στο Cypress, κάντε κλικ εδώ.