Can't pass vetur plugin unit test

[xiaomingplus]

Before you submit an issue we recommend you drop into the Gitter community and ask any questions you have or mention any problems you've had getting started with prettyhtml.

🐛 Bug Report

since the 0.8.2 version seems can't pass the vetur unit test.(https://github.com/vuejs/vetur/blob/master/test/lsp/formatting/basic.test.ts),I think the 0.8.2`s update don't change the template behavior,but 0.8.1 version can pass the test unit ,0.8.2 can't.

I also run npx prettyhtml VueHNUserView.vue two times,the result is different.

Is it expect?

To Reproduce

Default config.

Steps to reproduce the behavior:
the input is copy from vetur unit test
https://github.com/vuejs/vetur/blob/master/test/fixture/client/formatting/VueHNUserView.vue
Paste your markup here:

<template>
  <div class="user-view">
    <template v-if="user">
      <h1>User : {{ user.id }}</h1>
      <ul class="meta">
        <li><span class="label">Created:</span> {{ user.created | timeAgo }} ago</li>
        <li><span class="label">Karma:</span> {{ user.karma }}</li>
        <li v-if="user.about" v-html="user.about" class="about"></li>
      </ul>
      <p class="links">
        <a :href="'https://news.ycombinator.com/submitted?id=' + user.id">submissions</a> |
        <a :href="'https://news.ycombinator.com/threads?id=' + user.id">comments</a>
      </p>
    </template>
    <template v-else-if="user === false">
      <h1>User not found.</h1>
    </template>
  </div>
</template>

Expected behavior

A clear and concise description of what you expected to happen.

Paste the results here:

<template>
  <div class="user-view">
    <template v-if="user">
      <h1>User : {{ user.id }}</h1>
      <ul class="meta">
        <li>
          <span class="label">Created:</span>
          {{ user.created | timeAgo }} ago
        </li>
        <li>
          <span class="label">Karma:</span>
          {{ user.karma }}
        </li>
        <li v-if="user.about" v-html="user.about" class="about"></li>
      </ul>
      <p class="links">
        <a :href="'https://news.ycombinator.com/submitted?id=' + user.id">submissions</a>|
        <a :href="'https://news.ycombinator.com/threads?id=' + user.id">comments</a>
      </p>
    </template>
    <template v-else-if="user === false">
      <h1>User not found.</h1>
    </template>
  </div>
</template>

Context

Vue

Your Environment

• Prettyhtml version: 0.8.2
• NodeJs version:8.12
• Environment name and version:
• Operating System and version:macos

[StarpTech]

That bug must be introduced with https://github.com/Prettyhtml/prettyhtml/releases/tag/v0.5.3 because it's the only place where we changed whitespace handling. I will investigate.

[xiaomingplus]

@StarpTech a tag end have a whitespace between |,is it expected?
vetur unit test don't have a whitespace.

<a :href="'https://news.ycombinator.com/submitted?id=' + user.id">submissions</a> |

[StarpTech]

Hi @xiaomingplus yes it is intended because that was a bug fixed with v0.5.3. In that case the formatter can't know the rendering context inline or block and in order to avoid issues we prevent if from removing.

e.g

   <p class="links">
        <a :href="'https://news.ycombinator.com/submitted?id=' + user.id">submissions</a> |
        <a :href="'https://news.ycombinator.com/threads?id=' + user.id">comments</a>
      </p>

is not the same as

   <p class="links">
        <a :href="'https://news.ycombinator.com/submitted?id=' + user.id">submissions</a>|
        <a :href="'https://news.ycombinator.com/threads?id=' + user.id">comments</a>
      </p>

[xiaomingplus]

@StarpTech ,so, you mean that vetur should change their unit test expected output?

[StarpTech]

@xiaomingplus yes

[xiaomingplus]

thanks, @StarpTech ,I'll give a pr to vetur~