Cypress jS set value of hidden input

Question

I am experimenting with cypressjs and I am trying to set a value on an hidden input. (I am using material ui, and with a select/search box).

I would like to know if it's possible somehow to set the value of a hidden input (this is what I have on the browser):

<input name="search" type="hidden" id="search-simple" 
 value="1234"

How can I replicate it in my tests? I have tried to use type with force:true but no luck.

cy.get('#search-simple').type('ddc66ac588c4ae5d70683cb16729a7e8', { force: true });

I also tried to simulate the whole interaction with the UI, but still didn't get it to work.

Thank you

Answer 1

By nature, Cypress gives you native Javascript access to the DOM.

In your case, you could do something like this:

cy.get('#search-simple').then(elem => {
    elem.val('some text');
});

Answer 2

You can use invoke function of Cypress:

cy.get('#search-simple').invoke('val', 'ddc66ac588c4ae5d70683cb16729a7e8')