Extra whitespace when calling .text()

[mortyccp]

Subject of the issue

.text return extra whitespace

Steps to reproduce

1. Create a html with the following content

      <div class="VersionStatus__description"><span><strong>QA User</strong></span>
        <!----><span> created the story.</span></div>

2.Run a test with the following

expect(wrapper.find('.VersionStatus__description').text()).toBe(
      `QA User created the story.`
    )

Expected behaviour

The test shall passes.

Actual behaviour

The test failed with

    Expected: "QA User created the story."
    Received: "QA User  created the story."

Possible Solution

What are the alternative solutions? Please describe what else you have considered?

[lmiller1990]

Hi! We just use the underlying textContent property on the element, so we don't have any real control over what is returned - this is the default behavior in a browser. For this reason we won't be making any changes to this API.

I have also encountered this before, I think I used a regexp. Hopefully that helps!

[OJFord]

@lmiller1990 In the course of looking for this, I found argos-ci/jest-puppeteer#51; they initially said the same but ended up 'fixing' it and adding a separate regex-over-raw API. Would that be something you're open to?

This is a frequent frustration for me, often it's a seemingly innocuous change (even one performed by eslint), and then the tests fail because the line count/breaks in the source code are slightly different, despite it still rendering the same.

e.g. from:

You should really click <b-link
   propa
   propb
>here</b-link> now!

to:

You should really click
<b-link
  propa
  propb
>
  here
</b-link>
now!

and the text content changes from You should really click here now! to

You should really click

           here

now!

or similar.