Open
Description
If we input the HTML output:
from the document into isomorphic-dompurify
, like this:
const res = DOMPurify.sanitize(`<code class="language-js">
<div class="code-line line-number highlight-line" line="1">
<span class="keyword">function</span>
<span class="function">fancyAlert</span><span class="punctuation">(</span
><span class="">arg</span><span class="punctuation">)</span>
<span class="punctuation">{</span>
</div>
<div class="code-line line-number highlight-line" line="2">
<span class="keyword">if</span>
<span class="punctuation">(</span>arg<span class="punctuation">)</span>
<span class="punctuation">{</span>
</div>
<div class="code-line line-number" line="3">
$<span class="punctuation">.</span><span class="function">facebox</span
><span class="punctuation">(</span><span class="punctuation">{</span> div<span class="">:</span>
<span class="string">'#foo'</span>
<span class="punctuation">}</span><span class="punctuation">)</span>
</div>
<div class="code-line line-number" line="4">
<span class="punctuation">}</span>
</div>
<div class="code-line line-number" line="5">
<span class="punctuation">}</span>
</div></code
>`)
console.log(res)
the output will be:
<code class="language-js"> <div class="code-line line-number highlight-line"> <span class="keyword">function</span> <span class="function">fancyAlert</span><span class="punctuation">(</span><span class="">arg</span><span class="punctuation">)</span> <span class="punctuation">{</span> </div> <div class="code-line line-number highlight-line"> <span class="keyword">if</span> <span class="punctuation">(</span>arg<span class="punctuation">)</span> <span class="punctuation">{</span> </div> <div class="code-line line-number"> $<span class="punctuation">.</span><span class="function">facebox</span><span class="punctuation">(</span><span class="punctuation">{</span> div<span class="">:</span> <span class="string">'#foo'</span> <span class="punctuation">}</span><span class="punctuation">)</span> </div> <div class="code-line line-number"> <span class="punctuation">}</span> </div> <div class="code-line line-number"> <span class="punctuation">}</span> </div></code>
It’s evident that the line attribute is removed by dompurify, as it is not a standard HTML attribute.
However, the removal of the line attribute means that content: attr(line);
will no longer work, which will result in the line numbers not being displayed.
Perhaps we can resolve this issue by replacing the line
attribute with a data-line
attribute.
Metadata
Metadata
Assignees
Labels
No labels