Description
Describe the bug
I had a bug report in LayerChart that took me a while to track down. It appears between 5.19.4 and 5.19.5 there was a change with reactivity for conditional function calls.
When labelAccessor(data) returns undefined, it will fallback to keyAccessor(data) but if data changes the result is not updated (but valueAccessor(data) and others are).
<slot name="tooltip" {...slotProps}>
<Tooltip.Root {...props.tooltip?.root} let:data>
<Tooltip.List {...props.tooltip?.list}>
<Tooltip.Item
label={labelAccessor(data) || keyAccessor(data)}
value={valueAccessor(data)}
color={cScale?.(c(data))}
{format}
{...props.tooltip?.item}
/>
</Tooltip.List>
</Tooltip.Root>
</slot>One workaround is to pull the values up into separate {@const}
<slot name="tooltip" {...slotProps}>
<Tooltip.Root {...props.tooltip?.root} let:data>
{@const label = labelAccessor(data)}
{@const key = keyAccessor(data)}
<Tooltip.List {...props.tooltip?.list}>
<Tooltip.Item
label={label || key}
value={valueAccessor(data)}
color={cScale?.(c(data))}
{format}
{...props.tooltip?.item}
/>
</Tooltip.List>
</Tooltip.Root>
</slot>But even more surprising is pulling up just the key value (but still use the same fallback) triggers the update.
<slot name="tooltip" {...slotProps}>
<Tooltip.Root {...props.tooltip?.root} let:data>
{@const key = keyAccessor(data)}
<Tooltip.List {...props.tooltip?.list}>
<Tooltip.Item
label={labelAccessor(data) || keyAccessor(data)}
value={valueAccessor(data)}
color={cScale?.(c(data))}
{format}
{...props.tooltip?.item}
/>
</Tooltip.List>
</Tooltip.Root>
</slot>The later is the workaround I added to LayerChart in 0.93.8
Reproduction
Running svelte: '^5.9.5' with layerchart: '0.93.7' and moving between PieChart arcs shows the issue (without the Tooltip unmounting).
See this repo created for the LayerChart issue (thanks @anatoliy-t7). See also the video in the original issue for a demonstration.
Logs
System Info
{
'svelte': '^5.9.5',
'layerchart': '0.93.7'
}Severity
blocking an upgrade