chore: tighten style-object test assertions

Empty inputs (`[false, null]`, `{}`, etc.) now consistently drop the
attribute, so the assertions that accommodated either `null` or `''`
are tightened to expect `null` exactly. Stale commentary updated.
pull/18176/head
Mathias Picker 4 months ago
parent b5045f9341
commit fc5a41a960

@ -33,12 +33,11 @@ export default test({
assert.equal(get('nested').style.padding, '4px'); assert.equal(get('nested').style.padding, '4px');
assert.equal(get('nested').style.margin, '2px'); assert.equal(get('nested').style.margin, '2px');
// all entries falsy → attribute absent (or empty) // all entries falsy → attribute absent
assert.notOk(get('all-falsy').getAttribute('style')); assert.equal(get('all-falsy').getAttribute('style'), null);
// empty object → empty style attribute (parallels clsx({}) === '') // empty object → attribute absent
const empty_attr = get('empty-object').getAttribute('style'); assert.equal(get('empty-object').getAttribute('style'), null);
assert.ok(empty_attr === '' || empty_attr === null);
// conditional inline object: dropped when the gate is false // conditional inline object: dropped when the gate is false
assert.equal(get('conditional').style.padding, '4px'); assert.equal(get('conditional').style.padding, '4px');
@ -92,7 +91,7 @@ export default test({
// $derived gated by a condition: when falsy, no attribute should be emitted // $derived gated by a condition: when falsy, no attribute should be emitted
assert.notOk(get('derived-conditional').getAttribute('style')); assert.notOk(get('derived-conditional').getAttribute('style'));
// $derived combined with style: directive directive wins // $derived combined with style: directive, directive wins
assert.equal(get('derived-directive').style.color, 'blue'); assert.equal(get('derived-directive').style.color, 'blue');
assert.equal(get('derived-directive').style.padding, '2px'); assert.equal(get('derived-directive').style.padding, '2px');

@ -33,7 +33,7 @@
<!-- every entry is falsy → no style attribute --> <!-- every entry is falsy → no style attribute -->
<div id="all-falsy" style={[false, null, undefined, '']}></div> <div id="all-falsy" style={[false, null, undefined, '']}></div>
<!-- empty object → empty style attribute (matches clsx({}) = '') --> <!-- empty object → no style attribute -->
<div id="empty-object" style={{}}></div> <div id="empty-object" style={{}}></div>
<!-- conditional inline object: when the condition is false the whole object is dropped --> <!-- conditional inline object: when the condition is false the whole object is dropped -->
@ -70,7 +70,7 @@
<!-- $derived gated by a condition: when falsy, no attribute should be emitted --> <!-- $derived gated by a condition: when falsy, no attribute should be emitted -->
<div id="derived-conditional" style={derived_conditional}></div> <div id="derived-conditional" style={derived_conditional}></div>
<!-- $derived combined with style: directive directive must win --> <!-- $derived combined with style: directive, directive must win -->
<div id="derived-directive" style={derived_object} style:color="blue"></div> <div id="derived-directive" style={derived_object} style:color="blue"></div>
<!-- $derived inside spread --> <!-- $derived inside spread -->

Loading…
Cancel
Save