iframe:
diff --git a/packages/driver/test/cypress/fixtures/issue-2956.html b/packages/driver/test/cypress/fixtures/issue-2956.html
new file mode 100644
index 000000000000..4536d323874b
--- /dev/null
+++ b/packages/driver/test/cypress/fixtures/issue-2956.html
@@ -0,0 +1,134 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/driver/test/cypress/integration/commands/actions/click_spec.js b/packages/driver/test/cypress/integration/commands/actions/click_spec.js
index 31a4b692d438..028494e1dc80 100644
--- a/packages/driver/test/cypress/integration/commands/actions/click_spec.js
+++ b/packages/driver/test/cypress/integration/commands/actions/click_spec.js
@@ -1,11 +1,31 @@
const $ = Cypress.$.bind(Cypress)
const { _ } = Cypress
const { Promise } = Cypress
+const chaiSubset = require('chai-subset')
+
+chai.use(chaiSubset)
const fail = function (str) {
throw new Error(str)
}
+const mouseClickEvents = ['pointerdown', 'mousedown', 'pointerup', 'mouseup', 'click']
+const mouseHoverEvents = [
+ 'pointerout',
+ 'pointerleave',
+ 'pointerover',
+ 'pointerenter',
+ 'mouseout',
+ 'mouseleave',
+ 'mouseover',
+ 'mouseenter',
+ 'pointermove',
+ 'mousemove',
+]
+const focusEvents = ['focus', 'focusin']
+
+const allMouseEvents = [...mouseClickEvents, ...mouseHoverEvents, ...focusEvents]
+
describe('src/cy/commands/actions/click', () => {
before(() => {
cy
@@ -18,7 +38,10 @@ describe('src/cy/commands/actions/click', () => {
beforeEach(function () {
const doc = cy.state('document')
- return $(doc.body).empty().html(this.body)
+ $(doc.body).empty().html(this.body)
+ // scroll back to top of page before every test
+ // since this is a side-effect
+ doc.documentElement.scrollTop = 0
})
context('#click', () => {
@@ -144,8 +167,23 @@ describe('src/cy/commands/actions/click', () => {
const $btn = cy.$$('#button')
_.each('mousedown mouseup click'.split(' '), (event) => {
- return $btn.get(0).addEventListener(event, () => {
- return events.push(event)
+ $btn.get(0).addEventListener(event, () => {
+ events.push(event)
+ })
+ })
+
+ cy.get('#button').click().then(() => {
+ expect(events).to.deep.eq(['mousedown', 'mouseup', 'click'])
+ })
+ })
+
+ it('sends pointer and mouse events in order', () => {
+ const events = []
+ const $btn = cy.$$('#button')
+
+ _.each('pointerdown mousedown pointerup mouseup click'.split(' '), (event) => {
+ $btn.get(0).addEventListener(event, () => {
+ events.push(event)
})
})
@@ -229,6 +267,7 @@ describe('src/cy/commands/actions/click', () => {
.then(() => {
expect(onError).calledOnce
})
+
})
})
@@ -267,25 +306,37 @@ describe('src/cy/commands/actions/click', () => {
})
it('will send all events even mousedown is defaultPrevented', () => {
- const events = []
const $btn = cy.$$('#button')
$btn.get(0).addEventListener('mousedown', (e) => {
e.preventDefault()
-
expect(e.defaultPrevented).to.be.true
})
- _.each('mouseup click'.split(' '), (event) => {
- return $btn.get(0).addEventListener(event, () => {
- return events.push(event)
- })
- })
+ attachMouseClickListeners({ $btn })
- cy.get('#button').click().then(() => {
- expect(events).to.deep.eq(['mouseup', 'click'])
+ cy.get('#button').click().should('not.have.focus')
+
+ cy.getAll('$btn', 'pointerdown mousedown pointerup mouseup click').each(shouldBeCalled)
+ })
+
+ it('will not send mouseEvents/focus if pointerdown is defaultPrevented', () => {
+ const $btn = cy.$$('#button')
+
+ $btn.get(0).addEventListener('pointerdown', (e) => {
+ e.preventDefault()
+
+ expect(e.defaultPrevented).to.be.true
})
+
+ attachMouseClickListeners({ $btn })
+
+ cy.get('#button').click().should('not.have.focus')
+
+ cy.getAll('$btn', 'pointerdown pointerup click').each(shouldBeCalledOnce)
+ cy.getAll('$btn', 'mousedown mouseup').each(shouldNotBeCalled)
+
})
it('sends a click event', (done) => {
@@ -304,14 +355,15 @@ describe('src/cy/commands/actions/click', () => {
})
})
- it('causes focusable elements to receive focus', (done) => {
- const $text = cy.$$(':text:first')
+ it('causes focusable elements to receive focus', () => {
- $text.focus(() => {
- done()
- })
+ const el = cy.$$(':text:first')
+
+ attachFocusListeners({ el })
- cy.get(':text:first').click()
+ cy.get(':text:first').click().should('have.focus')
+
+ cy.getAll('el', 'focus focusin').each(shouldBeCalledOnce)
})
it('does not fire a focus, mouseup, or click event when element has been removed on mousedown', () => {
@@ -319,26 +371,69 @@ describe('src/cy/commands/actions/click', () => {
$btn.on('mousedown', function () {
// synchronously remove this button
- return $(this).remove()
+ $(this).remove()
})
$btn.on('focus', () => {
- return fail('should not have gotten focus')
+ fail('should not have gotten focus')
})
$btn.on('focusin', () => {
- return fail('should not have gotten focusin')
+ fail('should not have gotten focusin')
})
$btn.on('mouseup', () => {
- return fail('should not have gotten mouseup')
+ fail('should not have gotten mouseup')
})
$btn.on('click', () => {
- return fail('should not have gotten click')
+ fail('should not have gotten click')
+ })
+
+ cy.contains('button').click()
+ })
+
+ it('events when element removed on pointerdown', () => {
+ const btn = cy.$$('button:first')
+ const div = cy.$$('div#tabindex')
+
+ attachFocusListeners({ btn })
+ attachMouseClickListeners({ btn, div })
+ attachMouseHoverListeners({ div })
+
+ btn.on('pointerdown', () => {
+ // synchronously remove this button
+
+ btn.remove()
+ })
+
+ // return
+ cy.contains('button').click()
+
+ cy.getAll('btn', 'pointerdown').each(shouldBeCalled)
+ cy.getAll('btn', 'mousedown mouseup').each(shouldNotBeCalled)
+ cy.getAll('div', 'pointerover pointerenter mouseover mouseenter pointerup mouseup').each(shouldBeCalled)
+ })
+
+ it('events when element removed on pointerover', () => {
+ const btn = cy.$$('button:first')
+ const div = cy.$$('div#tabindex')
+
+ // attachFocusListeners({ btn })
+ attachMouseClickListeners({ btn, div })
+ attachMouseHoverListeners({ btn, div })
+
+ btn.on('pointerover', () => {
+ // synchronously remove this button
+
+ btn.remove()
})
cy.contains('button').click()
+
+ cy.getAll('btn', 'pointerover pointerenter').each(shouldBeCalled)
+ cy.getAll('btn', 'pointerdown mousedown mouseover mouseenter').each(shouldNotBeCalled)
+ cy.getAll('div', 'pointerover pointerenter pointerdown mousedown pointerup mouseup click').each(shouldBeCalled)
})
it('does not fire a click when element has been removed on mouseup', () => {
@@ -346,19 +441,54 @@ describe('src/cy/commands/actions/click', () => {
$btn.on('mouseup', function () {
// synchronously remove this button
- return $(this).remove()
+ $(this).remove()
})
$btn.on('click', () => {
- return fail('should not have gotten click')
+ fail('should not have gotten click')
})
cy.contains('button').click()
})
- it('silences errors on unfocusable elements', () => {
- cy.$$('div:first')
+ it('does not fire a click or mouseup when element has been removed on pointerup', () => {
+ const $btn = cy.$$('button:first')
+
+ $btn.on('pointerup', function () {
+ // synchronously remove this button
+ $(this).remove()
+ })
+
+ ;['mouseup', 'click'].forEach((eventName) => {
+ $btn.on(eventName, () => {
+ fail(`should not have gotten ${eventName}`)
+ })
+ })
+
+ cy.contains('button').click()
+ })
+
+ it('sends modifiers', () => {
+
+ const btn = cy.$$('button:first')
+
+ attachMouseClickListeners({ btn })
+
+ cy.get('input:first').type('{ctrl}{shift}', { release: false })
+ cy.get('button:first').click()
+
+ cy.getAll('btn', 'pointerdown mousedown pointerup mouseup click').each((stub) => {
+ expect(stub).to.be.calledWithMatch({
+ shiftKey: true,
+ ctrlKey: true,
+ metaKey: false,
+ altKey: false,
+ })
+
+ })
+ })
+ it('silences errors on unfocusable elements', () => {
cy.get('div:first').click({ force: true })
})
@@ -366,7 +496,7 @@ describe('src/cy/commands/actions/click', () => {
let blurred = false
cy.$$('input:first').blur(() => {
- return blurred = true
+ blurred = true
})
cy
@@ -423,7 +553,7 @@ describe('src/cy/commands/actions/click', () => {
})
const clicked = cy.spy(() => {
- return stop()
+ stop()
})
const $anchors = cy.$$('#sequential-clicks a')
@@ -439,7 +569,7 @@ describe('src/cy/commands/actions/click', () => {
// is called
const timeout = cy.spy(cy.timeout)
- return _.delay(() => {
+ _.delay(() => {
// and we should have stopped clicking after 3
expect(clicked.callCount).to.eq(3)
@@ -454,24 +584,23 @@ describe('src/cy/commands/actions/click', () => {
})
it('serially clicks a collection', () => {
- let clicks = 0
+ const throttled = cy.stub().as('clickcount')
// create a throttled click function
// which proves we are clicking serially
- const throttled = _.throttle(() => {
- return clicks += 1
- }
- , 5, { leading: false })
+ const handleClick = cy.stub()
+ .callsFake(_.throttle(throttled, 0, { leading: false }))
+ .as('handleClick')
- const anchors = cy.$$('#sequential-clicks a')
+ const $anchors = cy.$$('#sequential-clicks a')
- anchors.click(throttled)
+ $anchors.on('click', handleClick)
- // make sure we're clicking multiple anchors
- expect(anchors.length).to.be.gt(1)
+ // make sure we're clicking multiple $anchors
+ expect($anchors.length).to.be.gt(1)
- cy.get('#sequential-clicks a').click({ multiple: true }).then(($anchors) => {
- expect($anchors.length).to.eq(clicks)
+ cy.get('#sequential-clicks a').click({ multiple: true }).then(($els) => {
+ expect($els).to.have.length(throttled.callCount)
})
})
@@ -622,6 +751,28 @@ describe('src/cy/commands/actions/click', () => {
})
})
+ it('can click inside an iframe', () => {
+ cy.get('iframe')
+ .should(($iframe) => {
+ // wait for iframe to load
+ expect($iframe.contents().find('body').html()).ok
+ })
+ .then(($iframe) => {
+ // cypress does not wrap this as a DOM element (does not wrap in jquery)
+ // return cy.wrap($iframe[0].contentDocument.body)
+ return cy.wrap($iframe.contents().find('body'))
+ })
+
+ .within(() => {
+ cy.get('a#hashchange')
+ // .should($el => $el[0].click())
+ .click()
+ })
+ .then(($body) => {
+ expect($body[0].ownerDocument.defaultView.location.hash).eq('#hashchange')
+ })
+ })
+
describe('actionability', () => {
it('can click on inline elements that wrap lines', () => {
@@ -636,7 +787,7 @@ describe('src/cy/commands/actions/click', () => {
const scrolled = []
cy.on('scrolled', ($el, type) => {
- return scrolled.push(type)
+ scrolled.push(type)
})
cy
@@ -650,17 +801,14 @@ describe('src/cy/commands/actions/click', () => {
const scrolled = []
cy.on('scrolled', ($el, type) => {
- return scrolled.push(type)
+ scrolled.push(type)
})
cy.viewport(1000, 660)
const $body = cy.$$('body')
- $body.css({
- padding: 0,
- margin: 0,
- }).children().remove()
+ $body.children().remove()
const $wrap = $('
')
.attr('id', 'flex-wrap')
@@ -764,15 +912,15 @@ describe('src/cy/commands/actions/click', () => {
let clicked = false
cy.on('scrolled', ($el, type) => {
- return scrolled.push(type)
+ scrolled.push(type)
})
cy.on('command:retry', () => {
- return retried = true
+ retried = true
})
$btn.on('click', () => {
- return clicked = true
+ clicked = true
})
cy.get('#button-covered-in-span').click({ force: true }).then(() => {
@@ -801,7 +949,7 @@ describe('src/cy/commands/actions/click', () => {
let retried = false
cy.on('scrolled', ($el, type) => {
- return scrolled.push(type)
+ scrolled.push(type)
})
cy.on('command:retry', _.after(3, () => {
@@ -822,9 +970,12 @@ describe('src/cy/commands/actions/click', () => {
})
it('scrolls the window past a fixed position element when being covered', () => {
+ const spy = cy.spy().as('mousedown')
+
$('
')
.attr('id', 'button-covered-in-nav')
.appendTo(cy.$$('#fixed-nav-test'))
+ .mousedown(spy)
$('
').css({
position: 'fixed',
@@ -838,14 +989,17 @@ describe('src/cy/commands/actions/click', () => {
const scrolled = []
cy.on('scrolled', ($el, type) => {
- return scrolled.push(type)
+ scrolled.push(type)
})
// - element scrollIntoView
// - element scrollIntoView (retry animation coords)
// - window
- cy.get('#button-covered-in-nav').click().then(() => {
+ cy.get('#button-covered-in-nav').click()
+ .then(() => {
expect(scrolled).to.deep.eq(['element', 'element', 'window'])
+ expect(spy.args[0][0]).property('clientX').closeTo(60, 2)
+ expect(spy.args[0][0]).property('clientY').eq(68)
})
})
@@ -875,7 +1029,7 @@ describe('src/cy/commands/actions/click', () => {
const scrolled = []
cy.on('scrolled', ($el, type) => {
- return scrolled.push(type)
+ scrolled.push(type)
})
// - element scrollIntoView
@@ -932,7 +1086,7 @@ describe('src/cy/commands/actions/click', () => {
const scrolled = []
cy.on('scrolled', ($el, type) => {
- return scrolled.push(type)
+ scrolled.push(type)
})
// - element scrollIntoView
@@ -966,7 +1120,7 @@ describe('src/cy/commands/actions/click', () => {
let clicks = 0
$btn.on('click', () => {
- return clicks += 1
+ clicks += 1
})
cy.on('command:retry', _.after(3, () => {
@@ -985,7 +1139,7 @@ describe('src/cy/commands/actions/click', () => {
let retries = 0
cy.on('command:retry', () => {
- return retries += 1
+ retries += 1
})
cy.stub(cy, 'ensureElementIsNotAnimating')
@@ -1062,13 +1216,13 @@ describe('src/cy/commands/actions/click', () => {
}
})
- return null
+ null
})
it('eventually passes the assertion', () => {
cy.$$('button:first').click(function () {
_.delay(() => {
- return $(this).addClass('clicked')
+ $(this).addClass('clicked')
}
, 50)
@@ -1088,7 +1242,7 @@ describe('src/cy/commands/actions/click', () => {
it('eventually passes the assertion on multiple buttons', () => {
cy.$$('button').click(function () {
_.delay(() => {
- return $(this).addClass('clicked')
+ $(this).addClass('clicked')
}
, 50)
@@ -1248,8 +1402,6 @@ describe('src/cy/commands/actions/click', () => {
it('can pass options along with position', (done) => {
const $btn = $('
').attr('id', 'button-covered-in-span').css({ height: 100, width: 100 }).prependTo(cy.$$('body'))
- $('
span').css({ position: 'absolute', left: $btn.offset().left + 80, top: $btn.offset().top + 80, padding: 5, display: 'inline-block', backgroundColor: 'yellow' }).appendTo(cy.$$('body'))
-
$btn.on('click', () => {
done()
})
@@ -1282,8 +1434,6 @@ describe('src/cy/commands/actions/click', () => {
it('can pass options along with x, y', (done) => {
const $btn = $('
').attr('id', 'button-covered-in-span').css({ height: 100, width: 100 }).prependTo(cy.$$('body'))
- $('
span').css({ position: 'absolute', left: $btn.offset().left + 50, top: $btn.offset().top + 65, padding: 5, display: 'inline-block', backgroundColor: 'yellow' }).appendTo(cy.$$('body'))
-
$btn.on('click', () => {
done()
})
@@ -1348,8 +1498,8 @@ describe('src/cy/commands/actions/click', () => {
const input = cy.$$('input:first')
_.each('focus focusin mousedown mouseup click'.split(' '), (event) => {
- return input.get(0).addEventListener(event, () => {
- return events.push(event)
+ input.get(0).addEventListener(event, () => {
+ events.push(event)
})
})
@@ -1403,27 +1553,17 @@ describe('src/cy/commands/actions/click', () => {
expect(onFocus).not.to.be.called
})
})
- })
-
- // it "events", ->
- // $btn = cy.$$("button")
- // win = $(cy.state("window"))
-
- // _.each {"btn": btn, "win": win}, (type, key) ->
- // _.each "focus mousedown mouseup click".split(" "), (event) ->
- // # _.each "focus focusin focusout mousedown mouseup click".split(" "), (event) ->
- // type.get(0).addEventListener event, (e) ->
- // if key is "btn"
- // # e.preventDefault()
- // e.stopPropagation()
-
- // console.log "#{key} #{event}", e
- // $btn.on "mousedown", (e) ->
- // console.log("btn mousedown")
- // e.preventDefault()
-
- // win.on "mousedown", -> console.log("win mousedown")
+ it('will fire pointerdown event', () => {
+ // cy.get('input').eq(1).click()
+ // cy.get('input').eq(2).click()
+ // cy.get('input').eq(4).click()
+ cy.get('textarea:first').click()
+ // cy.get('input').eq(3).click()
+ cy.get('input:first').click()
+ // cy.get('input').eq(1).click()
+ })
+ })
describe('errors', () => {
beforeEach(function () {
@@ -1434,10 +1574,10 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
this.lastLog = log
- return this.logs.push(log)
+ this.logs.push(log)
})
- return null
+ null
})
it('throws when not a dom subject', (done) => {
@@ -1449,15 +1589,14 @@ describe('src/cy/commands/actions/click', () => {
})
it('throws when attempting to click multiple elements', (done) => {
- const num = cy.$$('button').length
cy.on('fail', (err) => {
- expect(err.message).to.eq(`cy.click() can only be called on a single element. Your subject contained ${num} elements. Pass { multiple: true } if you want to serially click each element.`)
+ expect(err.message).to.eq('cy.click() can only be called on a single element. Your subject contained 4 elements. Pass { multiple: true } if you want to serially click each element.')
done()
})
- cy.get('button').click()
+ cy.get('.badge-multi').click()
})
it('throws when subject is not in the document', (done) => {
@@ -1492,16 +1631,23 @@ describe('src/cy/commands/actions/click', () => {
cy.click()
})
+ // Array(1).fill().map(()=>
it('throws when any member of the subject isnt visible', function (done) {
- cy.timeout(250)
+
+ // sometimes the command will timeout early with
+ // Error: coordsHistory must be at least 2 sets of coords
+ cy.timeout(300)
cy.$$('#three-buttons button').show().last().hide()
cy.on('fail', (err) => {
- const { lastLog } = this
+ const { lastLog, logs } = this
+ const logsArr = logs.map((log) => {
+ return log.get().consoleProps()
+ })
- expect(this.logs.length).to.eq(4)
+ expect(logsArr).to.have.length(4)
expect(lastLog.get('error')).to.eq(err)
expect(err.message).to.include('cy.click() failed because this element is not visible')
@@ -1676,7 +1822,7 @@ describe('src/cy/commands/actions/click', () => {
let clicks = 0
cy.$$('button:first').on('click', () => {
- return clicks += 1
+ clicks += 1
})
cy.on('fail', (err) => {
@@ -1697,7 +1843,7 @@ describe('src/cy/commands/actions/click', () => {
expect(err.message).not.to.include('undefined')
expect(lastLog.get('name')).to.eq('assert')
expect(lastLog.get('state')).to.eq('failed')
- expect(lastLog.get('error')).to.be.an.instanceof(chai.AssertionError)
+ expect(lastLog.get('error')).to.be.an.instanceof(window.chai.AssertionError)
done()
})
@@ -1723,10 +1869,10 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
this.lastLog = log
- return this.logs.push(log)
+ this.logs.push(log)
})
- return null
+ null
})
it('logs immediately before resolving', (done) => {
@@ -1781,7 +1927,7 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
if (log.get('name') === 'click') {
- return clicks.push(log)
+ clicks.push(log)
}
})
@@ -1798,7 +1944,7 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
if (log.get('name') === 'click') {
- return logs.push(log)
+ logs.push(log)
}
})
@@ -1823,12 +1969,12 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
if (log.get('name') === 'click') {
- return logs.push(log)
+ logs.push(log)
}
})
cy.get('#three-buttons button').click({ multiple: true }).then(() => {
- return _.each(logs, (log) => {
+ _.each(logs, (log) => {
expect(log.get('state')).to.eq('passed')
expect(log.get('ended')).to.be.true
@@ -1857,7 +2003,7 @@ describe('src/cy/commands/actions/click', () => {
expect(logCoords.x).to.be.closeTo(fromWindow.x, 1) // ensure we are within 1
expect(logCoords.y).to.be.closeTo(fromWindow.y, 1) // ensure we are within 1
expect(console.Command).to.eq('click')
- expect(console['Applied To']).to.eq(lastLog.get('$el').get(0))
+ expect(console['Applied To'], 'applied to').to.eq(lastLog.get('$el').get(0))
expect(console.Elements).to.eq(1)
expect(console.Coords.x).to.be.closeTo(fromWindow.x, 1) // ensure we are within 1
@@ -1886,29 +2032,75 @@ describe('src/cy/commands/actions/click', () => {
})
cy.get('input:first').click().then(function () {
- expect(this.lastLog.invoke('consoleProps').groups()).to.deep.eq([
- {
- name: 'MouseDown',
- items: {
- preventedDefault: true,
- stoppedPropagation: true,
+
+ const consoleProps = this.lastLog.invoke('consoleProps')
+
+ expect(consoleProps.table[1]()).to.containSubset({
+ 'name': 'Mouse Move Events',
+ 'data': [
+ {
+ 'Event Name': 'pointerover',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
- },
- {
- name: 'MouseUp',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
+ {
+ 'Event Name': 'mouseover',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
- },
- {
- name: 'Click',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
+ {
+ 'Event Name': 'pointermove',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
- },
- ])
+ {
+ 'Event Name': 'mousemove',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ ],
+ })
+
+ expect(consoleProps.table[2]()).to.containSubset({
+ name: 'Mouse Click Events',
+ data: [
+ {
+ 'Event Name': 'pointerdown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'mousedown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': true,
+ 'Stopped Propagation?': true,
+ },
+ {
+ 'Event Name': 'pointerup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'click',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ ],
+ })
+
})
})
@@ -1918,27 +2110,36 @@ describe('src/cy/commands/actions/click', () => {
})
cy.get('input:first').click().then(function () {
- expect(this.lastLog.invoke('consoleProps').groups()).to.deep.eq([
+ expect(this.lastLog.invoke('consoleProps').table[2]().data).to.containSubset([
{
- name: 'MouseDown',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- },
+ 'Event Name': 'pointerdown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
{
- name: 'MouseUp',
- items: {
- preventedDefault: true,
- stoppedPropagation: true,
- },
+ 'Event Name': 'mousedown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
{
- name: 'Click',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- },
+ 'Event Name': 'pointerup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': true,
+ 'Stopped Propagation?': true,
+ },
+ {
+ 'Event Name': 'click',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
])
})
@@ -1950,29 +2151,106 @@ describe('src/cy/commands/actions/click', () => {
})
cy.get('input:first').click().then(function () {
- expect(this.lastLog.invoke('consoleProps').groups()).to.deep.eq([
+ expect(this.lastLog.invoke('consoleProps').table[2]().data).to.containSubset([
{
- name: 'MouseDown',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- },
+ 'Event Name': 'pointerdown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
{
- name: 'MouseUp',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- },
+ 'Event Name': 'mousedown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
},
{
- name: 'Click',
- items: {
- preventedDefault: true,
- stoppedPropagation: true,
- },
+ 'Event Name': 'pointerup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'click',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': true,
+ 'Stopped Propagation?': true,
+ },
+ ])
+ })
+ })
+
+ it('#consoleProps groups skips mouse move events if no mouse move', () => {
+ const btn = cy.$$('span#not-hidden')
+
+ attachMouseClickListeners({ btn })
+ attachMouseHoverListeners({ btn })
+
+ cy.get('span#not-hidden').click().click()
+
+ cy.getAll('btn', 'mousemove mouseover').each(shouldBeCalledOnce)
+ cy.getAll('btn', 'pointerdown mousedown pointerup mouseup click').each(shouldBeCalledNth(2))
+ .then(function () {
+
+ const { logs } = this
+ const logsArr = logs.map((x) => x.invoke('consoleProps'))
+
+ const lastClickProps = _.filter(logsArr, { Command: 'click' })[1]
+ const consoleProps = lastClickProps
+
+ expect(_.map(consoleProps.table, (x) => x())).to.containSubset([
+ {
+ 'name': 'Mouse Move Events (skipped)',
+ 'data': [],
+ },
+ {
+ 'name': 'Mouse Click Events',
+ 'data': [
+ {
+ 'Event Name': 'pointerdown',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'mousedown',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'pointerup',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'click',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ ],
},
])
+
})
})
@@ -1982,53 +2260,46 @@ describe('src/cy/commands/actions/click', () => {
})
cy.get('input:first').type('{ctrl}{shift}', { release: false }).click().then(function () {
- expect(this.lastLog.invoke('consoleProps').groups()).to.deep.eq([
+ expect(this.lastLog.invoke('consoleProps').table[2]().data).to.containSubset([
{
- name: 'MouseDown',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- modifiers: 'ctrl, shift',
- },
+ 'Event Name': 'pointerdown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': 'ctrl, shift',
+
},
{
- name: 'MouseUp',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- modifiers: 'ctrl, shift',
- },
+ 'Event Name': 'mousedown',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': 'ctrl, shift',
+
},
{
- name: 'Click',
- items: {
- preventedDefault: true,
- stoppedPropagation: true,
- modifiers: 'ctrl, shift',
- },
- },
- ])
-
- cy.get('body').type('{ctrl}')
- })
- }) // clear modifiers
+ 'Event Name': 'pointerup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': 'ctrl, shift',
- it('#consoleProps when no mouseup or click', () => {
- const $btn = cy.$$('button:first')
-
- $btn.on('mousedown', function () {
- // synchronously remove this button
- return $(this).remove()
- })
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': 'ctrl, shift',
- cy.contains('button').click().then(function () {
- expect(this.lastLog.invoke('consoleProps').groups()).to.deep.eq([
+ },
{
- name: 'MouseDown',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- },
+ 'Event Name': 'click',
+ 'Target Element': { id: 'input' },
+ 'Prevented Default?': true,
+ 'Stopped Propagation?': true,
+ 'Modifiers': 'ctrl, shift',
+
},
])
})
@@ -2039,24 +2310,45 @@ describe('src/cy/commands/actions/click', () => {
$btn.on('mouseup', function () {
// synchronously remove this button
- return $(this).remove()
+ $(this).remove()
})
cy.contains('button').click().then(function () {
- expect(this.lastLog.invoke('consoleProps').groups()).to.deep.eq([
+ expect(this.lastLog.invoke('consoleProps').table[2]().data).to.containSubset([
{
- name: 'MouseDown',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- },
+ 'Event Name': 'pointerdown',
+ 'Target Element': { id: 'button' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
},
{
- name: 'MouseUp',
- items: {
- preventedDefault: false,
- stoppedPropagation: false,
- },
+ 'Event Name': 'mousedown',
+ 'Target Element': { id: 'button' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'pointerup',
+ 'Target Element': { id: 'button' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': { id: 'button' },
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'click',
+ 'Target Element': '⚠️ not fired (Element was detached)',
+ 'Prevented Default?': null,
+ 'Stopped Propagation?': null,
+ 'Modifiers': null,
},
])
})
@@ -2067,11 +2359,11 @@ describe('src/cy/commands/actions/click', () => {
$btn.on('mouseup', function () {
// synchronously remove this button
- return $(this).remove()
+ $(this).remove()
})
$btn.on('click', () => {
- return fail('should not have gotten click')
+ fail('should not have gotten click')
})
cy.contains('button').click()
@@ -2093,7 +2385,7 @@ describe('src/cy/commands/actions/click', () => {
context('#dblclick', () => {
it('sends a dblclick event', (done) => {
- cy.$$('#button').dblclick(() => {
+ cy.$$('#button').on('dblclick', () => {
done()
})
@@ -2108,25 +2400,19 @@ describe('src/cy/commands/actions/click', () => {
})
})
- it('causes focusable elements to receive focus', (done) => {
- const $text = cy.$$(':text:first')
-
- $text.focus(() => {
- done()
- })
-
- cy.get(':text:first').dblclick()
+ it('causes focusable elements to receive focus', () => {
+ cy.get(':text:first').dblclick().should('have.focus')
})
it('silences errors on unfocusable elements', () => {
- cy.get('div:first').dblclick()
+ cy.get('div:first').dblclick({ force: true })
})
it('causes first focused element to receive blur', () => {
let blurred = false
cy.$$('input:first').blur(() => {
- return blurred = true
+ blurred = true
})
cy
@@ -2165,12 +2451,12 @@ describe('src/cy/commands/actions/click', () => {
})
})
- // NOTE: fix this once we implement aborting / restoring / reset
+ // TODO: fix this once we implement aborting / restoring / reset
it.skip('can cancel multiple dblclicks', function (done) {
let dblclicks = 0
const spy = this.sandbox.spy(() => {
- return this.Cypress.abort()
+ this.Cypress.abort()
})
// abort after the 3rd dblclick
@@ -2181,7 +2467,7 @@ describe('src/cy/commands/actions/click', () => {
anchors.dblclick(() => {
dblclicks += 1
- return dblclicked()
+ dblclicked()
})
// make sure we have at least 5 anchor links
@@ -2193,7 +2479,7 @@ describe('src/cy/commands/actions/click', () => {
// is called
const timeout = this.sandbox.spy(cy, '_timeout')
- return _.delay(() => {
+ _.delay(() => {
// abort should only have been called once
expect(spy.callCount).to.eq(1)
@@ -2210,25 +2496,95 @@ describe('src/cy/commands/actions/click', () => {
cy.get('#sequential-clicks a').dblclick()
})
+ it('serially dblclicks a collection of anchors to the top of the page', () => {
+
+ const throttled = cy.stub().as('clickcount')
+
+ // create a throttled click function
+ // which proves we are clicking serially
+ const handleClick = cy.stub()
+ .callsFake(_.throttle(throttled, 5, { leading: false }))
+ .as('handleClick')
+
+ const $anchors = cy.$$('#sequential-clicks a')
+
+ $anchors.on('click', handleClick)
+ cy.$$('div#dom').on('click', cy.stub().as('topClick'))
+ .on('dblclick', cy.stub().as('topDblclick'))
+
+ // make sure we're clicking multiple $anchors
+ expect($anchors.length).to.be.gt(1)
+
+ cy.get('#sequential-clicks a').dblclick({ multiple: true }).then(($els) => {
+ expect($els).to.have.length(throttled.callCount)
+ cy.get('@topDblclick').should('have.property', 'callCount', $els.length)
+ })
+ })
+
it('serially dblclicks a collection', () => {
- let dblclicks = 0
- // create a throttled dblclick function
- // which proves we are dblclicking serially
- const throttled = _.throttle(() => {
- return dblclicks += 1
- }
- , 5, { leading: false })
+ const throttled = cy.stub().as('clickcount')
- const anchors = cy.$$('#sequential-clicks a')
+ // create a throttled click function
+ // which proves we are clicking serially
+ const handleClick = cy.stub()
+ .callsFake(_.throttle(throttled, 5, { leading: false }))
+ .as('handleClick')
+
+ const $anchors = cy.$$('#three-buttons button')
+
+ $anchors.on('dblclick', handleClick)
+
+ // make sure we're clicking multiple $anchors
+ expect($anchors.length).to.be.gt(1)
+
+ cy.get('#three-buttons button').dblclick({ multiple: true }).then(($els) => {
+ expect($els).to.have.length(throttled.callCount)
+ })
+ })
+
+ it('correctly sets the detail property on mouse events', () => {
+ const btn = cy.$$('button:first')
+
+ attachMouseClickListeners({ btn })
+ attachMouseDblclickListeners({ btn })
+ cy.get('button:first').dblclick()
+ cy.getAll('btn', 'mousedown mouseup click').each((spy) => {
+ expect(spy.firstCall).calledWithMatch({ detail: 1 })
+ })
+
+ cy.getAll('btn', 'mousedown mouseup click').each((spy) => {
+ expect(spy.lastCall).to.be.calledWithMatch({ detail: 2 })
+ })
+
+ cy.getAll('btn', 'dblclick').each((spy) => {
+ expect(spy).to.be.calledOnce
+ expect(spy.firstCall).to.be.calledWithMatch({ detail: 2 })
+ })
+
+ // pointer events do not set change detail prop
+ cy.getAll('btn', 'pointerdown pointerup').each((spy) => {
+ expect(spy).to.be.calledWithMatch({ detail: 0 })
+ })
+ })
+
+ it('sends modifiers', () => {
- anchors.dblclick(throttled)
+ const btn = cy.$$('button:first')
- // make sure we're dblclicking multiple anchors
- expect(anchors.length).to.be.gt(1)
+ attachMouseClickListeners({ btn })
+ attachMouseDblclickListeners({ btn })
- cy.get('#sequential-clicks a').dblclick().then(($anchors) => {
- expect($anchors.length).to.eq(dblclicks)
+ cy.get('input:first').type('{ctrl}{shift}', { release: false })
+ cy.get('button:first').dblclick()
+
+ cy.getAll('btn', 'pointerdown mousedown pointerup mouseup click dblclick').each((stub) => {
+ expect(stub).to.be.calledWithMatch({
+ shiftKey: true,
+ ctrlKey: true,
+ metaKey: false,
+ altKey: false,
+ })
})
})
@@ -2257,10 +2613,10 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
this.lastLog = log
- return this.logs.push(log)
+ this.logs.push(log)
})
- return null
+ null
})
it('throws when not a dom subject', (done) => {
@@ -2291,18 +2647,6 @@ describe('src/cy/commands/actions/click', () => {
cy.get('button:first').dblclick().dblclick()
})
- it('throws when any member of the subject isnt visible', (done) => {
- cy.$$('button').slice(0, 3).show().last().hide()
-
- cy.on('fail', (err) => {
- expect(err.message).to.include('cy.dblclick() failed because this element is not visible')
-
- done()
- })
-
- cy.get('button').invoke('slice', 0, 3).dblclick()
- })
-
it('logs once when not dom subject', function (done) {
cy.on('fail', (err) => {
const { lastLog } = this
@@ -2317,12 +2661,15 @@ describe('src/cy/commands/actions/click', () => {
})
it('throws when any member of the subject isnt visible', function (done) {
+ cy.timeout(600)
cy.$$('#three-buttons button').show().last().hide()
cy.on('fail', (err) => {
const { lastLog } = this
- expect(this.logs.length).to.eq(4)
+ const logs = _.cloneDeep(this.logs)
+
+ expect(logs).to.have.length(4)
expect(lastLog.get('error')).to.eq(err)
expect(err.message).to.include('cy.dblclick() failed because this element is not visible')
@@ -2340,10 +2687,10 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
this.lastLog = log
- return this.logs.push(log)
+ this.logs.push(log)
})
- return null
+ null
})
it('logs immediately before resolving', (done) => {
@@ -2365,9 +2712,9 @@ describe('src/cy/commands/actions/click', () => {
cy.get('button:first').dblclick().then(function () {
const { lastLog } = this
- expect(lastLog.get('snapshots').length).to.eq(1)
-
- expect(lastLog.get('snapshots')[0]).to.be.an('object')
+ expect(lastLog.get('snapshots')).to.have.length(2)
+ expect(lastLog.get('snapshots')[0]).to.containSubset({ name: 'before' })
+ expect(lastLog.get('snapshots')[1]).to.containSubset({ name: 'after' })
})
})
@@ -2383,7 +2730,7 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
if (log.get('name') === 'dblclick') {
- return dblclicks.push(log)
+ dblclicks.push(log)
}
})
@@ -2400,7 +2747,7 @@ describe('src/cy/commands/actions/click', () => {
cy.on('log:added', (attrs, log) => {
if (log.get('name') === 'dblclick') {
- return logs.push(log)
+ logs.push(log)
}
})
@@ -2418,13 +2765,1283 @@ describe('src/cy/commands/actions/click', () => {
cy.get('button').first().dblclick().then(function () {
const { lastLog } = this
- expect(lastLog.invoke('consoleProps')).to.deep.eq({
- Command: 'dblclick',
- 'Applied To': lastLog.get('$el').get(0),
- Elements: 1,
+ const consoleProps = lastLog.invoke('consoleProps')
+
+ expect(consoleProps).to.containSubset({
+ 'Command': 'dblclick',
+ 'Applied To': {},
+ 'Elements': 1,
+ 'Coords': {
+ 'x': 34,
+ 'y': 548,
+ },
+ 'Options': {
+ 'multiple': true,
+ },
+ 'table': {},
})
- })
- })
- })
- })
-})
+
+ const tables = _.map(consoleProps.table, ((x) => x()))
+
+ expect(tables).to.containSubset([
+ {
+ 'name': 'Mouse Move Events',
+ 'data': [
+ {
+ 'Event Name': 'pointerover',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'mouseover',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'pointermove',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ {
+ 'Event Name': 'mousemove',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ },
+ ],
+ },
+ {
+ 'name': 'Mouse Click Events',
+ 'data': [
+ {
+ 'Event Name': 'pointerdown',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'mousedown',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'pointerup',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'click',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'pointerdown',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'mousedown',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'pointerup',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'mouseup',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ {
+ 'Event Name': 'click',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ ],
+ },
+ {
+ 'name': 'Mouse Dblclick Event',
+ 'data': [
+ {
+ 'Event Name': 'dblclick',
+ 'Target Element': {},
+ 'Prevented Default?': false,
+ 'Stopped Propagation?': false,
+ 'Modifiers': null,
+ },
+ ],
+ },
+ ])
+ })
+ })
+ })
+ })
+
+ context('#rightclick', () => {
+
+ it('can rightclick', () => {
+ const el = cy.$$('button:first')
+
+ attachMouseClickListeners({ el })
+ attachContextmenuListeners({ el })
+
+ cy.get('button:first').rightclick().should('have.focus')
+
+ cy.getAll('el', 'pointerdown mousedown contextmenu pointerup mouseup').each(shouldBeCalled)
+ cy.getAll('el', 'click').each(shouldNotBeCalled)
+
+ cy.getAll('el', 'pointerdown mousedown pointerup mouseup').each((stub) => {
+ expect(stub.firstCall.args[0]).to.containSubset({
+ button: 2,
+ buttons: 2,
+ which: 3,
+ })
+ })
+
+ cy.getAll('el', 'contextmenu').each((stub) => {
+ expect(stub.firstCall.args[0]).to.containSubset({
+ altKey: false,
+ bubbles: true,
+ target: el.get(0),
+ button: 2,
+ buttons: 2,
+ cancelable: true,
+ data: undefined,
+ detail: 0,
+ eventPhase: 2,
+ handleObj: { type: 'contextmenu', origType: 'contextmenu', data: undefined },
+ relatedTarget: null,
+ shiftKey: false,
+ type: 'contextmenu',
+ view: cy.state('window'),
+ which: 3,
+ })
+ })
+ })
+
+ it('can rightclick disabled', () => {
+ const el = cy.$$('input:first')
+
+ el.get(0).disabled = true
+
+ attachMouseClickListeners({ el })
+ attachFocusListeners({ el })
+ attachContextmenuListeners({ el })
+
+ cy.get('input:first').rightclick({ force: true })
+
+ cy.getAll('el', 'mousedown contextmenu mouseup').each(shouldNotBeCalled)
+ cy.getAll('el', 'pointerdown pointerup').each(shouldBeCalled)
+ })
+
+ it('rightclick cancel contextmenu', () => {
+ const el = cy.$$('button:first')
+
+ // canceling contextmenu prevents the native contextmenu
+ // likely we want to call attention to this, since we cannot
+ // reproduce the native contextmenu
+ el.on('contextmenu', () => false)
+
+ attachMouseClickListeners({ el })
+ attachFocusListeners({ el })
+ attachContextmenuListeners({ el })
+
+ cy.get('button:first').rightclick().should('have.focus')
+
+ cy.getAll('el', 'pointerdown mousedown contextmenu pointerup mouseup').each(shouldBeCalled)
+ cy.getAll('el', 'click').each(shouldNotBeCalled)
+ })
+
+ it('rightclick cancel mousedown', () => {
+ const el = cy.$$('button:first')
+
+ el.on('mousedown', () => false)
+
+ attachMouseClickListeners({ el })
+ attachFocusListeners({ el })
+ attachContextmenuListeners({ el })
+
+ cy.get('button:first').rightclick().should('not.have.focus')
+
+ cy.getAll('el', 'pointerdown mousedown contextmenu pointerup mouseup').each(shouldBeCalled)
+ cy.getAll('el', 'focus click').each(shouldNotBeCalled)
+
+ })
+
+ it('rightclick cancel pointerdown', () => {
+ const el = cy.$$('button:first')
+
+ el.on('pointerdown', () => false)
+
+ attachMouseClickListeners({ el })
+ attachFocusListeners({ el })
+ attachContextmenuListeners({ el })
+
+ cy.get('button:first').rightclick()
+
+ cy.getAll('el', 'pointerdown pointerup contextmenu').each(shouldBeCalled)
+ cy.getAll('el', 'mousedown mouseup').each(shouldNotBeCalled)
+
+ })
+
+ it('rightclick remove el on pointerdown', () => {
+ const el = cy.$$('button:first')
+
+ el.on('pointerdown', () => el.get(0).remove())
+
+ attachMouseClickListeners({ el })
+ attachFocusListeners({ el })
+ attachContextmenuListeners({ el })
+
+ cy.get('button:first').rightclick().should('not.exist')
+
+ cy.getAll('el', 'pointerdown').each(shouldBeCalled)
+ cy.getAll('el', 'mousedown mouseup contextmenu pointerup').each(shouldNotBeCalled)
+
+ })
+
+ it('rightclick remove el on mouseover', () => {
+ const el = cy.$$('button:first')
+ const el2 = cy.$$('div#tabindex')
+
+ el.on('mouseover', () => el.get(0).remove())
+
+ attachMouseClickListeners({ el, el2 })
+ attachMouseHoverListeners({ el, el2 })
+ attachFocusListeners({ el, el2 })
+ attachContextmenuListeners({ el, el2 })
+
+ cy.get('button:first').rightclick().should('not.exist')
+ cy.get(el2.selector).should('have.focus')
+
+ cy.getAll('el', 'pointerover mouseover').each(shouldBeCalledOnce)
+ cy.getAll('el', 'pointerdown mousedown pointerup mouseup contextmenu').each(shouldNotBeCalled)
+ cy.getAll('el2', 'focus pointerdown pointerup contextmenu').each(shouldBeCalled)
+
+ })
+
+ describe('errors', () => {
+ beforeEach(function () {
+ Cypress.config('defaultCommandTimeout', 100)
+
+ this.logs = []
+
+ cy.on('log:added', (attrs, log) => {
+ this.lastLog = log
+
+ this.logs.push(log)
+ })
+
+ null
+ })
+
+ it('throws when not a dom subject', (done) => {
+ cy.on('fail', () => {
+ done()
+ })
+
+ cy.rightclick()
+ })
+
+ it('throws when subject is not in the document', (done) => {
+ let rightclicked = 0
+
+ const $button = cy.$$('button:first').on('contextmenu', () => {
+ rightclicked += 1
+ $button.remove()
+
+ return false
+ })
+
+ cy.on('fail', (err) => {
+ expect(rightclicked).to.eq(1)
+ expect(err.message).to.include('cy.rightclick() failed because this element')
+
+ done()
+ })
+
+ cy.get('button:first').rightclick().rightclick()
+ })
+
+ it('logs once when not dom subject', function (done) {
+ cy.on('fail', (err) => {
+ const { lastLog } = this
+
+ expect(this.logs.length).to.eq(1)
+ expect(lastLog.get('error')).to.eq(err)
+
+ done()
+ })
+
+ cy.rightclick()
+ })
+
+ it('throws when any member of the subject isnt visible', function (done) {
+ cy.timeout(300)
+ cy.$$('#three-buttons button').show().last().hide()
+
+ cy.on('fail', (err) => {
+ const { lastLog } = this
+
+ expect(this.logs.length).to.eq(4)
+ expect(lastLog.get('error')).to.eq(err)
+ expect(err.message).to.include('cy.rightclick() failed because this element is not visible')
+
+ done()
+ })
+
+ cy.get('#three-buttons button').rightclick({ multiple: true })
+ })
+ })
+
+ describe('.log', () => {
+ beforeEach(function () {
+ this.logs = []
+
+ cy.on('log:added', (attrs, log) => {
+ this.lastLog = log
+
+ this.logs.push(log)
+ })
+
+ null
+ })
+
+ it('logs immediately before resolving', (done) => {
+ const $button = cy.$$('button:first')
+
+ cy.on('log:added', (attrs, log) => {
+ if (log.get('name') === 'rightclick') {
+ expect(log.get('state')).to.eq('pending')
+ expect(log.get('$el').get(0)).to.eq($button.get(0))
+
+ done()
+ }
+ })
+
+ cy.get('button:first').rightclick()
+ })
+
+ it('snapshots after clicking', () => {
+ cy.get('button:first').rightclick().then(function () {
+ const { lastLog } = this
+
+ expect(lastLog.get('snapshots')).to.have.length(2)
+ expect(lastLog.get('snapshots')[0]).to.containSubset({ name: 'before' })
+ expect(lastLog.get('snapshots')[1]).to.containSubset({ name: 'after' })
+ })
+ })
+
+ it('returns only the $el for the element of the subject that was rightclicked', () => {
+ const rightclicks = []
+
+ // append two buttons
+ const $button = () => {
+ return $('