Skip to content

Conversation

@bfanger
Copy link
Contributor

@bfanger bfanger commented Feb 14, 2021

Real fix for #785

I've updated the REPL to make it extra clear what is happening.

Directive Nr. args Empty object
use 1 false
use={{}} 2 true
animate 3 true
animate={} 3 true
animate={{duration}} 3 false
transition 2 true
transition={{}} 2 true
transition={{duration}} 2 false

This demonstrates that unlike the use shorthand, the transition and animate shorthand pass an empty object as parameter.
<div transition:fade> is identical to <div transition:fade={{}}> as far as the svelte compiler is concerned.

This allows custom transitions like svelte-transitions-fade-scale:

function fadeScale(node, { delay = 0, duration = 200, easing = x => x, baseScale = 0 })

to work as shorthand <div transition:fadeScale> without causing Cannot read property 'duration' of undefined errors.

In svelte 3.32.0 the params got an empty object as default value = {}, this change hides the fact that svelte2tsx created the wrong type for the built-in transitions, silencing the "Expected 2 arguments, but got 1." error reported by svelte-check
(This is still a nice change, it makes reusing the built-in transitions with defaults easier)

@dummdidumm
Copy link
Member

I didn't initially always add the empty object because my fear is that people would create custom transitions/animations which don't expect an object as second parameter. Then again, since the compiler adds this in case nothing is passed in, I guess this change makes sense.

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 this pull request may close these issues.

2 participants