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

Time:01-28

this is the code of my element

<input type="text"  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

CodePudding user response:

Assuming that you want to get the value written in the text field, you can get it by invoking val.

cy.get('#someid')
  .invoke('val')
  .then((value) => {
    cy.log(value) //logs the value
  })

If you want to apply any assertion on the value, you can:

cy.get('#someid').should('have.value', 'your-value')

CodePudding user response:

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')
  
  •  Tags:  
  • Related