lucthev / collapse-whitespace

Remove all unnecessary whitespace from a DOM node.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Support for inline pre elements

martincizek opened this issue · comments

collapse-whitespace behaves perfectly for block PRE elements, such as the default <PRE> tag.

But there are use cases where users need preformatted behavior on inline elements. For example, GitLab's CSS for the <code> tag is set as white-space: pre-wrap;. The browser behavior is then as follows, but collapse-whitespace is not consistent with that.

<div class="test"><code>four    spaces</code></div>
<div class="result"><code>four    spaces</code></div>
<div class="test">Space <code>no space</code> more space</div>
<div class="result">Space <code>no space</code> more space</div>
<div class="test">Space <code> leading code space</code> more space</div>
<div class="result">Space <code> leading code space</code> more space</div>
<div class="test">Space <code>trailing code space </code> more space</div>
<div class="result">Space <code>trailing code space </code> more space</div>
<div class="test">Space <code>trailing code space </code><b> more space in tag</b></div>
<div class="result">Space <code>trailing code space </code><b> more space in tag</b></div>
<div class="test">Space <code>trailing code space </code> <b> more space after code and tag</b></div>
<div class="result">Space <code>trailing code space </code> <b>more space after code and tag</b></div>
<div class="test"><b>Space before tag </b><code>my code</code></div>
<div class="result"><b>Space before tag </b><code>my code</code></div>
<div class="test"><b>Space before tag and code </b> <code>my code</code></div>
<div class="result"><b>Space before tag and code </b><code>my code</code></div>