How to use insertLocalCssFiles method in Cypress

As @Naren says, the space is killing your selector.

You can use an alternate selector (assuming you cannot change the id)

cy.iframe('#podium-modal')
  .find('[id="Mobile Phone"]')
  .type('123456789')

You can open browser with different TZ from server by adding specific timezone before open, in this way

"scripts": {
  "cypress:open": "TZ=America/New_York cypress open",
  "cypress:run": "TZ=America/New_York cypress run"
}

If you write those 3 steps as individual functions you'll be able to achieve the same effect as what you're looking for:

login(user, pass){
   cy.visit(loginUrl)
   cy.get('#username').type(user)
   cy.get('#password').type(pass)
   return cy.contains('Submit').click()
}

stepTwo(){
   ... // Other stuff
}

stepThree(){
   ... // More stuff
}

Given('I log in as {string} with password {string}', function (username, password) {
   return login(username, password)
})

Given('some set up step', function () {
   login('bill.s.preston@wyldstallyns.com', 'bodacious')
   return stepTwo()
})

Given('another set up step', function () {
   login('theodore.logan@wyldstallyns.com', 'triumphant')
   stepTwo()
   return stepThree()
})

I got exactly same problem and after hours of research I found a workaround that solves this. It is not a real fix but it solves your issue and mine. Here are the steps I did:

Create a 4th spec file, call it main.spec.ts, inside this file do an import for the 3 spec files you have:

import './fillform.spec.js'
import './uploadphoto.spec.js'
import './result.spec.js'

In cypress.json file, add the following entry to allow to run only the main spec file:

"testFiles": ["main.spec.js"],

Now cypress run will work exactly as cypress open and all specs will run without closing the browser in between:

npx cypress run --headed --browser chrome

I believe your matcher is incorrect and includes an extra / following service. Your calls aren't coming in as /proxy/service/?myParam=myValue, but as /proxy/service?myParam=myValue. The following should intercept your request.

cy.intercept('proxy/service*').as('wms')
cy.wait('@wms).then(console.log)

Your commands file would have a command like this. Note that this will log the cy.wraps and you may want to pass log: false to suppress that if you choose. You can also add another agrument and have an if block for text to use data-testid with .contains()

Cypress.Commands.add(
  'byTestId',
  { prevSubject: 'optional' },
  (subject, id) => {
    if (subject) {
      return cy.wrap(subject).find(`[data-testid="${id}"]`)
    }
    return cy.get(`[data-testid="${id}"]`)
  },
)

This would be an application of the command.

cy.byTestId('first-id')
  // maybe some assertions here for visibility check
  .byTestId('id-inside-first-element')
  // maybe some assertions here for visibility check
  .byTestId('id-within-this-second-element')

You can simply use should to assert it doesn't exist, and Cypress will wait for the element until it's removed from DOM. If you need to override the default 4s timeout, you can pass it to the previous command:

cy.get( selector, { timeout: 10000 }).should("not.exist");

I've encountered this issue myself and we've tried many different things at work on our app. Even though it's something which needs to be adapted, we're quite happy with our current solution.

But before I get to the solution, let me explain why this is a hard problem to solve without simply having a long wait before we start testing.

First of all, we need to wait for our page to be ready. Luckily for us, Cypress does that for us.

Then, we could wait for Angular to be bootstraped. One way of being aware of that is by checking if getAllAngularRootElements is available on the window object. And yes this function is apparently there even in prod mode!

  cy.window()
    .its('getAllAngularRootElements' as any)
    .should('exist');

But this isn't a perfect solution especially if... You use lazy loading.

Just because Angular bootstraped your app doesn't mean all your lazy modules are loaded! And this is where it gets really unlikely to find an automatic way of waiting for exactly what you want to be ready.

So how do we start testing as soon as we can and in a safe way? In my opinion the best option to do so is to have a check after every cy.visit call and wait for one element around what you're about to test, to exist. Example:

cy.visit(`some-page`);

cy.get(
  '.some-class-around-what-I-want-to-test',
  { timeout: 15000 }
).should('exist');

// ... rest of the test goes here

The code above will load the page, wait for the element you're targetting to exist for a maximum of 15 seconds but the important thing to note is that as soon as this element is available, it'll consider that check successful and move on. So if your app takes 2 seconds to display that element, your tests will starts straight after!

If you want to make it less repetitive for all your tests, you can create a function to open a given page and wait for its content to be there before doing something else. Example:

// at the top of the test file
const openProfilePage = () => {
  cy.visit('profile');
  cy.get(
    '.profile',
    { timeout: 15000 }
  ).should('exist');
}

// in every tests after or in a before each
openProfilePage();

// test something else

This should work:

function formatString(text) {
    return text.replace('kr', '').replace('\u00A0','').trim();
}

Cypress.Commands.add('currency', (selector) => {
      cy.get(selector)
        .children()
        .eq(1)
        .invoke('text') // get text
        .then(formatString)
    });

But you can also use Cypress to achieve this using a regex string (the first example in this Cypress FAQ is like yours):

Cypress.Commands.add('currency', (selector) => {
      cy.get(selector)
        .should('have.text', '\d+[\u00A0]*')
    });

You can test out the regex here: https://regex101.com/r/YC4szy/1. It will match strings with a number, followed by a blank space, and any subsequent characters. You can get fancy with the regex to test what you want.

My last suggestion, if matching regex patterns doesn't help, is that you can wrap your cypress command in a function that takes text content as an argument, which you pass into the should('have.text', ...) line.