Skip to content

Commit

Permalink
feat: allow non-numeric values to be tweened by snapping immediately …
Browse files Browse the repository at this point in the history
…to new value (#14941)
  • Loading branch information
Rich-Harris authored Jan 8, 2025
1 parent adee13d commit d245bab
Show file tree
Hide file tree
Showing 3 changed files with 28 additions and 1 deletion.
5 changes: 5 additions & 0 deletions .changeset/cool-apples-report.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': minor
---

feat: allow non-numeric values to be tweened by snapping immediately to new value
3 changes: 2 additions & 1 deletion packages/svelte/src/motion/tweened.js
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,8 @@ function get_interpolator(a, b) {
return (t) => a + t * delta;
}

throw new Error(`Cannot interpolate ${type} values`);
// for non-numeric values, snap to the final value immediately
return () => b;
}

/**
Expand Down
21 changes: 21 additions & 0 deletions packages/svelte/tests/motion/test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import '../helpers.js'; // for the matchMedia polyfill
import { describe, it, assert } from 'vitest';
import { get } from 'svelte/store';
import { spring, tweened, Tween } from 'svelte/motion';
import { raf } from '../animation-helpers.js';

describe('motion', () => {
describe('spring', () => {
Expand Down Expand Up @@ -38,6 +39,16 @@ describe('motion', () => {
size.update((v) => v + 10);
assert.equal(get(size), 20);
});

it('updates non-numeric values immediately', () => {
raf.reset();
const boolean = tweened(false);

boolean.set(true, { duration: 100 });

raf.tick(1);
assert.equal(get(boolean), true);
});
});

describe('Tween', () => {
Expand All @@ -47,6 +58,16 @@ describe('motion', () => {
size.set(100, { duration: 0 });
assert.equal(size.current, 100);
});

it('updates non-numeric values immediately', () => {
raf.reset();
const boolean = new Tween(false);

boolean.set(true, { duration: 100 });

raf.tick(1);
assert.equal(boolean.current, true);
});
});

it('updates correctly when initialized with a `null`-ish value', () => {
Expand Down

0 comments on commit d245bab

Please sign in to comment.