Different html elment textContent retrieved after creating Vue instance

Question

Different textContent values are retrieved before and after creating a Vue instance over an element.

Link to reproduce the issue

Check the console to see the different outputs.

The Vue instance is stripping off the white spaces characters therefore retrieving an empty string for thetextContent property of the nonscript element. Is there a way to prevent Vue to do that and retrieve the same value as before creating the instance?

I´m using Vue on an AEM project and the Image Core Component stops working when using multiple width renditions because of that.

Here the script that breaks after creating the Vue instance that encompass the whole page body.

AEM image.js

Answer 1

Have you tried using innerHTML instead of textContent something like so:

console.log(elAfterVueInstance.innerHTML);