salesforce / lwc

⚡️ LWC - A Blazing Fast, Enterprise-Grade Web Components Foundation
https://lwc.dev
Other
1.64k stars 393 forks source link

[SSR] `aria-*` attributes of dynamic `null`/`undefined` values render as strings #4788

Open nolanlawson opened 6 days ago

nolanlawson commented 6 days ago
<div aria-label={dynamic}></div>
<x-child aria-label={dynamic}></x-child>

As demonstrated in https://github.com/salesforce/lwc/pull/4787, if dynamic is undefined, then this renders (in engine-server):

<div></div>
<x-child aria-activedescendant="undefined"></x-child>

And for null:

<div></div>
<x-child aria-activedescendant="null"></x-child>

This is inconsistent at best and wrong at worst. We should probably omit the attribute in both cases.

wjhsf commented 6 days ago

Is this specific to ARIA attributes? All of them, standard, or non-standard? Does it impact regular attributes, global HTML attributes, @api attributes?

nolanlawson commented 6 days ago

Is this specific to ARIA attributes?

Dunno. Worth testing HTML global attributes and data-foo as well.

All of them, standard, or non-standard?

In this case the attributes are purely being used as attributes, so "standard vs nonstandard" doesn't apply. E.g. we have aria-labelledby here as an attribute, not our nonstandard ariaLabelledBy property.

@api

This would be another good thing to add tests for. I don't believe it should matter, but you never know.

nolanlawson commented 6 days ago

BTW this is not terribly important because, unless you have an element with id="undefined" or id="null" somewhere, then the effective difference between rendering aria-labelledby="undefined" and not rendering it at all is zero.