Vuejs отображает избыточные пробелы в HTML

У меня проблема с рендерингом строк с помощью Vue. В настоящее время, если HTML-тег открывается и закрывается в разных строках, например.

<span class = "description">
    {{ text }}
</span>

он отображается следующим образом

<span class = "description">
            text
          </span>

Что приводит к document.querySelector('.description').textContent возвращает строку, содержащую лишние пробелы. Например.

"
          Text
        "

Я обнаружил, что если вы открываете и закрываете HTML-тег, содержащий строку в той же строке, проблема исчезнет. Например.

<span class = "description">{{ text }}</span>

Вопрос: Могу ли я каким-то образом заставить Vue отображать текст без дополнительных пробелов. без форматирует весь фактический HTML, то есть открывать и закрывать теги в разных строках? (Я не один работаю над этим проектом) В качестве альтернативы, могу ли я каким-то образом принудительно применить форматирование, как показано в последнем примере? В настоящее время мы используем ESLint и Prittier, но после тщательного поиска я не смог найти ничего подходящего для моего варианта использования.

Спасибо!

Больше контекста: Почему меня волнуют эти места? В наших тестах на селен я иногда нахожу элементы по тексту, и наличие этих пробелов делает это невозможным. Кроме того, я понимаю, что могу использовать css-селекторы, но некоторые элементы просто не имеют уникальных селекторов, поэтому я получаю их по тексту.

Package.json

  "dependencies": {
    "axios": "^0.18.0",
    "element-theme": "^2.0.1",
    "element-theme-chalk": "^2.4.11",
    "element-ui": "^2.13.0",
    "jwt-decode": "^2.2.0",
    "md5": "^2.2.1",
    "memoizee": "^0.4.14",
    "sass-loader": "^7.1.0",
    "sortablejs": "^1.10.2",
    "sweetalert2": "^8.16.3",
    "v-calendar": "^1.0.0-beta.23",
    "vue": "^2.6.11",
    "vue-flag-icon": "^1.0.6",
    "vue-i18n": "^8.8.0",
    "vue-json-pretty": "^1.6.3",
    "vue-tour": "^1.3.0",
    "vuedraggable": "^2.23.2",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "axios-mock-adapter": "^1.17.0",
    "babel-core": "^6.22.1",
    "babel-eslint": "^7.1.1",
    "babel-jest": "^21.0.2",
    "babel-loader": "^7.1.1",
    "babel-plugin-dynamic-import-node": "^1.2.0",
    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-preset-env": "^1.3.2",
    "babel-preset-stage-2": "^6.22.0",
    "babel-register": "^6.22.0",
    "bee-plugin": "^1.3.0",
    "chalk": "^2.0.1",
    "chromedriver": "^2.27.2",
    "copy-webpack-plugin": "^4.0.1",
    "cross-spawn": "^5.0.1",
    "css-loader": "^0.28.0",
    "eslint": "^3.19.0",
    "eslint-config-prettier": "^6.7.0",
    "eslint-config-standard": "^10.2.1",
    "eslint-friendly-formatter": "^3.0.0",
    "eslint-loader": "^1.7.1",
    "eslint-plugin-html": "^3.0.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-node": "^5.2.0",
    "eslint-plugin-prettier": "^3.1.1",
    "eslint-plugin-promise": "^3.4.0",
    "eslint-plugin-standard": "^3.0.1",
    "eslint-plugin-vue": "^6.0.1",
    "eventsource-polyfill": "^0.9.6",
    "extract-text-webpack-plugin": "^3.0.0",
    "file-loader": "^1.1.4",
    "friendly-errors-webpack-plugin": "^1.6.1",
    "google-maps-api-loader": "^1.0.0",
    "html-inject-script": "^2.0.0",
    "html-webpack-plugin": "^2.30.1",
    "jest": "^21.2.0",
    "jest-serializer-vue": "^0.3.0",
    "less": "^2.7.3",
    "less-loader": "^4.0.5",
    "lodash": "^4.17.20",
    "moment": "^2.24.0",
    "moment-timezone": "^0.5.26",
    "nightwatch": "^1.0.11",
    "node-notifier": "^5.1.2",
    "optimize-css-assets-webpack-plugin": "^3.2.0",
    "ora": "^1.2.0",
    "portfinder": "^1.0.13",
    "postcss-import": "^11.0.0",
    "postcss-loader": "^2.0.8",
    "prettier": "^1.19.1",
    "raven-js": "^3.22.1",
    "rimraf": "^2.6.0",
    "selenium-server": "^3.0.1",
    "semver": "^5.3.0",
    "shelljs": "^0.7.6",
    "svg-sprite-loader": "^3.6.2",
    "svgo": "^1.0.4",
    "svgo-loader": "^2",
    "uglifyjs-webpack-plugin": "^1.2.7",
    "url-loader": "^0.5.8",
    "v-click-outside": "^1.0.1",
    "vue-jest": "^1.0.2",
    "vue-loader": "^13.3.0",
    "vue-router": "^3",
    "vue-style-loader": "^3.0.1",
    "vue-template-compiler": "^2.6.11",
    "webpack": "^3.6.0",
    "webpack-bundle-analyzer": "^2.9.0",
    "webpack-dev-server": "^2.9.1",
    "webpack-merge": "^4.1.0"
  },

.prettierrc

{
  "trailingComma": "none",
  "tabWidth": 2,
  "semi": false,
  "singleQuote": true,
  "htmlWhiteSpaceSensitivity": "ignore"
}

.eslintrc.js

// https://eslint.org/docs/user-guide/configuring
module.exports = {
  root: true,
  parser: "vue-eslint-parser",
  parserOptions: {
    parser: "babel-eslint",
    sourceType: "module"
  },
  env: {
    browser: true,
    jquery: true
  },
  extends: [
    "plugin:prettier/recommended",
    "plugin:vue/recommended",
    "prettier/vue",
    "standard",
  ],
  plugins: ["vue"],
  rules: {
    "space-before-function-paren": "off",

    "vue/require-default-prop": "off",
    "vue/require-prop-types": "off",
    "vue/attributes-order": "off",
    "vue/order-in-components": "off",
    "vue/no-v-html": "off",
    "vue/require-v-for-key": "off",
    "vue/no-use-v-if-with-v-for": "off",
    "vue/return-in-computed-property": "off",
    "vue/require-valid-default-prop": "off",
    "vue/no-side-effects-in-computed-properties": "off",
    "vue/no-duplicate-attributes": "off",
    "vue/no-async-in-computed-properties": "off",
    "vue/mustache-interpolation-spacing": "error",
  }
};