Apply suggestions from code review

pull/7623/head
Simon H 4 years ago committed by GitHub
parent 735f113a1f
commit 150f745b6d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -670,7 +670,7 @@ Animates a `blur` filter alongside an element's opacity.
* `duration` (`number`, default 400) — milliseconds the transition lasts * `duration` (`number`, default 400) — milliseconds the transition lasts
* `easing` (`function`, default `cubicInOut`) — an [easing function](/docs#run-time-svelte-easing) * `easing` (`function`, default `cubicInOut`) — an [easing function](/docs#run-time-svelte-easing)
* `opacity` (`number`, default 0) - the opacity value to animate out to and in from * `opacity` (`number`, default 0) - the opacity value to animate out to and in from
* `amount` (`number|string`, default 5) - the size of the blur (support css units, for example: "4rem", numbers use px) * `amount` (`number | string`, default 5) - the size of the blur. Supports css units (for example: `"4rem"`). The default unit is `px`
```sv ```sv
<script> <script>
@ -705,8 +705,8 @@ Animates the x and y positions and the opacity of an element. `in` transitions a
* `delay` (`number`, default 0) — milliseconds before starting * `delay` (`number`, default 0) — milliseconds before starting
* `duration` (`number`, default 400) — milliseconds the transition lasts * `duration` (`number`, default 400) — milliseconds the transition lasts
* `easing` (`function`, default `cubicOut`) — an [easing function](/docs#run-time-svelte-easing) * `easing` (`function`, default `cubicOut`) — an [easing function](/docs#run-time-svelte-easing)
* `x` (`number|string`, default 0) - the x offset to animate out to and in from * `x` (`number | string`, default 0) - the x offset to animate out to and in from
* `y` (`number|string`, default 0) - the y offset to animate out to and in from * `y` (`number | string`, default 0) - the y offset to animate out to and in from
* `opacity` (`number`, default 0) - the opacity value to animate out to and in from * `opacity` (`number`, default 0) - the opacity value to animate out to and in from
x and y use `px` by default but support css units, for example `x: '100vw'` or `y: '50%'`. x and y use `px` by default but support css units, for example `x: '100vw'` or `y: '50%'`.

@ -190,14 +190,13 @@ export function action_destroyer(action_result) {
return action_result && is_function(action_result.destroy) ? action_result.destroy : noop; return action_result && is_function(action_result.destroy) ? action_result.destroy : noop;
} }
export function split_css_unit(value: number | string, fallback = 'px'): [number, string] { export function split_css_unit(value: number | string): [number, string] {
if (typeof value === 'number') { if (typeof value === 'number') {
return [value, fallback]; return [value, 'px'];
} }
const split = value?.match?.(/^\s*(-?[\d.]+)([^\s]*)\s*$/); const split = value?.match?.(/^\s*(-?[\d.]+)([^\s]*)\s*$/);
if (split) { if (split) {
return [parseFloat(split[1]), split[2] || fallback]; return [parseFloat(split[1]), split[2] || 'px'];
} }
console.warn('Failed to split', value); return [parseFloat(value), 'px'];
return [parseFloat(value), fallback];
} }

@ -21,34 +21,10 @@ describe('utils', () => {
assert.deepEqual(split_css_unit('10'), [10, 'px']); assert.deepEqual(split_css_unit('10'), [10, 'px']);
}); });
it('should use the fallback', () => {
assert.deepEqual(split_css_unit(100, '%'), [100, '%']);
assert.deepEqual(split_css_unit('100', '%'), [100, '%']);
});
it('should split the css notation into value and unit', () => { it('should split the css notation into value and unit', () => {
assert.deepEqual(split_css_unit('-50%'), [-50, '%']); assert.deepEqual(split_css_unit('-50%'), [-50, '%']);
assert.deepEqual(split_css_unit('0.1rem'), [0.1, 'rem']); assert.deepEqual(split_css_unit('0.1rem'), [0.1, 'rem']);
assert.deepEqual(split_css_unit('.1rem'), [0.1, 'rem']); assert.deepEqual(split_css_unit('.1rem'), [0.1, 'rem']);
}); });
it('should complain for invalid input', () => {
const warnings = [];
const warn = console.warn;
console.warn = (...args) => {
warnings.push(args);
};
split_css_unit('calc(100vw - 10rem)');
split_css_unit(undefined);
assert.deepEqual(split_css_unit('100 %'), [100, 'px']);
assert.deepEqual(warnings, [
['Failed to split', 'calc(100vw - 10rem)'],
['Failed to split', undefined],
['Failed to split', '100 %']
]);
console.warn = warn;
});
}); });
}); });

Loading…
Cancel
Save