Skip to content

Commit

Permalink
scale transition duration by delta - fixes #1221
Browse files Browse the repository at this point in the history
  • Loading branch information
Rich-Harris committed Mar 15, 2018
1 parent 0ac7701 commit 140e227
Show file tree
Hide file tree
Showing 3 changed files with 31 additions and 1 deletion.
2 changes: 1 addition & 1 deletion src/shared/transitions.js
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ export function wrapTransition(component, node, fn, params, intro, outgroup) {
// when introing, discard old animations if there are any
return anim && (program.delta < 0 || !/__svelte/.test(anim));
})
.concat(program.name + ' ' + duration + 'ms linear 1 forwards')
.concat(program.name + ' ' + program.duration + 'ms linear 1 forwards')
.join(', ');
}

Expand Down
12 changes: 12 additions & 0 deletions test/runtime/samples/transition-css-duration/_config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
export default {
solo: true,
test(assert, component, target, window, raf) {
component.set({ visible: true });
const div = target.querySelector('div');

raf.tick(25);
component.set({ visible: false });

assert.ok(~div.style.animation.indexOf('25ms'));
},
};
18 changes: 18 additions & 0 deletions test/runtime/samples/transition-css-duration/main.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{{#if visible}}
<div transition:foo></div>
{{/if}}

<script>
export default {
transitions: {
foo() {
return {
duration: 100,
css: t => {
return `opacity: ${t}`;
}
};
}
}
};
</script>

0 comments on commit 140e227

Please sign in to comment.