Asserting that an input element contains a specific value in Cypress

Question

I am trying to assert the following where propSizeSel is the CSS selector to my numerical input element:

cy.get(propSizeSel).clear().type(100)
    .should('contain', 100);

Unfortunately, this assertion fails in the following manner despite the input element accepting the value of 100.

As you can see the input element has accepted the value 100 as expected:

Why is it that I can't seem to make this simple assertion?

Answer 1

Please try with 100 in single quotes and in the assert, please use should('have.value', '100') instead of contain;

cy.get('propSizeSel').clear().type('100').should('have.value', '100');

or try asserting using a promise

cy.get('propSizeSel').clear().type('100').invoke('val')
    .then(val=>{    
      const myVal = val;      
      expect(myVal).to.equal('100');
    })