test(QDialog): add QDialog tests

[n05la3]

What kind of change does this PR introduce?

• Bugfix
• Feature
• Documentation
• Code style update
• Refactor
• Build-related changes
• Other, please describe:

Does this PR introduce a breaking change?

• Yes
• No

The PR fulfills these requirements:

• It's submitted to the dev branch (or v[X] branch)
• When resolving a specific issue, it's referenced in the PR's title (e.g. fix: #xxx[,#xxx], where "xxx" is the issue number)
• It's been tested on a Cordova (iOS, Android) app
• It's been tested on an Electron app
• Any necessary documentation has been added or updated in the docs or explained in the PR's description.

If adding a new feature, the PR's description includes:

• A convincing reason for adding this feature (to avoid wasting your time, it's best to start a new feature discussion first and wait for approval before working on it)

Other information:

[github-actions]

UI Tests Results

0 tests   0 ✅  0s ⏱️
0 suites  0 💤
2 files    0 ❌
2 errors

For more details on these parsing errors, see this check.

Results for commit e26f9ee.

♻️ This comment has been updated with latest results.

[IlCallo]

Really nice work!
Aside some dead code around and a couple readability fixes, everything seems fine

[n05la3]

I have resolved the issues with the PR.

As concerns the use-model-toggle, it was a race condition that caused the issues. After digging, I noticed inconsistencies between the tests and the code when testing the hide event. The hide function in QMenu.js looks something like this:

function handleHide (evt) {
  hidePortal() // The dialog is hidden

  // Some code here. It's how fast this happens that determines if the test will pass or fail

  emit('hide', evt)
}

While in the test looks something like this:

cy.dataCy('method-hide')
  .click({ force: true })
cy.dataCy('menu')
  .should('not.exist')
  .then(() => {
    expect(fn).to.be.called
  })

• First, there's no guarantee that the click is completed before checking if the menu no longer exists, this therefore creates a race condition and depends on how fast the hide method resolves. Normally, it should check that the menu existed before running the hide method. Otherwise, it will just depend on how fast things happen to pass or fail. In addition to this problem:
• Checking if menu no longer exists is not the right thing to do because the hidePortal gets called the hide event is emitted. So, the menu may disappear before the event is emitted. This should have been passing because things were happening so fast.

With the QDialog, it mainly needed to ensure that the dialog existed before continuing the tests. A few tests were flaky too and only passed depending on how fast things were happening. We had tests like this:

 cy.dataCy('dialog-page').then(() => {
 1)   cy.dataCy('input-field').focus()
 2)  model.value = true
  
    cy.withinDialog(() => {
      closeDialog()
    })
    cy.dataCy('input-field').should('have.focus')
})

It has a similar problem to the q-toggle-model. When run (1), we are not sure whether or not it succeeds. For instance, in some cases, after running (2), the backdrop will cover the page before completing the focus. So (1) may silently fail and the tests after that are false positives. Instead, this has been replaced with the more stable counterpart below:

cy.dataCy('input-field')
    .type('Hello')
  cy.dataCy('input-field')
    .should('have.value', 'Hello').then(() => {
      model.value = true

      cy.withinDialog(() => {
        closeDialogViaBackdrop()
      })
      getHostElement()
        .should('not.exist').then(() => {
          cy.dataCy('input-field')
            .should('have.focus')
        })
    })

I have made similar changes to the rest of QDialog tests to improve stability.

[IlCallo]

I left some comments to highlight some changes I did and explain to which pitfalls you need to pay attention

I didn't complete the refactor, but I marked with a comment up until where I did it
Good luck

[github-actions]

Build Results

JSON API

📜 No changes detected.

Types

📜 No changes detected.