Custom tags are handled in block-formatting context

[jongio]

🐛 Bug Report

Whitespace in innerHTML is not preserved.

To Reproduce

When you format this:

<template>
 <div id="app">
  <div id="nav">
   <router-link to="/">Home</router-link> |
   <router-link to="/about">About</router-link>
  </div>
  <router-view />
 </div>
</template>

Expected behavior

The space after Home</router-link> should be preserved.

<template>
 <div id="app">
  <div id="nav">
   <router-link to="/">Home</router-link>|
   <router-link to="/about">About</router-link>
  </div>
  <router-view/>
 </div>
</template>

Context

• Angular
• Svelte
• [x ] Vue
• Riot
• HTML5 only

Your Environment

• Prettyhtml version:
• NodeJs version: 10.15.1
• Environment name and version: VS Code1.30.2
  61122f88f0bf01e2ac16bdb9e1bc4571755f5bd8
  x64
• Operating System and version: Windows

[StarpTech]

Hi @jongio the reason is that we handle custom-tags in case-insensitive context. I would accept a PR to handle all custom tags as case-sensitive. As a workaround you could do:

<template>
 <div id="app">
  <!--prettyhtml-preserve-whitespace-->
  <div id="nav">
   <router-link to="/">Home</router-link> |
   <router-link to="/about">About</router-link>
  </div>
  <router-view/>
 </div>
</template>

[jongio]

@StarpTech - Are you saying that the space is removed due to case sensitivity? I'm not following that, but I also don't know the code. To me, not sure that new title describes the issue.

[StarpTech]

Hi @jongio you're right the title wasn't accurate. For more informations see https://medium.com/@patrickbrosset/when-does-white-space-matter-in-html-b90e8a7cdd33

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.