user9347168
user9347168

Reputation:

Cypress: Typing input element value (text) to log

I've got an input field whose text contents I need to verify. Now, verifying it works fine. Bug for some reason, I cannot for the life of me manage to type the value to cy.log(). I've done it before, but I'm unable to find the example. And I've been trying all variants of invoke('val'), 'value' and 'text', to no avail.

cy.get('[data-e2e-selector=byggrad]').eq(0)
      .within(() => {
        cy.get('[data-e2e-selector=adresserad]').eq(0)
          .within(() => {
            cy.get('[data-e2e-selector=etasjerad]').eq(0)
              .within(() => {
                cy.get('[data-e2e-selector=finansieringsobjektrad]').eq(boligrad)
                  .within(() => {
                    cy.get('input[data-e2e-selector=boligbetegnelse]').should('have.value', '123');
                    cy.log('BOLIGBETEGNELSE: ' + cy.get('input[data-e2e-selector=boligbetegnelse]').invoke('val'));
                    //cy.log('BOLIGBETEGNELSE: ' + cy.get('input[data-e2e-selector=boligbetegnelse]').invoke('value'));                    
                    //cy.log('BOLIGBETEGNELSE: ' + cy.get('input[data-e2e-selector=boligbetegnelse]').invoke('text'));
                  });
              });
          });
      });

Here's the cypress output:

enter image description here

enter image description here

enter image description here

The complete markup:

<input _ngcontent-pxm-c10="" class="hb-inputfelt hb-inputfelt--10tegn ng-pristine ng-valid ng-touched" data-e2e-selector="boligbetegnelse" ng-reflect-form="[object Object]" id="finansieringsobjekt-boligbetegnelse-319-H02-0">

Upvotes: 0

Views: 1300

Answers (2)

user12251399
user12251399

Reputation:

Since value it's an attribute of an input element.

You can find all properties for element: devtools -> find element in DOM -> right hand side find tab properties -> scroll down and find value property

  cy.get("input[data-e2e-selector=boligbetegnelse]").invoke('prop','value').then((value) => {
    cy.log(value);
});

Upvotes: 1

Steven Hardy
Steven Hardy

Reputation: 111

You need to chain off of the .invoke() call to get the value.

e.g.:

cy.get("matcher").invoke("val").then((value) => {
    cy.log(value);
});

Upvotes: 2

Related Questions