Asserting text of element with &nbsp

Question

I need to check the text of a Div tag and ensure if it is showing the correct text of not

here is the HTML Code:

Here is the step definition i wrote to assert the content

    Given(/^offer summary section should display "([^"]*)" amount against "([^"]*)"$/, (charge, labelText) => {
    const parentElement = cy.get('.c-offer-summary > .c-offer-summary__ledger').children('.c-ledger__section').find('.c-ledger__row-name').contains(labelText).parent();
    parentElement.find('.c-ledger__row-amount').invoke('text').should('eq',charge);
});

But cypress is throwing an error:

I am not sure where i am going wrong !!! :(

any help is appreciated

Answer 1

Based on Maccurt's assertion (which gives more context to the assertion information printed in Cypress logs) and Hiram's replace function, I composed this assertion.

cy.get(".c-ledger__row-amount").invoke('text').then((text) => {
    expect(text.replace(/\u00a0/g, ' ')).equal('DKK 15.00');
});

It works well on my case. Here's a screenshot for the assertion result:

Answer 2

You could use Cypress's .contains() command which strips whitespaces:

cy.get('.c-ledger__row-amount').contains('DKK 15.00')

Or you can remove the space character then assert:

cy.get('.c-ledger__row-amount')
  .invoke('text')
  .invoke('replace', /\u00a0/g, ' ')
  .should('eq', 'DKK 15.00')