You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
218 lines
5.8 KiB
218 lines
5.8 KiB
3 years ago
|
/// <reference types="cypress" />
|
||
|
// remove no check once Cypress.sinon is typed
|
||
|
// https://github.com/cypress-io/cypress/issues/6720
|
||
|
|
||
|
context("Spies, Stubs, and Clock", () => {
|
||
|
it("cy.spy() - wrap a method in a spy", () => {
|
||
|
// https://on.cypress.io/spy
|
||
|
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks")
|
||
|
|
||
|
const obj = {
|
||
|
foo() {},
|
||
|
}
|
||
|
|
||
|
const spy = cy.spy(obj, "foo").as("anyArgs")
|
||
|
|
||
|
obj.foo()
|
||
|
|
||
|
expect(spy).to.be.called
|
||
|
})
|
||
|
|
||
|
it("cy.spy() retries until assertions pass", () => {
|
||
|
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks")
|
||
|
|
||
|
const obj = {
|
||
|
/**
|
||
|
* Prints the argument passed
|
||
|
* @param x {any}
|
||
|
*/
|
||
|
foo(x) {
|
||
|
console.log("obj.foo called with", x)
|
||
|
},
|
||
|
}
|
||
|
|
||
|
cy.spy(obj, "foo").as("foo")
|
||
|
|
||
|
setTimeout(() => {
|
||
|
obj.foo("first")
|
||
|
}, 500)
|
||
|
|
||
|
setTimeout(() => {
|
||
|
obj.foo("second")
|
||
|
}, 2500)
|
||
|
|
||
|
cy.get("@foo").should("have.been.calledTwice")
|
||
|
})
|
||
|
|
||
|
it("cy.stub() - create a stub and/or replace a function with stub", () => {
|
||
|
// https://on.cypress.io/stub
|
||
|
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks")
|
||
|
|
||
|
const obj = {
|
||
|
/**
|
||
|
* prints both arguments to the console
|
||
|
* @param a {string}
|
||
|
* @param b {string}
|
||
|
*/
|
||
|
foo(a, b) {
|
||
|
console.log("a", a, "b", b)
|
||
|
},
|
||
|
}
|
||
|
|
||
|
const stub = cy.stub(obj, "foo").as("foo")
|
||
|
|
||
|
obj.foo("foo", "bar")
|
||
|
|
||
|
expect(stub).to.be.called
|
||
|
})
|
||
|
|
||
|
it("cy.clock() - control time in the browser", () => {
|
||
|
// https://on.cypress.io/clock
|
||
|
|
||
|
// create the date in UTC so its always the same
|
||
|
// no matter what local timezone the browser is running in
|
||
|
const now = new Date(Date.UTC(2017, 2, 14)).getTime()
|
||
|
|
||
|
cy.clock(now)
|
||
|
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks")
|
||
|
cy.get("#clock-div").click().should("have.text", "1489449600")
|
||
|
})
|
||
|
|
||
|
it("cy.tick() - move time in the browser", () => {
|
||
|
// https://on.cypress.io/tick
|
||
|
|
||
|
// create the date in UTC so its always the same
|
||
|
// no matter what local timezone the browser is running in
|
||
|
const now = new Date(Date.UTC(2017, 2, 14)).getTime()
|
||
|
|
||
|
cy.clock(now)
|
||
|
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks")
|
||
|
cy.get("#tick-div").click().should("have.text", "1489449600")
|
||
|
|
||
|
cy.tick(10000) // 10 seconds passed
|
||
|
cy.get("#tick-div").click().should("have.text", "1489449610")
|
||
|
})
|
||
|
|
||
|
it("cy.stub() matches depending on arguments", () => {
|
||
|
// see all possible matchers at
|
||
|
// https://sinonjs.org/releases/latest/matchers/
|
||
|
const greeter = {
|
||
|
/**
|
||
|
* Greets a person
|
||
|
* @param {string} name
|
||
|
*/
|
||
|
greet(name) {
|
||
|
return `Hello, ${name}!`
|
||
|
},
|
||
|
}
|
||
|
|
||
|
cy.stub(greeter, "greet")
|
||
|
.callThrough() // if you want non-matched calls to call the real method
|
||
|
.withArgs(Cypress.sinon.match.string)
|
||
|
.returns("Hi")
|
||
|
.withArgs(Cypress.sinon.match.number)
|
||
|
.throws(new Error("Invalid name"))
|
||
|
|
||
|
expect(greeter.greet("World")).to.equal("Hi")
|
||
|
// @ts-ignore
|
||
|
expect(() => greeter.greet(42)).to.throw("Invalid name")
|
||
|
expect(greeter.greet).to.have.been.calledTwice
|
||
|
|
||
|
// non-matched calls goes the actual method
|
||
|
// @ts-ignore
|
||
|
expect(greeter.greet()).to.equal("Hello, undefined!")
|
||
|
})
|
||
|
|
||
|
it("matches call arguments using Sinon matchers", () => {
|
||
|
// see all possible matchers at
|
||
|
// https://sinonjs.org/releases/latest/matchers/
|
||
|
const calculator = {
|
||
|
/**
|
||
|
* returns the sum of two arguments
|
||
|
* @param a {number}
|
||
|
* @param b {number}
|
||
|
*/
|
||
|
add(a, b) {
|
||
|
return a + b
|
||
|
},
|
||
|
}
|
||
|
|
||
|
const spy = cy.spy(calculator, "add").as("add")
|
||
|
|
||
|
expect(calculator.add(2, 3)).to.equal(5)
|
||
|
|
||
|
// if we want to assert the exact values used during the call
|
||
|
expect(spy).to.be.calledWith(2, 3)
|
||
|
|
||
|
// let's confirm "add" method was called with two numbers
|
||
|
expect(spy).to.be.calledWith(
|
||
|
Cypress.sinon.match.number,
|
||
|
Cypress.sinon.match.number
|
||
|
)
|
||
|
|
||
|
// alternatively, provide the value to match
|
||
|
expect(spy).to.be.calledWith(
|
||
|
Cypress.sinon.match(2),
|
||
|
Cypress.sinon.match(3)
|
||
|
)
|
||
|
|
||
|
// match any value
|
||
|
expect(spy).to.be.calledWith(Cypress.sinon.match.any, 3)
|
||
|
|
||
|
// match any value from a list
|
||
|
expect(spy).to.be.calledWith(Cypress.sinon.match.in([1, 2, 3]), 3)
|
||
|
|
||
|
/**
|
||
|
* Returns true if the given number is event
|
||
|
* @param {number} x
|
||
|
*/
|
||
|
const isEven = x => x % 2 === 0
|
||
|
|
||
|
// expect the value to pass a custom predicate function
|
||
|
// the second argument to "sinon.match(predicate, message)" is
|
||
|
// shown if the predicate does not pass and assertion fails
|
||
|
expect(spy).to.be.calledWith(Cypress.sinon.match(isEven, "isEven"), 3)
|
||
|
|
||
|
/**
|
||
|
* Returns a function that checks if a given number is larger than the limit
|
||
|
* @param {number} limit
|
||
|
* @returns {(x: number) => boolean}
|
||
|
*/
|
||
|
const isGreaterThan = limit => x => x > limit
|
||
|
|
||
|
/**
|
||
|
* Returns a function that checks if a given number is less than the limit
|
||
|
* @param {number} limit
|
||
|
* @returns {(x: number) => boolean}
|
||
|
*/
|
||
|
const isLessThan = limit => x => x < limit
|
||
|
|
||
|
// you can combine several matchers using "and", "or"
|
||
|
expect(spy).to.be.calledWith(
|
||
|
Cypress.sinon.match.number,
|
||
|
Cypress.sinon
|
||
|
.match(isGreaterThan(2), "> 2")
|
||
|
.and(Cypress.sinon.match(isLessThan(4), "< 4"))
|
||
|
)
|
||
|
|
||
|
expect(spy).to.be.calledWith(
|
||
|
Cypress.sinon.match.number,
|
||
|
Cypress.sinon
|
||
|
.match(isGreaterThan(200), "> 200")
|
||
|
.or(Cypress.sinon.match(3))
|
||
|
)
|
||
|
|
||
|
// matchers can be used from BDD assertions
|
||
|
cy.get("@add").should(
|
||
|
"have.been.calledWith",
|
||
|
Cypress.sinon.match.number,
|
||
|
Cypress.sinon.match(3)
|
||
|
)
|
||
|
|
||
|
// you can alias matchers for shorter test code
|
||
|
const { match: M } = Cypress.sinon
|
||
|
|
||
|
cy.get("@add").should("have.been.calledWith", M.number, M(3))
|
||
|
})
|
||
|
})
|