How to use _getFakeClientResponse method in Cypress

I have updated our recipe for static resource loading, see https://github.com/cypress-io/cypress-example-recipes/pull/363

To check if an image has finished loading, the simplest way is to check the image's naturalWidth or naturalHeight property.

// we can wait for the <img> element to appear
// but the image has not been loaded yet.
cy.get('[alt="delayed image"]')
.should('be.visible')
.and(($img) => {
  // "naturalWidth" and "naturalHeight" are set when the image loads
  expect($img[0].naturalWidth).to.be.greaterThan(0)
})

Alternatively, you can use performance entries to confirm that any static resource has finished loading, see the above pull request for the details.

First assign a className for your div, for example value1.

 <div className="value1">700</div>

Then:

cy.get(".value1").invoke('text').then(parseFloat).should('be.gte', 800)

Cypress has wait method, which will wait for given time. For more info here

Example:

(async function doWaitForDialogOpen() {
    await cy.wait(4000) // waits 4 seconds
    const $iframe = await cy.get('#iframeID0')
    Cypress.$($iframe)
   .find('html')
   .find('body')
   .find('#someId')
   .find('input')
   .type(100);
  // Do your next steps
 })();

Thanks to this post How to get the text input field value to a const and log that value in Cypress.io

I found the answer, it seems I should treat the datepiker input as a text input.

cy.get('input[name="Date"]').invoke('val').then((text) => {
    expect('08/05/2019').to.equal(text);
});

Thanks for all the comments. Here is the cypress code that worked for me:

   cy.get('body').type("MY BARCODE").trigger('keydown', { keyCode: 13, which: 13 })

This code creates an event of scan. Thanks!!!

You can accomplish this with Custom Commands.

Add this to your cypress/support/commands.js file:

Cypress.Commands.add("login", (username, password) => {
  cy.visit('http://www.demoapp.com')
  cy.contains('Log in')

  // Check that the user has indeed landed on the login page
  cy.url().should('include','/login')

  // Make a school selection
  cy.get('#school-selector-search-box')
    .type('Bristol Free School')
    // Click the suggestion
    .get('.suggestions > .ember-view.suggestion:nth-of-type(1) > .suggested-school- 
   name').click()

  // Enter a username at this step
  cy.get('#identification')
    .type(username)
    .should ('have.value', username)

  // Enter a password at this step
  cy.get('#password')
    .type(password)
    .should ('have.value', password)

  // Proceed to login to account
  cy.get('.actions > .btn').click()

  // Assert that Dashboard is visible
  cy.get('h1.main-header-title')
  cy.contains ('Dashboard')
})

Then you can call it from your test like this, notice that I used beforeEach, which will run the login before each test without you having to write it multiple times:

describe('Create Homework', function() {
  beforeEach(() => {
    cy.login('gdawson_4319c', 'demo');
  })

  it('Create New Assignment', function() {
    // Now only your test logic goes here
  })
})

You can use day.js to get the current date and format it accordingly.

const dayjs = require('dayjs')

//In test
cy.log(dayjs().format('DD/MM/YYYY'))  //Prints todays date 30/09/2021
cy.get('textfield').type(dayjs().format('DD/MM/YYYY')) //input today's date in DD/MM/YYYY format

You have to use then() instead of should() -

cy.get('p.text-lg').invoke('text').then((text) => {
    var splitText = text.split(' ')[5]
    expect(splitText).to.equal(291)
})

Solved: I found this that explains how to put cy.preserveOnce('<name-of-your-cookie>') in the beforeEach loop at start.

I'm putting this here for future reference.