salesforce
Custom Events support in `lwc:spread` throws unknown public property error
Description
Using lwc:spread={apis} with onclick works since it's a global property, but custom events won't work. Ex: onbar.
Steps to Reproduce
https://stackblitz.com/edit/salesforce-lwc-qhg5sq?file=src%2Fmodules%2Fx%2Fapp%2Fapp.html,src%2Fmodules%2Fx%2Fapp%2Fapp.js
<lwc:component lwc:is={component} lwc:spread={apis}></lwc:component>
Expected Results
The event firing from the dynamic component should trigger the onbar function passed into lwc:spread object.
Actual Results
Error: [LWC warn]: Unknown public property "onbar" of element <x-dynamic>. This is either a typo on the corresponding attribute "onbar", or the attribute does not exist in this browser or DOM implementation.
Browsers Affected
All.
Version
- LWC: 8
Possible Solution
Probably to manually addEventListener each of the on prefixed keys in the object. Don't know if onclick and global ones like it need to be ignored?
Additional context/Screenshots Add any other context about the problem here. If applicable, add screenshots to help explain.
const foo = Symbol('foo');
//... inside of class
apis = {
[foo]: 'some value only accessible by knowing foo';
};
<lwc:component lwc:is={component} lwc:spread={apis}></lwc:component>
I don't have a use for this, but did notice that symbols are also not binded to the host element with lwc:spread. So it doesn't look to be binding all keys, possibly only keys with a string type.
Tracking this as teams within GUS are also affected by this issue. Slack thread for context, including a re-purposed StackBlitz example forked from @Templarian's original .
@nolanlawson let me know if filing another TD for this would be helpful, or commenting on the existing one.
