How to use urlMatchesOriginProtectionSpace method in Cypress

I would assume you are just missing retries for fetching the iframe until the body is loaded. Simple get and should combo doesn't wait for this to happen. Official docs state you should use .its('body') when working with iframes, so try something like this:

cy.get('.aut-iframe').its('body').then((body) => { cy.wrap(body).should('...') }

Reference: https://www.cypress.io/blog/2020/02/12/working-with-iframes-in-cypress/#header

The values between tags like <li>15</li> are accessed on individual element with .invoke('text').

invoke('val') is for <input> and <textarea> elements.

But if you select multiple elements, the texts will mash together

cy.get('li')                  // multiple elements selected
  .invoke('text')             // joins all text together, result is "5153045"
  .should('eq', '5153045')    // passes

In your case it's ok, but feels a little clumsy. In another scenario you can get additional white space between texts which makes it harder to compare.

You can use jQuery to extract individual texts, and they can be trimmed to make a better match when extra white-space is present

cy.get('li')                                            
  .then($els => Cypress.$.map($els, (el) => el.innerText.trim())) // uses jQuery .map()
  .should(values => {
    expect(values).to.deep.eq(["5","15","30","45"])
  })

But if your dropdown items are fetched from an API, you should put as much of the calculation as possible inside the .should() callback, because Cypress retries until passing

cy.get('li')                                            
  .should($els => {                                              // retries here
    const values = [...$els].map(el => el.innerText.trim())      // uses Array .map()
    expect(values).to.deep.eq(["5","15","30","45"])
  })

The main difference is conceptual, but there are some practical considerations as well.

Fixtures are meant for files that are used only for your tests, e.g. placeholder test data, sample responses and so forth. In other terms, fixtures are files that would not be a part of your project if you didn't have tests.

For this end, fixtures provide some convenience utilities, such as piping them directly into cy.route():

cy.route('GET', '/users', 'fixture:users');

readFile() on the other hand is a generic method that you can use to read more or less anything. It is a good candidate if you need to read files that are a part of your regular project code, e.g. translations:

cy.readFile('translations/en_US.json').then(...);

Seems you're importing app variable on the test directly. This object is a different one than the one on your browser. You should make a global variable (or method) for getting your app variable directly from your browser

cy.window().its('app').then((app) => { 
   // your test with app var
})

Also you might want to use then() condition to ensure it checks it after. But this may not be necessary.

.click({ force: true }).then(() => {
   expect(displayMovieInfo).to.be.called;
});

Where is your page visit?

If it's here, it won't work

cy.visit(...)
cy.intercept('POST' , '*/api/Availability/*').as('availability') 
cy.wait('@availability').its('response.statusCode').should('eq', 200)

You need to set up the intercept before the app sends the api request.

cy.intercept('POST' , '*/api/Availability/*').as('availability') 
cy.visit(...)
cy.wait('@availability').its('response.statusCode').should('eq', 200)

You have two possibilities: one, this is a bug in Cypress, or two, you're handling events wrong.

The fundamental way that Cypress works is by running events through the in-browser APIs, not simulating actual keyboard or mouse actions (source from a Cypress employee) so you can only simulate individual events that the browser listens for. So I took a look at the way Cypress does it and found that people have had problems with it in the past. You can try the snippet at the end of the Github discussion in that link, I'm not sure if that might make it work.

In this case, you're simulating a Click event with Event.ctrlKey set to true. (Or at least: that's what you want to happen.) To debug this further, I would log the event itself, and check if the event.ctrlKey is set:

• If it is false - there you go, it's a bug in Cypress.
• If it is true, then Cypress is working fine, you're just listening to the ctrl/click events in unusual ways, and if you switch to something like this you'll be good.

Good luck, and let me know how it goes!

You can customise your expectations with should(), and this will automatically retry your assertions for either the specified timeout, or the global defaultCommandTimeout if none provided. In your case I could probably imagine wrapping your object, specify a timeout and then passing your logic to should:

cy.wrap(someFunction, {timeout: 25000}).should(someFunction => expect(someFunction()).to.eq(someValue))

Read more here: https://docs.cypress.io/api/commands/should.html#Function

I hope this helps.

before scanning the QR code on your mobile just take a screenshot of it and upload it on https://zxing.org this will decode and return you the otp secret id.

The API GET /{realmName}/users/{userId}/credentials

returned me otp-credential-id and extracted secret from zxing, now I am able to authenticate and run my cypress tests.

I can only guess that you have some cypress commands that must be completed before querying the selector. As cypress commands are asynchronous, your UI state is not ready when jquery is executed. Thus, you can make it executed synchronously with cypress commands as follows:

cy.then(() => {
   var elmText = Cypress.$('abc').eq(0).find('xyz').text()
   cy.log(elmText)
})