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

import variables conflicting with #each block variable #5834

Closed
hjalmar opened this issue Dec 29, 2020 · 2 comments · Fixed by #5839
Closed

import variables conflicting with #each block variable #5834

hjalmar opened this issue Dec 29, 2020 · 2 comments · Fixed by #5839

Comments

@hjalmar
Copy link

hjalmar commented Dec 29, 2020

Is this about svelte@next? This project is currently in a pre-release stage and breaking changes may occur at any time. Please do not post any kind of bug reports or questions on GitHub about it.
No.

Describe the bug
When importing an action that has the same name of the as in an each block, it breaks the import variable, replaces it, somehow bleeds out or isn't getting scoped properly.

Logs
Error message:
Cannot read property 'call' of undefined

To Reproduce
https://svelte.dev/repl/40e6e91f00bb43788baba1f34ee7f95c?version=3.31.0

Expected behavior
Each blocks should be scoped and not interfere with imported variables.

Information about your Svelte project:
Repl from svelte.dev

  • Chrome version 87.0.4280.88 (Official Build) (64-bit)
  • Windows 10
  • Svelte version 3.31
  • Rollup

Severity
Now that I'm aware there is no problem working around it, solutions and workarounds are in the repl comments and easy to fix by simply using non conflicting names. Tho for newer developers this might be one annoying unexpected interaction to track down.

Additional context
I'm not sure where else this might apply other than on actions and each loops or if this is a bug isolated to those interactions.

@dimfeld
Copy link
Contributor

dimfeld commented Dec 30, 2020

In a working case, the compiled JS just references the imported action variable directly. (e.g. action.call(...) if we change the #each variable's name)

In the broken case, it tries to use ctx[0].call(...) instead. The #each variable is assigned to ctx[0] inside the #each child context, but of course does not exist in the main component context and would not reference the correct thing anyway. So indeed, some state about name assignments inside the #each is being incorrectly referenced here when resolving use:action.

Notably, this appears to be limited to use: actions. Everything works fine if I alter the REPL to just define a component-level variable named action instead and use it in a template, whether it's static or in a reactive statement. And it does break if the action function is defined locally inside the component instead of imported from another file.

I'm not really familiar with this part of the compiler, but happy to take a look when I have time (probably next week) if nobody else can get to it first.

@Conduitry
Copy link
Member

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

Successfully merging a pull request may close this issue.

4 participants