adding test coverage for boolean and enum HTML attributes (#2544)

This commit is contained in:
Tony Sullivan 2022-02-07 20:14:26 +00:00 committed by GitHub
parent 73bf4d8bb8
commit 41b659b12e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 31 additions and 11 deletions

View file

@ -15,18 +15,25 @@ describe('Attributes', async () => {
const $ = cheerio.load(html);
const attrs = {
'false-str': 'false',
'true-str': 'true',
false: undefined,
true: 'true',
empty: '',
null: undefined,
undefined: undefined,
'false-str': { attribute: 'attr', value: 'false' },
'true-str': { attribute: 'attr', value: 'true' },
false: { attribute: 'attr', value: undefined },
true: { attribute: 'attr', value: 'true' },
empty: { attribute: 'attr', value: '' },
null: { attribute: 'attr', value: undefined },
undefined: { attribute: 'attr', value: undefined },
'html-boolean': { attribute: 'async', value: 'async' },
'html-boolean-true': { attribute: 'async', value: 'async' },
'html-boolean-false': { attribute: 'async', value: undefined },
'html-enum': { attribute: 'draggable', value: 'true' },
'html-enum-true': { attribute: 'draggable', value: 'true' },
'html-enum-false': { attribute: 'draggable', value: 'false' },
};
for (const [k, v] of Object.entries(attrs)) {
const attr = $(`#${k}`).attr('attr');
expect(attr).to.equal(v);
for (const id of Object.keys(attrs)) {
const { attribute, value } = attrs[id]
const attr = $(`#${id}`).attr(attribute);
expect(attr).to.equal(value);
}
});

View file

@ -5,4 +5,17 @@
<span id="empty" attr="" />
<span id="null" attr={null} />
<span id="undefined" attr={undefined} />
<!--
Per HTML spec, some attributes should be treated as booleans
These should always render <span async /> or <span /> (without a string value)
-->
<span id='html-boolean' async />
<span id='html-boolean-true' async={true} />
<span id='html-boolean-false' async={false} />
<!--
Other attributes should be treated as string enums
These should always render <span draggable="true" /> or <span draggable="false" />
-->
<span id='html-enum' draggable='true' />
<span id='html-enum-true' draggable={true} />
<span id='html-enum-false' draggable={false} />