-
Notifications
You must be signed in to change notification settings - Fork 2.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fixes #661
- Loading branch information
Showing
7 changed files
with
108 additions
and
77 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -9,50 +9,51 @@ context('Actions', () => { | |
|
|
||
| it('.type() - type into a DOM element', () => { | ||
| // https://on.cypress.io/type | ||
| cy.get('.action-email') | ||
| .type('[email protected]').should('have.value', '[email protected]') | ||
| cy.get('.action-email').type('[email protected]') | ||
| cy.get('.action-email').should('have.value', '[email protected]') | ||
|
|
||
| // .type() with special character sequences | ||
| .type('{leftarrow}{rightarrow}{uparrow}{downarrow}') | ||
| .type('{del}{selectall}{backspace}') | ||
| // .type() with special character sequences | ||
| cy.get('.action-email').type('{leftarrow}{rightarrow}{uparrow}{downarrow}') | ||
| cy.get('.action-email').type('{del}{selectall}{backspace}') | ||
|
|
||
| // .type() with key modifiers | ||
| .type('{alt}{option}') //these are equivalent | ||
| .type('{ctrl}{control}') //these are equivalent | ||
| .type('{meta}{command}{cmd}') //these are equivalent | ||
| .type('{shift}') | ||
| // .type() with key modifiers | ||
| cy.get('.action-email').type('{alt}{option}') //these are equivalent | ||
| cy.get('.action-email').type('{ctrl}{control}') //these are equivalent | ||
| cy.get('.action-email').type('{meta}{command}{cmd}') //these are equivalent | ||
| cy.get('.action-email').type('{shift}') | ||
|
|
||
| // Delay each keypress by 0.1 sec | ||
| .type('[email protected]', { delay: 100 }) | ||
| .should('have.value', '[email protected]') | ||
| // Delay each keypress by 0.1 sec | ||
| cy.get('.action-email').type('[email protected]', { delay: 100 }) | ||
| cy.get('.action-email').should('have.value', '[email protected]') | ||
|
|
||
| cy.get('.action-disabled') | ||
| // Ignore error checking prior to type | ||
| // like whether the input is visible or disabled | ||
| .type('disabled error checking', { force: true }) | ||
| .should('have.value', 'disabled error checking') | ||
| cy.get('.action-disabled').should('have.value', 'disabled error checking') | ||
| }) | ||
|
|
||
| it('.focus() - focus on a DOM element', () => { | ||
| // https://on.cypress.io/focus | ||
| cy.get('.action-focus').focus() | ||
| .should('have.class', 'focus') | ||
| cy.get('.action-focus').should('have.class', 'focus') | ||
| .prev().should('have.attr', 'style', 'color: orange;') | ||
| }) | ||
|
|
||
| it('.blur() - blur off a DOM element', () => { | ||
| // https://on.cypress.io/blur | ||
| cy.get('.action-blur').type('About to blur').blur() | ||
| .should('have.class', 'error') | ||
| cy.get('.action-blur').type('About to blur') | ||
| cy.get('.action-blur').blur() | ||
| cy.get('.action-blur').should('have.class', 'error') | ||
| .prev().should('have.attr', 'style', 'color: red;') | ||
| }) | ||
|
|
||
| it('.clear() - clears an input or textarea element', () => { | ||
| // https://on.cypress.io/clear | ||
| cy.get('.action-clear').type('Clear this text') | ||
| .should('have.value', 'Clear this text') | ||
| .clear() | ||
| .should('have.value', '') | ||
| cy.get('.action-clear').should('have.value', 'Clear this text') | ||
| cy.get('.action-clear').clear() | ||
| cy.get('.action-clear').should('have.value', '') | ||
| }) | ||
|
|
||
| it('.submit() - submit a form', () => { | ||
|
|
@@ -61,7 +62,7 @@ context('Actions', () => { | |
| .find('[type="text"]').type('HALFOFF') | ||
|
|
||
| cy.get('.action-form').submit() | ||
| .next().should('contain', 'Your form has been submitted!') | ||
| cy.get('.action-form').next().should('contain', 'Your form has been submitted!') | ||
| }) | ||
|
|
||
| it('.click() - click on a DOM element', () => { | ||
|
|
@@ -97,13 +98,13 @@ context('Actions', () => { | |
| // that controls where the click occurs :) | ||
|
|
||
| cy.get('#action-canvas') | ||
| .click(80, 75) // click 80px on x coord and 75px on y coord | ||
| .click(170, 75) | ||
| .click(80, 165) | ||
| .click(100, 185) | ||
| .click(125, 190) | ||
| .click(150, 185) | ||
| .click(170, 165) | ||
| cy.get('#action-canvas').click(80, 75) // click 80px on x coord and 75px on y coord | ||
| cy.get('#action-canvas').click(170, 75) | ||
| cy.get('#action-canvas').click(80, 165) | ||
| cy.get('#action-canvas').click(100, 185) | ||
| cy.get('#action-canvas').click(125, 190) | ||
| cy.get('#action-canvas').click(150, 185) | ||
| cy.get('#action-canvas').click(170, 165) | ||
|
|
||
| // click multiple elements by passing multiple: true | ||
| cy.get('.action-labels>.label').click({ multiple: true }) | ||
|
|
@@ -117,7 +118,8 @@ context('Actions', () => { | |
|
|
||
| // Our app has a listener on 'dblclick' event in our 'scripts.js' | ||
| // that hides the div and shows an input on double click | ||
| cy.get('.action-div').dblclick().should('not.be.visible') | ||
| cy.get('.action-div').dblclick() | ||
| cy.get('.action-div').should('not.be.visible') | ||
| cy.get('.action-input-hidden').should('be.visible') | ||
| }) | ||
|
|
||
|
|
@@ -126,7 +128,8 @@ context('Actions', () => { | |
|
|
||
| // Our app has a listener on 'contextmenu' event in our 'scripts.js' | ||
| // that hides the div and shows an input on right click | ||
| cy.get('.rightclick-action-div').rightclick().should('not.be.visible') | ||
| cy.get('.rightclick-action-div').rightclick() | ||
| cy.get('.rightclick-action-div').should('not.be.visible') | ||
| cy.get('.rightclick-action-input-hidden').should('be.visible') | ||
| }) | ||
|
|
||
|
|
@@ -135,26 +138,26 @@ context('Actions', () => { | |
|
|
||
| // By default, .check() will check all | ||
| // matching checkbox or radio elements in succession, one after another | ||
| cy.get('.action-checkboxes [type="checkbox"]').not('[disabled]') | ||
| .check().should('be.checked') | ||
| cy.get('.action-checkboxes [type="checkbox"]').not('[disabled]').check() | ||
| cy.get('.action-checkboxes [type="checkbox"]').not('[disabled]').should('be.checked') | ||
|
|
||
| cy.get('.action-radios [type="radio"]').not('[disabled]') | ||
| .check().should('be.checked') | ||
| cy.get('.action-radios [type="radio"]').not('[disabled]').check() | ||
| cy.get('.action-radios [type="radio"]').not('[disabled]').should('be.checked') | ||
|
|
||
| // .check() accepts a value argument | ||
| cy.get('.action-radios [type="radio"]') | ||
| .check('radio1').should('be.checked') | ||
| cy.get('.action-radios [type="radio"]').check('radio1') | ||
| cy.get('.action-radios [type="radio"]').should('be.checked') | ||
|
|
||
| // .check() accepts an array of values | ||
| cy.get('.action-multiple-checkboxes [type="checkbox"]') | ||
| .check(['checkbox1', 'checkbox2']).should('be.checked') | ||
| cy.get('.action-multiple-checkboxes [type="checkbox"]').check(['checkbox1', 'checkbox2']) | ||
| cy.get('.action-multiple-checkboxes [type="checkbox"]').should('be.checked') | ||
|
|
||
| // Ignore error checking prior to checking | ||
| cy.get('.action-checkboxes [disabled]') | ||
| .check({ force: true }).should('be.checked') | ||
| cy.get('.action-checkboxes [disabled]').check({ force: true }) | ||
| cy.get('.action-checkboxes [disabled]').should('be.checked') | ||
|
|
||
| cy.get('.action-radios [type="radio"]') | ||
| .check('radio3', { force: true }).should('be.checked') | ||
| cy.get('.action-radios [type="radio"]').check('radio3', { force: true }) | ||
| cy.get('.action-radios [type="radio"]').should('be.checked') | ||
| }) | ||
|
|
||
| it('.uncheck() - uncheck a checkbox element', () => { | ||
|
|
@@ -164,21 +167,32 @@ context('Actions', () => { | |
| // checkbox elements in succession, one after another | ||
| cy.get('.action-check [type="checkbox"]') | ||
| .not('[disabled]') | ||
| .uncheck().should('not.be.checked') | ||
| .uncheck() | ||
| cy.get('.action-check [type="checkbox"]') | ||
| .not('[disabled]') | ||
| .should('not.be.checked') | ||
|
|
||
| // .uncheck() accepts a value argument | ||
| cy.get('.action-check [type="checkbox"]') | ||
| .check('checkbox1') | ||
| .uncheck('checkbox1').should('not.be.checked') | ||
| cy.get('.action-check [type="checkbox"]') | ||
| .uncheck('checkbox1') | ||
| cy.get('.action-check [type="checkbox"][value="checkbox1"]') | ||
| .should('not.be.checked') | ||
|
|
||
| // .uncheck() accepts an array of values | ||
| cy.get('.action-check [type="checkbox"]') | ||
| .check(['checkbox1', 'checkbox3']) | ||
| .uncheck(['checkbox1', 'checkbox3']).should('not.be.checked') | ||
| cy.get('.action-check [type="checkbox"]') | ||
| .uncheck(['checkbox1', 'checkbox3']) | ||
| cy.get('.action-check [type="checkbox"][value="checkbox1"]') | ||
| .should('not.be.checked') | ||
| cy.get('.action-check [type="checkbox"][value="checkbox3"]') | ||
| .should('not.be.checked') | ||
|
|
||
| // Ignore error checking prior to unchecking | ||
| cy.get('.action-check [disabled]') | ||
| .uncheck({ force: true }).should('not.be.checked') | ||
| cy.get('.action-check [disabled]').uncheck({ force: true }) | ||
| cy.get('.action-check [disabled]').should('not.be.checked') | ||
| }) | ||
|
|
||
| it('.select() - select an option in a <select> element', () => { | ||
|
|
@@ -196,17 +210,20 @@ context('Actions', () => { | |
|
|
||
| cy.get('.action-select-multiple') | ||
| .select(['apples', 'oranges', 'bananas']) | ||
| cy.get('.action-select-multiple') | ||
| // when getting multiple values, invoke "val" method first | ||
| .invoke('val') | ||
| .should('deep.equal', ['fr-apples', 'fr-oranges', 'fr-bananas']) | ||
|
|
||
| // Select option(s) with matching value | ||
| cy.get('.action-select').select('fr-bananas') | ||
| cy.get('.action-select') | ||
| // can attach an assertion right away to the element | ||
| .should('have.value', 'fr-bananas') | ||
|
|
||
| cy.get('.action-select-multiple') | ||
| .select(['fr-apples', 'fr-oranges', 'fr-bananas']) | ||
| cy.get('.action-select-multiple') | ||
| .invoke('val') | ||
| .should('deep.equal', ['fr-apples', 'fr-oranges', 'fr-bananas']) | ||
|
|
||
|
|
@@ -227,20 +244,23 @@ context('Actions', () => { | |
|
|
||
| // scroll the button into view, as if the user had scrolled | ||
| cy.get('#scroll-horizontal button').scrollIntoView() | ||
| cy.get('#scroll-horizontal button') | ||
| .should('be.visible') | ||
|
|
||
| cy.get('#scroll-vertical button') | ||
| .should('not.be.visible') | ||
|
|
||
| // Cypress handles the scroll direction needed | ||
| cy.get('#scroll-vertical button').scrollIntoView() | ||
| cy.get('#scroll-vertical button') | ||
| .should('be.visible') | ||
|
|
||
| cy.get('#scroll-both button') | ||
| .should('not.be.visible') | ||
|
|
||
| // Cypress knows to scroll to the right and down | ||
| cy.get('#scroll-both button').scrollIntoView() | ||
| cy.get('#scroll-both button') | ||
| .should('be.visible') | ||
| }) | ||
|
|
||
|
|
@@ -255,7 +275,9 @@ context('Actions', () => { | |
| // the value and trigger the 'change' event | ||
| cy.get('.trigger-input-range') | ||
| .invoke('val', 25) | ||
| cy.get('.trigger-input-range') | ||
| .trigger('change') | ||
| cy.get('.trigger-input-range') | ||
| .get('input[type=range]').siblings('p') | ||
| .should('have.text', '25') | ||
| }) | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.