Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

slot value not reactive when nested (regression) #3354

Closed
halfnelson opened this issue Aug 5, 2019 · 2 comments
Closed

slot value not reactive when nested (regression) #3354

halfnelson opened this issue Aug 5, 2019 · 2 comments
Labels

Comments

@halfnelson
Copy link
Contributor

Describe the bug
It seems a value from a " let:" on a component with slots doesn't trigger an update when used as a prop on a slot... eg

<WithColourPicker let:colour>
      <slot titlecolour={colour} />	
</WithColourPicker>

changes that "WithColourPicker" makes to "colour" aren't causing the slot to rerender with new titlecolour.

To Reproduce
Working:
https://svelte.dev/repl/991c974902464e119edc540fd18a99cd?version=3.6.1
Broken:
https://svelte.dev/repl/991c974902464e119edc540fd18a99cd?version=3.7.0

Expected behavior
Expected:
In the repl, expected behaviour is that the heading colour changes and the text changes its wording to include the selected colour. (this can be seen in the 3.6.1 link)

What happens:
The text colour changes, but the wording doesn't change.

Severity
Svelte native uses nested slots like above in its rendering of List Views. This regression breaks svelte native :(

Additional context
Looking at generated code
in 3.7.0:

// ColouredTitle.svelte

const get_default_slot_changes = ({ colour }) => ({});
const get_default_slot_context = ({ colour }) => ({ titlecolour: colour });

p(changed, ctx) {
	if (default_slot && default_slot.p && changed.$$scope) {
		default_slot.p(get_slot_changes(default_slot_1, ctx, changed, get_default_slot_changes), get_slot_context(default_slot_1, ctx, get_default_slot_context));
 	}
}

whereas 3.6.1:

//ColouredTitle.svelte

const get_default_slot_changes = ({ colour }) => ({ titlecolour: colour });
const get_default_slot_context = ({ colour }) => ({ titlecolour: colour });

if (default_slot && default_slot.p && (changed.$$scope || changed.colour)) {
    default_slot.p(get_slot_changes(default_slot_1, ctx, changed, get_default_slot_changes), get_slot_context(default_slot_1, ctx, get_default_slot_context));
}

Note that 3.6.1 considers changed.colour enough to update the slot where 3.7.0 doesn't consider this relevant.

Diagnosis

I think this happens because although the let variable is added to the dependencies for the InlineComponentWrapper b2d9da3#diff-beaec73b844dfbe1d4a6ee6da477b182R165

They are ignored when processing the slot by this:
b2d9da3#diff-5f78860f62364bc95ba513ae1fdfdc3dR88

But I am unsure of the correct fix

@Rich-Harris
Copy link
Member

fixed in 3.7.1: https://svelte.dev/repl/991c974902464e119edc540fd18a99cd?version=3.7.1. thanks!

@halfnelson
Copy link
Contributor Author

Thanks for the awesomely quick turnaround Rich

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants