How to get an element value that is not showing in html code with Cypress?

Question

this is the code of my element

<input type="text" class="nameOfClass" id="someid" name="somename" maxlength="255" placeholder="justholder" ng-model="model" tooltip-placement="top" tooltip-trigger="mouseenter" tooltip-animation="false" style="">

as you can see there is no attribute value, but I can clearly see that there is text in that text field in web app I am trying to automate.

So my problem is, that I don't know how to get value of the text field. I've tried google chrome inspector to find where is the value but without any luck. Somewhere I read, that caching can causing this problem, but in the network console I can see the values in request response.

Thanks

Answer 1

If you are referring to type="text", that's not the text the user types in - it's an attribute that tells the input what values to allow.

You can also have type="number", type="date", type="color", etc

Checking that input is of type "text" would be done with this,

cy.get('input#someid').should('have.attr', 'type', 'text')

Checking the value property would be done like this

cy.get('input#someid')
  .type('entering a value')     // there's nothing in value yet
  .should('have.value', 'entering a value')