Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Maarch
maarchRM
Commits
4e2b9381
Verified
Commit
4e2b9381
authored
Apr 04, 2019
by
Alexandre Morin
Browse files
WIP test
parent
9eea4b5b
Pipeline
#3448
passed with stage
in 4 minutes and 11 seconds
Changes
21
Pipelines
2
Hide whitespace changes
Inline
Side-by-side
.gitlab-ci.yml
View file @
4e2b9381
...
...
@@ -35,17 +35,3 @@ cypress-e2e:
paths
:
-
cypress/screenshots
-
cypress/videos
cypress-e2e-chrome
:
image
:
cypress/browsers:chrome67
stage
:
test
script
:
-
npm ci
-
$(npm bin)/cypress verify
-
$(npm bin)/cypress run --browser chrome
artifacts
:
expire_in
:
1 week
when
:
always
paths
:
-
cypress/screenshots
-
cypress/videos
cypress.json
View file @
4e2b9381
{}
\ No newline at end of file
{
"baseUrl"
:
"http://preview.maarchrm.com/"
}
\ No newline at end of file
cypress/integration/examples/actions.spec.js
deleted
100644 → 0
View file @
9eea4b5b
/// <reference types="Cypress" />
context
(
'
Actions
'
,
()
=>
{
beforeEach
(()
=>
{
cy
.
visit
(
'
https://example.cypress.io/commands/actions
'
)
})
// https://on.cypress.io/interacting-with-elements
it
(
'
.type() - type into a DOM element
'
,
()
=>
{
// https://on.cypress.io/type
cy
.
get
(
'
.action-email
'
)
.
type
(
'
fake@email.com
'
).
should
(
'
have.value
'
,
'
fake@email.com
'
)
// .type() with special character sequences
.
type
(
'
{leftarrow}{rightarrow}{uparrow}{downarrow}
'
)
.
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}
'
)
// Delay each keypress by 0.1 sec
.
type
(
'
slow.typing@email.com
'
,
{
delay
:
100
})
.
should
(
'
have.value
'
,
'
slow.typing@email.com
'
)
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
'
)
})
it
(
'
.focus() - focus on a DOM element
'
,
()
=>
{
// https://on.cypress.io/focus
cy
.
get
(
'
.action-focus
'
).
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
'
)
.
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
'
,
''
)
})
it
(
'
.submit() - submit a form
'
,
()
=>
{
// https://on.cypress.io/submit
cy
.
get
(
'
.action-form
'
)
.
find
(
'
[type="text"]
'
).
type
(
'
HALFOFF
'
)
cy
.
get
(
'
.action-form
'
).
submit
()
.
next
().
should
(
'
contain
'
,
'
Your form has been submitted!
'
)
})
it
(
'
.click() - click on a DOM element
'
,
()
=>
{
// https://on.cypress.io/click
cy
.
get
(
'
.action-btn
'
).
click
()
// You can click on 9 specific positions of an element:
// -----------------------------------
// | topLeft top topRight |
// | |
// | |
// | |
// | left center right |
// | |
// | |
// | |
// | bottomLeft bottom bottomRight |
// -----------------------------------
// clicking in the center of the element is the default
cy
.
get
(
'
#action-canvas
'
).
click
()
cy
.
get
(
'
#action-canvas
'
).
click
(
'
topLeft
'
)
cy
.
get
(
'
#action-canvas
'
).
click
(
'
top
'
)
cy
.
get
(
'
#action-canvas
'
).
click
(
'
topRight
'
)
cy
.
get
(
'
#action-canvas
'
).
click
(
'
left
'
)
cy
.
get
(
'
#action-canvas
'
).
click
(
'
right
'
)
cy
.
get
(
'
#action-canvas
'
).
click
(
'
bottomLeft
'
)
cy
.
get
(
'
#action-canvas
'
).
click
(
'
bottom
'
)
cy
.
get
(
'
#action-canvas
'
).
click
(
'
bottomRight
'
)
// .click() accepts an x and y coordinate
// 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
)
// click multiple elements by passing multiple: true
cy
.
get
(
'
.action-labels>.label
'
).
click
({
multiple
:
true
})
// Ignore error checking prior to clicking
cy
.
get
(
'
.action-opacity>.btn
'
).
click
({
force
:
true
})
})
it
(
'
.dblclick() - double click on a DOM element
'
,
()
=>
{
// https://on.cypress.io/dblclick
// 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-input-hidden
'
).
should
(
'
be.visible
'
)
})
it
(
'
.check() - check a checkbox or radio element
'
,
()
=>
{
// https://on.cypress.io/check
// 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-radios [type="radio"]
'
).
not
(
'
[disabled]
'
)
.
check
().
should
(
'
be.checked
'
)
// .check() accepts a value argument
cy
.
get
(
'
.action-radios [type="radio"]
'
)
.
check
(
'
radio1
'
).
should
(
'
be.checked
'
)
// .check() accepts an array of values
cy
.
get
(
'
.action-multiple-checkboxes [type="checkbox"]
'
)
.
check
([
'
checkbox1
'
,
'
checkbox2
'
]).
should
(
'
be.checked
'
)
// Ignore error checking prior to checking
cy
.
get
(
'
.action-checkboxes [disabled]
'
)
.
check
({
force
:
true
}).
should
(
'
be.checked
'
)
cy
.
get
(
'
.action-radios [type="radio"]
'
)
.
check
(
'
radio3
'
,
{
force
:
true
}).
should
(
'
be.checked
'
)
})
it
(
'
.uncheck() - uncheck a checkbox element
'
,
()
=>
{
// https://on.cypress.io/uncheck
// By default, .uncheck() will uncheck all matching
// checkbox elements in succession, one after another
cy
.
get
(
'
.action-check [type="checkbox"]
'
)
.
not
(
'
[disabled]
'
)
.
uncheck
().
should
(
'
not.be.checked
'
)
// .uncheck() accepts a value argument
cy
.
get
(
'
.action-check [type="checkbox"]
'
)
.
check
(
'
checkbox1
'
)
.
uncheck
(
'
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
'
)
// Ignore error checking prior to unchecking
cy
.
get
(
'
.action-check [disabled]
'
)
.
uncheck
({
force
:
true
}).
should
(
'
not.be.checked
'
)
})
it
(
'
.select() - select an option in a <select> element
'
,
()
=>
{
// https://on.cypress.io/select
// Select option(s) with matching text content
cy
.
get
(
'
.action-select
'
).
select
(
'
apples
'
)
cy
.
get
(
'
.action-select-multiple
'
)
.
select
([
'
apples
'
,
'
oranges
'
,
'
bananas
'
])
// Select option(s) with matching value
cy
.
get
(
'
.action-select
'
).
select
(
'
fr-bananas
'
)
cy
.
get
(
'
.action-select-multiple
'
)
.
select
([
'
fr-apples
'
,
'
fr-oranges
'
,
'
fr-bananas
'
])
})
it
(
'
.scrollIntoView() - scroll an element into view
'
,
()
=>
{
// https://on.cypress.io/scrollintoview
// normally all of these buttons are hidden,
// because they're not within
// the viewable area of their parent
// (we need to scroll to see them)
cy
.
get
(
'
#scroll-horizontal button
'
)
.
should
(
'
not.be.visible
'
)
// scroll the button into view, as if the user had scrolled
cy
.
get
(
'
#scroll-horizontal button
'
).
scrollIntoView
()
.
should
(
'
be.visible
'
)
cy
.
get
(
'
#scroll-vertical button
'
)
.
should
(
'
not.be.visible
'
)
// Cypress handles the scroll direction needed
cy
.
get
(
'
#scroll-vertical button
'
).
scrollIntoView
()
.
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
()
.
should
(
'
be.visible
'
)
})
it
(
'
.trigger() - trigger an event on a DOM element
'
,
()
=>
{
// https://on.cypress.io/trigger
// To interact with a range input (slider)
// we need to set its value & trigger the
// event to signal it changed
// Here, we invoke jQuery's val() method to set
// the value and trigger the 'change' event
cy
.
get
(
'
.trigger-input-range
'
)
.
invoke
(
'
val
'
,
25
)
.
trigger
(
'
change
'
)
.
get
(
'
input[type=range]
'
).
siblings
(
'
p
'
)
.
should
(
'
have.text
'
,
'
25
'
)
})
it
(
'
cy.scrollTo() - scroll the window or element to a position
'
,
()
=>
{
// https://on.cypress.io/scrollTo
// You can scroll to 9 specific positions of an element:
// -----------------------------------
// | topLeft top topRight |
// | |
// | |
// | |
// | left center right |
// | |
// | |
// | |
// | bottomLeft bottom bottomRight |
// -----------------------------------
// if you chain .scrollTo() off of cy, we will
// scroll the entire window
cy
.
scrollTo
(
'
bottom
'
)
cy
.
get
(
'
#scrollable-horizontal
'
).
scrollTo
(
'
right
'
)
// or you can scroll to a specific coordinate:
// (x axis, y axis) in pixels
cy
.
get
(
'
#scrollable-vertical
'
).
scrollTo
(
250
,
250
)
// or you can scroll to a specific percentage
// of the (width, height) of the element
cy
.
get
(
'
#scrollable-both
'
).
scrollTo
(
'
75%
'
,
'
25%
'
)
// control the easing of the scroll (default is 'swing')
cy
.
get
(
'
#scrollable-vertical
'
).
scrollTo
(
'
center
'
,
{
easing
:
'
linear
'
})
// control the duration of the scroll (in ms)
cy
.
get
(
'
#scrollable-both
'
).
scrollTo
(
'
center
'
,
{
duration
:
2000
})
})
})
cypress/integration/examples/aliasing.spec.js
deleted
100644 → 0
View file @
9eea4b5b
/// <reference types="Cypress" />
context
(
'
Aliasing
'
,
()
=>
{
beforeEach
(()
=>
{
cy
.
visit
(
'
https://example.cypress.io/commands/aliasing
'
)
})
it
(
'
.as() - alias a DOM element for later use
'
,
()
=>
{
// https://on.cypress.io/as
// Alias a DOM element for use later
// We don't have to traverse to the element
// later in our code, we reference it with @
cy
.
get
(
'
.as-table
'
).
find
(
'
tbody>tr
'
)
.
first
().
find
(
'
td
'
).
first
()
.
find
(
'
button
'
).
as
(
'
firstBtn
'
)
// when we reference the alias, we place an
// @ in front of its name
cy
.
get
(
'
@firstBtn
'
).
click
()
cy
.
get
(
'
@firstBtn
'
)
.
should
(
'
have.class
'
,
'
btn-success
'
)
.
and
(
'
contain
'
,
'
Changed
'
)
})
it
(
'
.as() - alias a route for later use
'
,
()
=>
{
// Alias the route to wait for its response
cy
.
server
()
cy
.
route
(
'
GET
'
,
'
comments/*
'
).
as
(
'
getComment
'
)
// we have code that gets a comment when
// the button is clicked in scripts.js
cy
.
get
(
'
.network-btn
'
).
click
()
// https://on.cypress.io/wait
cy
.
wait
(
'
@getComment
'
).
its
(
'
status
'
).
should
(
'
eq
'
,
200
)
})
})
cypress/integration/examples/assertions.spec.js
deleted
100644 → 0
View file @
9eea4b5b
/// <reference types="Cypress" />
context
(
'
Assertions
'
,
()
=>
{
beforeEach
(()
=>
{
cy
.
visit
(
'
https://example.cypress.io/commands/assertions
'
)
})
describe
(
'
Implicit Assertions
'
,
()
=>
{
it
(
'
.should() - make an assertion about the current subject
'
,
()
=>
{
// https://on.cypress.io/should
cy
.
get
(
'
.assertion-table
'
)
.
find
(
'
tbody tr:last
'
)
.
should
(
'
have.class
'
,
'
success
'
)
.
find
(
'
td
'
)
.
first
()
// checking the text of the <td> element in various ways
.
should
(
'
have.text
'
,
'
Column content
'
)
.
should
(
'
contain
'
,
'
Column content
'
)
.
should
(
'
have.html
'
,
'
Column content
'
)
// chai-jquery uses "is()" to check if element matches selector
.
should
(
'
match
'
,
'
td
'
)
// to match text content against a regular expression
// first need to invoke jQuery method text()
// and then match using regular expression
.
invoke
(
'
text
'
)
.
should
(
'
match
'
,
/column content/i
)
// a better way to check element's text content against a regular expression
// is to use "cy.contains"
// https://on.cypress.io/contains
cy
.
get
(
'
.assertion-table
'
)
.
find
(
'
tbody tr:last
'
)
// finds first <td> element with text content matching regular expression
.
contains
(
'
td
'
,
/column content/i
)
.
should
(
'
be.visible
'
)
// for more information about asserting element's text
// see https://on.cypress.io/using-cypress-faq#How-do-I-get-an-element’s-text-contents
})
it
(
'
.and() - chain multiple assertions together
'
,
()
=>
{
// https://on.cypress.io/and
cy
.
get
(
'
.assertions-link
'
)
.
should
(
'
have.class
'
,
'
active
'
)
.
and
(
'
have.attr
'
,
'
href
'
)
.
and
(
'
include
'
,
'
cypress.io
'
)
})
})
describe
(
'
Explicit Assertions
'
,
()
=>
{
// https://on.cypress.io/assertions
it
(
'
expect - make an assertion about a specified subject
'
,
()
=>
{
// We can use Chai's BDD style assertions
expect
(
true
).
to
.
be
.
true
const
o
=
{
foo
:
'
bar
'
}
expect
(
o
).
to
.
equal
(
o
)
expect
(
o
).
to
.
deep
.
equal
({
foo
:
'
bar
'
})
// matching text using regular expression
expect
(
'
FooBar
'
).
to
.
match
(
/bar$/i
)
})
it
(
'
pass your own callback function to should()
'
,
()
=>
{
// Pass a function to should that can have any number
// of explicit assertions within it.
// The ".should(cb)" function will be retried
// automatically until it passes all your explicit assertions or times out.
cy
.
get
(
'
.assertions-p
'
)
.
find
(
'
p
'
)
.
should
((
$p
)
=>
{
// https://on.cypress.io/$
// return an array of texts from all of the p's
// @ts-ignore TS6133 unused variable
const
texts
=
$p
.
map
((
i
,
el
)
=>
Cypress
.
$
(
el
).
text
())
// jquery map returns jquery object
// and .get() convert this to simple array
const
paragraphs
=
texts
.
get
()
// array should have length of 3
expect
(
paragraphs
).
to
.
have
.
length
(
3
)
// set this specific subject
expect
(
paragraphs
).
to
.
deep
.
eq
([
'
Some text from first p
'
,
'
More text from second p
'
,
'
And even more text from third p
'
,
])
})
})
it
(
'
finds element by class name regex
'
,
()
=>
{
cy
.
get
(
'
.docs-header
'
)
.
find
(
'
div
'
)
// .should(cb) callback function will be retried
.
should
((
$div
)
=>
{
expect
(
$div
).
to
.
have
.
length
(
1
)
const
className
=
$div
[
0
].
className
expect
(
className
).
to
.
match
(
/heading-/
)
})
// .then(cb) callback is not retried,
// it either passes or fails
.
then
((
$div
)
=>
{
expect
(
$div
).
to
.
have
.
text
(
'
Introduction
'
)
})
})
it
(
'
can throw any error
'
,
()
=>
{
cy
.
get
(
'
.docs-header
'
)
.
find
(
'
div
'
)
.
should
((
$div
)
=>
{
if
(
$div
.
length
!==
1
)
{
// you can throw your own errors
throw
new
Error
(
'
Did not find 1 element
'
)
}
const
className
=
$div
[
0
].
className
if
(
!
className
.
match
(
/heading-/
))
{
throw
new
Error
(
`Could not find class "heading-" in
${
className
}
`
)
}
})
})
it
(
'
assert - assert shape of an object
'
,
()
=>
{
const
person
=
{
name
:
'
Joe
'
,
age
:
20
,
}
assert
.
isObject
(
person
,
'
value is object
'
)
})
})
})
cypress/integration/examples/connectors.spec.js
deleted
100644 → 0
View file @
9eea4b5b
/// <reference types="Cypress" />
context
(
'
Connectors
'
,
()
=>
{
beforeEach
(()
=>
{
cy
.
visit
(
'
https://example.cypress.io/commands/connectors
'
)
})
it
(
'
.each() - iterate over an array of elements
'
,
()
=>
{
// https://on.cypress.io/each
cy
.
get
(
'
.connectors-each-ul>li
'
)
.
each
((
$el
,
index
,
$list
)
=>
{
console
.
log
(
$el
,
index
,
$list
)
})
})
it
(
'
.its() - get properties on the current subject
'
,
()
=>
{
// https://on.cypress.io/its
cy
.
get
(
'
.connectors-its-ul>li
'
)
// calls the 'length' property yielding that value
.
its
(
'
length
'
)
.
should
(
'
be.gt
'
,
2
)
})
it
(
'
.invoke() - invoke a function on the current subject
'
,
()
=>
{
// our div is hidden in our script.js
// $('.connectors-div').hide()
// https://on.cypress.io/invoke
cy
.
get
(
'
.connectors-div
'
).
should
(
'
be.hidden
'
)
// call the jquery method 'show' on the 'div.container'
.
invoke
(
'
show
'
)
.
should
(
'
be.visible
'
)
})
it
(
'
.spread() - spread an array as individual args to callback function
'
,
()
=>
{
// https://on.cypress.io/spread
const
arr
=
[
'
foo
'
,
'
bar
'
,
'
baz
'
]
cy
.
wrap
(
arr
).
spread
((
foo
,
bar
,
baz
)
=>
{
expect
(
foo
).
to
.
eq
(
'
foo
'
)
expect
(
bar
).
to
.
eq
(
'
bar
'
)
expect
(
baz
).
to
.
eq
(
'
baz
'
)
})
})
it
(
'
.then() - invoke a callback function with the current subject
'
,
()
=>
{
// https://on.cypress.io/then
cy
.
get
(
'
.connectors-list>li
'
).
then
((
$lis
)
=>
{
expect
(
$lis
).
to
.
have
.
length
(
3
)
expect
(
$lis
.
eq
(
0
)).
to
.
contain
(
'
Walk the dog
'
)
expect
(
$lis
.
eq
(
1
)).
to
.
contain
(
'
Feed the cat
'
)
expect
(
$lis
.
eq
(
2
)).
to
.
contain
(
'
Write JavaScript
'
)
})
})
})
cypress/integration/examples/cookies.spec.js
deleted
100644 → 0
View file @
9eea4b5b
/// <reference types="Cypress" />
context
(
'
Cookies
'
,
()
=>
{
beforeEach
(()
=>
{
Cypress
.
Cookies
.
debug
(
true
)
cy
.
visit
(
'
https://example.cypress.io/commands/cookies
'
)
// clear cookies again after visiting to remove
// any 3rd party cookies picked up such as cloudflare
cy
.
clearCookies
()
})
it
(
'
cy.getCookie() - get a browser cookie
'
,
()
=>
{
// https://on.cypress.io/getcookie
cy
.
get
(
'
#getCookie .set-a-cookie
'
).
click
()
// cy.getCookie() yields a cookie object
cy
.
getCookie
(
'
token
'
).
should
(
'
have.property
'
,
'
value
'
,
'
123ABC
'
)
})
it
(
'
cy.getCookies() - get browser cookies
'
,
()
=>
{
// https://on.cypress.io/getcookies
cy
.
getCookies
().
should
(
'
be.empty
'
)
cy
.
get
(
'
#getCookies .set-a-cookie
'
).
click
()
// cy.getCookies() yields an array of cookies
cy
.
getCookies
().
should
(
'
have.length
'
,
1
).
should
((
cookies
)
=>
{
// each cookie has these properties
expect
(
cookies
[
0
]).
to
.
have
.
property
(
'
name
'
,
'
token
'
)
expect
(
cookies
[
0
]).
to
.
have
.
property
(
'
value
'
,
'
123ABC
'
)
expect
(
cookies
[
0
]).
to
.
have
.
property
(
'
httpOnly
'
,
false
)
expect
(
cookies
[
0
]).
to
.
have
.
property
(
'
secure
'
,
false
)
expect
(
cookies
[
0
]).
to
.
have
.
property
(
'
domain
'
)
expect
(
cookies
[
0
]).
to
.
have
.
property
(
'
path
'
)
})
})
it
(
'
cy.setCookie() - set a browser cookie
'
,
()
=>
{
// https://on.cypress.io/setcookie
cy
.
getCookies
().
should
(
'
be.empty
'
)
cy
.
setCookie
(
'
foo
'
,
'
bar
'
)
// cy.getCookie() yields a cookie object
cy
.
getCookie
(
'
foo
'
).
should
(
'
have.property
'
,
'
value
'
,
'
bar
'
)
})
it
(
'
cy.clearCookie() - clear a browser cookie
'
,
()
=>
{
// https://on.cypress.io/clearcookie
cy
.
getCookie
(
'
token
'
).
should
(
'
be.null
'
)