[bug] no-value-attrs has been parsed to Empty String
jiangjiu opened this issue · comments
no-value-attrs has been parsed to Empty String, but i want it back to raw.
Details
script:
posthtml().process(input).then(result => console.log(result.html))input :
<p class="title" aaa bbb ccc>123</p>parsed:
<p class="title" aaa='' bbb='' ccc=''>123</p>Environment
ℹ️ Please provide information about your current environment.
| OS | node | npm/yarn | package |
|---|---|---|---|
| mac 10.12 | v8.9.3 | yarn 1.5.1 | latest |
i know browsers will ignore the empty string......but the template that i parsed is just a middle-layer-ast, my framework will process this template into the final html, same as Vue's template && vue-loader
https://github.com/posthtml/posthtml-render/blob/master/lib/index.js#L135
if (obj[key] === '') {
attr += ' ' + key
} else {
attr += ' ' + key + '="' + obj[key] + '"'
}Untested && maybe a better check then if (obj[key] === '') is needed and so on... :) Test it locally by editing node_modules/posthtml-render/lib/index.js at best and PR welcome
obviously the problem is in parsing process....
how can parser mark out attr and attr=""?
What's the problem with the attr: '' representation for {Boolean} attributes in the AST ? The alternative would be attr: true which would require changes to the generator (posthtml-render) and is potentially a breaking change for minimal benefit. Could you describe your use case a bit further please and can't the AST part not be handled by your framework ?
the problem is in parsing process, example:
script:
posthtml().process(input).then(result => console.log(result.html))
input:
ast:
output:
i need this transformed output as my framework's template....
but in my dsl, attr and attr="" have two different meanings....
so, if posthtml cannot meet my needs，please tell me...
and i have to change my work kit or fork it
The change to the generator should I proposed in my first comment should give you the following result
input.html
<div id="1" class="box" hidden></div>PostHTML AST
{
tag: 'div',
attrs: { id: '1', class: 'box', hidden: '' }
content: []
}with #263 (comment)
output.html
<div id="1" class="box" hidden></div>without #263 (comment) (Current)
output.html
<div id="1" class="box" hidden=""></div>The generator (posthtml-render) outputs {Boolean} attributes as attr='', which could be fixed by applying (in the direction of) my suggested changes
thanks for your help~
but i think i didn't point the key problem....
i can render a attr:true into a attr like this:
ast:
{
tag: 'div',
attrs: { id: '1', class: 'box', hidden:true}
content: []
}output:
<div id="1" class="box" hidden></div>that's cool, that's exactly what I want。but, that's the render process,.... now let's pay attention to parse process
from input to ast, parser cannot tell the diffrence from attr and attr=""
when i give a element like this:
<p emptyattr emptystring="">123</p>parsed ast:
{
tag: 'p',
attrs: { emptyattr: '', emptystring: ''}
content: ['123']
}that means: when posthtml parsed, i lost the diff between emptyattr and emptystring....
probably this option will suffice singletags ?
<div hidden>
{ hidden: '' } // PostHTML Parser (HTMLParser 2)
{ name: 'hidden', value: '' } // Parse5So this would need to be handled in posthtml-parser around here, but there is no way to distinguish between <div empty='' boolean> nevertheless due to the underlying parser. I personally don't think this is a valuable change and you should reconsider relying upon that logic...
yeah, i scaned parse5 && htmlparse2 's code, there is no way to distinguish between <div empty='' boolean> ...
thanks ~ i'll find how to get it works
