'Cypress if else conditional test

I am trying to include the below condition into my test but I can't seem to get it to work and receive the below error, any ideas why?

Essentially, I want to test that a input is / is not empty:

        cy.get(`[class^='input-module_field']`).eq(0).then(($input) => {
            if ($input.should('have.value', '')) {
                cy.get(`[class^='input-module_field']`).eq(0).should('be.visible').type(foo)
                cy.get(`[class^='input-module_field']`).eq(1).should('be.visible').type(bar)
                cy.get(`[class^='input-module_field']`).eq(2).should('be.visible').type(foo-bar)
                cy.get(`[class^='input-module_field']`).eq(3).should('be.visible').type(foo-bar-foo)
            } else {
                cy.get(`[class^='input-module_field']`).eq(1).should('be.visible').type(bar)
                cy.get(`[class^='input-module_field']`).eq(2).should('be.visible').type(foo-bar)
                cy.get(`[class^='input-module_field']`).eq(3).should('be.visible').type(foo-bar-foo)
            }
   })

The error i get:

$input.should is not a function


Solution 1:[1]

When yielded from a .then(), the $input variable is just a JQuery element, and can't use Cypress commands. In this case, even using a Cypress command, such as .should() wouldn't work, because that does not yield a boolean value for the if/else.

Instead, we'll want to use JQuery's .val() function.

...
if ($input.val()) { // if $input.val() returns an empty string, this evaluates to false
  // code to run if the $input element has a value
} else {
  // code to run if the $input element does not have a value. 
}
...

Note: I reversed the order of what you had, with the $input.val() === '' being the else, instead of the if.

Solution 2:[2]

The check can be on the value itself

cy.get(`[class^='input-module_field']`).eq(0)
  .then(($input) => {

    const field0Val = $input.val() || 'foo'    // if empty use "foo"

    cy.get(`[class^='input-module_field']`).eq(0).type(field0Val)
    cy.get(`[class^='input-module_field']`).eq(1).type('bar')
    cy.get(`[class^='input-module_field']`).eq(2).type('foo-bar')
    cy.get(`[class^='input-module_field']`).eq(3).type('foo-bar-foo')
  })

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 agoff
Solution 2 TesterDick