quasar-testing

quasar-testing copied to clipboard

We're considering adding some new helper commands related to QDialog

• closeDialogViaEscKey

function closeDialogViaEscKey () {
  // Official way to escape `within` context
  // https://docs.cypress.io/api/commands/within#Temporarily-escape
  return cy.root().closest('body').type('{esc}')
}

Limitation: this only works in withinDialog context, as when using it outside it .root() will yeld "html" tag and Cypress won't be able to find anything with .closest('body') since it only searches upwards

We should find a way to make it work both inside and outside a within context I tried with cy.window() and cy.document() already, which I recalled worked fine in the past, but it seems like they changed that behavior

Maybe by using the Cypress.$('body') shortcut that we already use in portal-related commands? Even if it's an internal and undocumented feature AFAIK

• closeDialogViaBackdrop

function closeDialogViaBackdrop () {
  return cy.get('.q-dialog__backdrop').click({ force: true })
}

• assertPersistentDialogExists

function assertPersistentDialogExists () {
  cy.get('.q-dialog').should('not.have.attr', 'aria-modal', 'false')
}

This should be called automatically after the callback function of withinDialog completes, if persistent is set to true Unluckily, this actually doesn't work all the times and has a few limitations we need to address In particular, it doesn't address seamless dialogs use case (which always have 'aria-modal' equal to false) and dialogs without backdrop, which are equally not considered modals, and thus have 'aria-modal' equal to false

We should find a more reliable way to check for persistent dialogs, possibly even add a custom dedicated class into Quasar core for QDialog

• withinPersistentDialog

Just a convenience method to avoid the more verbose form of withinDialog

Before

cy.withinDialog({
  persistent: true,
  fn: () => {
    // ...
  }
})

After

cy.withinPersistentDialog(() => {
  // ...
})

As to making it work within both within context and without it in my experience I actually use cy.root().closest("html") as even it finds HTML closest still works on itself and it can go no further as this is the root node.