Cypřišové tvrzení: 9 faktů, které byste měli vědět

by

Cypress Assertion nám pomáhá tvrdit konkrétní Tvrzení jsou ověřovací kroky, které zajišťují, zda se očekávaný výsledek rovná skutečnému výsledku. V automatizaci testování uplatňujeme prohlášení, abychom ověřili, že test generuje očekávaný výsledek. Pokud aserce selže, testovací případ selže a zajistí, že existuje chyba. V tomto článku budeme diskutovat o Cypřišové tvrzení s Handsonovou implementací a příklady.

Obsah

Cypřišové tvrzení

Co je Cypress Assertion?

Cypress používá a obaluje knihovnu asercí Chai a rozšíření jako Sinon a JQuery. Cypress automaticky čeká a zkusí to znovu, dokud se tvrzení nevyřeší. Tvrzení lze použít k popisu toho, jak by aplikace měla vypadat. Můžeme použít Cypress aserce s kombinací čekání, opakování, blokování, dokud nedosáhne požadovaného stavu.

Cypress Assert Text

V obecné angličtině bychom tvrzení popsali něco jako, Očekával bych, že tlačítko bude mít přihlašovací text. V Cypressu lze napsat stejné tvrzení jako

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

Výše uvedené tvrzení projde, pokud má tlačítko hodnotu 'přihlášení'.

Společná tvrzení cypřiše

V našich testovacích případech používáme sadu běžných tvrzení Cypress. Budeme je používat s .should() . Podívejme se na případ použití a příklady.

Některá z běžných cypřišových tvrzení jsou uvedena níže

  1. Délka
  2. Hodnota
  3. Textový kontext
  4. Třída
  5. existence
  6. CSS
  7. Viditelnost
  8. Stát
  9. Deaktivovaná vlastnost

Tvrzení délky cypřiše

length() zkontroluje, zda má konkrétní prvek délku

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

Cypress Value Assertion

Hodnota Cypress se uplatní, pokud má konkrétní prvek očekávanou hodnotu

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

Cypřiš text kontext tvrzení

Textový kontext se uplatní, pokud má prvek konkrétní text

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

Tvrzení cypřišové třídy

Určuje, zda je třída přítomna, nebo má mít konkrétní prvek třídu

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

Tvrzení o existenci cypřiše

Příkaz Existence kontroluje, zda je konkrétní prvek přítomen nebo existuje v DOM či nikoli

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

Cypress CSS Assertion

CSS Assertion kontroluje, zda konkrétní prvky mají určitou vlastnost

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

Tvrzení o viditelnosti cypřiše

Cypress Visibility Assertion potvrzuje, zda je prvek DOM viditelný v uživatelském rozhraní

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

Tvrzení o stavu cypřiše

Uvádí stav prvku DOM

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

Cypress Disabled Property Assertion

Uplatnění vlastnosti Cypress Disabled potvrzuje, zda je prvek zakázán

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

Cypress Retry Assertion

Jediný příkaz následovaný asercí se provede v daném pořadí. Nejprve se provede příkaz a poté se provede aserce. Jeden příkaz následovaný více asercemi se také provede v daném pořadí – první a druhé aserce. Takže když první aserce projde, první a druhá aserce budou provedeny spolu s příkazy znovu.

Například níže uvedený příkaz obsahuje obojí .should() a .and() příkazy asertace, kde .and() je jinak známý jako .should()

cy.get('.todo-list li') // příkaz .should('have.length', 2) // tvrzení .and(($li) => { // 2 další tvrzení očekávat($li.get (0).textContent, 'první položka').to.equal('todo A') expect($li.get(1).textContent, 'druhá položka').to.equal('todo B') })

Příklady cypřišových tvrzení

V této části budeme diskutovat o různých typech tvrzení v Cypress, jako je např

  • Implicitní tvrzení
  • Explicitní tvrzení

Na oba typy se podíváme podrobně s příklady

Implicitní tvrzení v Cypřiši

V implicitním tvrzení používáme .should() or .and() příkazy. Tyto příkazy aserce se vztahují na aktuálně vydaný předmět v řetězci příkazů. Jsou závislé na dříve prodaném předmětu.

Podíváme se na příklad použití .should() or .and() Příkazy

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

S .and() což je alias .should() ,můžeme řetězit více tvrzení. Tyto příkazy jsou čitelnější.

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

Výše uvedený příklad je spojen s .should() s uvedením, že by měla mít třídu „aktivní“, za níž následuje .and() se provádí proti stejnému příkazu. To je velmi užitečné, když chceme uplatnit více příkazů.

Explicitní tvrzení v Cypřiši

Předávání explicitního předmětu v tvrzeních spadá pod explicitní typ tvrzení Cypress. Zde použijeme expect a assert příkazy jako tvrzení. Explicitní tvrzení se používají, když chceme použít více tvrzení pro stejný předmět. Používáme také explicitní tvrzení Cypřiš, když chceme udělat zakázku logiku před vyslovením tvrzení.

Podíváme se do příklad pro explicitní Cypress tvrzení

očekávat(pravda).to.být.pravda //kontroluje booleovskou hodnotu očekávat(objekt).to.rovno(objekt)

Negativní cypřišové tvrzení

Podobně jako u pozitivních tvrzení, existují i ​​v Cypressu negativní tvrzení. Použijeme klíčové slovo „not“ přidané k předponě příkazu aserce. Podívejme se na příklad negativního tvrzení

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

Negativní aserce se doporučuje pouze v případech, kdy chcete ověřit, že určitá podmínka již není dostupná poté, co aplikace provede konkrétní akci.

Uvažujme například, že přepínač je zkontrolován a ověřte, že byl odstraněn

// nejprve je položka označena jako dokončeno cy.contains('li.todo', 'Write tests') .should('have.class', 'completed') .find('.toggle') .click() / / třída CSS byla odstraněna cy.contains('li.todo', 'Write tests').should('not.have.class', 'completed')

Cypress Custom Assertion Message

S Cypress můžeme poskytnout další informace nebo vlastní zprávu pro tvrzení pomocí knihovny dohazovačů. Matchers se skládá z malých funkcí, které rozlišují hodnoty a vyhodí podrobnou chybovou zprávu. Chai Knihovna asercí pomůže našemu kódu vypadat čitelněji a selhání testu bude velmi užitečné

const expect = require('chai').expect it('kontroluje číslo', () => { const value = 10 const očekávaná = 3 očekávat(hodnota).to.equal(očekávaná) })
cyyy
Vlastní chybová zpráva Cypress

Cypress Assertion Best Practices

Můžeme napsat více asercí do jednoho bloku pomocí řetězce příkazů. Není nutné psát jednotlivé aserce jako v jednotkových testech. Mnoho lidí píše tvrzení jako níže. Je v pořádku psát tímto způsobem, ale zvyšuje to řádek kódu a redundanci.

description('moje forma', () => { before(() => { cy.visit('/users/new') cy.get('#first').type('ashok') }) it( 'has validation atribut', () => { cy.get('#first').should('have.attr', 'data-validation', 'required') // potvrzení, zda #first má povinné pole } ) it('has active class', () => { cy.get('#first').should('have.class', 'active') // potvrzení, zda #first má aktivní třídu }) it( 'has formatted first name', () => { cy.get('#first').should('have.value', 'Ashok') // potvrzení, zda #first má první písmeno velké }) })

Jak vidíte výše, stále se opakuje stejný selektor a typ tvrzení. Místo toho můžeme tyto příkazy zřetězit do jednoho jediného tvrzení, které provede všechny kontroly lineárním způsobem.

description('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') }) })

Jak bylo uvedeno výše, můžeme jeden selektor zřetězit s více asercemi! Toto je jeden z doporučených osvědčených postupů psaní asercí v Cypressu.

Chcete-li porozumět objektovému modelu stránky v Cypressu, klikněte zde.