Open nolanlawson opened 16 hours ago
Doing a warning here is up for grabs, but doing an error is trickier so would probably have to be done with API versioning.
The full list of Node
types is here:
Off the top of my head, the ones that are "valid" to have between the component (<x-inner>
above) and the element with the slot
attribute are If
, IfBlock
, ElseifBlock
, ElseBlock
. For ForBlock
and ScopedSlotFragment
I'm not sure.
@nolanlawson this warning would need to be ignored here due to fixtures added in #4689 right?
Example:
In the case above, the developer is probably confused because they seem to be trying to slot something into the
foo
slot of<x-inner>
, but since it's inside a<div>
, the whole<div>
is actually treated as the default slotted content, and theslot
attribute is effectively ignored. This works in all three of native shadow, synthetic shadow, and light DOM slots.There are valid cases where it's not at the top level, e.g.:
In this case, the
<span>
would truly go into thefoo
slot since the<template lwc:if>
is not a "real" element.We should enumerate all the cases where the
slot
attribute is valid or invalid when not at the top level and warn for it. Potentially in the future we could even throw an error to be more explicit.