Cypress assert contextmenu preventDefault true

Question

I'm trying to test that the context menu does not show when a user right clicks.

I've got cy.getByTestId('element-to-click').rightclick();

When I click on rightclick and see the Command output, I see is has an array of Mouse Events, one of them is Event Type: 'contextmenu' and has Prevented Default: true.

I don't know how to assert in Cypress that contextmenu has Prevented Default set to true.

Answer 1

I don't know why testing around events is so hard, but reverse-engineering the Cypress console table I came up with this.

const getClickEvents = (subject) => {
  const { mouse } = cy.devices
  const coords = Cypress.dom.getElementCoordinatesByPosition(subject)
  const clickEvents = mouse.click(coords.fromElViewport, subject[0])
  return clickEvents
}

cy.get('button#1')
  .then(getClickEvents)
  .should(clickEvents => {
    expect(clickEvents.click.preventedDefault).to.eq(true)  // passes
  })

cy.get('button#2')
  .then(getClickEvents)
  .should(clickEvents => {
    expect(clickEvents.click.preventedDefault).to.eq(false)  // passes
  })

where clickEvents is data for the whole table as shown in your question, so you can easily pick out properties to assert.