Input has value

<input id="greeting" type="text" value="hello" />
<input id="empty" type="text" />
<!-- this input is filled 1 second after the start -->
<input id="dynamic" type="text" />
  setTimeout(() => {
    document.getElementById('dynamic').value = 'present'
  }, 1000)
input {
  display: block;

To confirm the input element has some value, we should first grab the value as a prop using have.prop assertion. This assertion yields the value of the property, and we can chain another assertion to confirm it.

// confirm the input has some value
  .should('have.prop', 'value')
  // yields "hello"
// confirm the second input has an empty value
  .should('have.prop', 'value')
  // yields ""
// confirm dynamic input gets its value
// after some delay using command retries
  .should('have.prop', 'value')
  // yields "" at first, then yields "present"
  // after the application sets it