8000 fix(animation): progressEnd coercion is reset before onFinish (#28394) · ionic-team/ionic-framework@eae8162 · GitHub
[go: up one dir, main page]
Skip to content

Commit eae8162

Browse files
liamdebeasiliamdebeasi
authored
fix(animation): progressEnd coercion is reset before onFinish (#28394)
Issue number: resolves #28393 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Our animation library's value coercion is not reset before developer `onFinish` callbacks fire. This can lead to developers getting incorrect state when querying for `getDuration` or `getDirection` ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Internal value coercion is reset before developer `onFinish` callbacks fire. ## Does this introduce a breaking change? - [ ] Yes - [x] No I'm putting this in a minor release to minimize risk. This is not a breaking change, but there may be developers relying on this broken behavior to implement a workaround. <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Note: This change is needed for the toast swipe to dismiss feature (FW-2004)
1 parent 0e2797b commit eae8162

File tree

2 files changed

+30
-15
lines changed

2 files changed

+30
-15
lines changed

‎core/src/utils/animation/animation.ts

Lines changed: 13 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -579,6 +579,17 @@ export const createAnimation = (animationId?: string): Animation => {
579579
}
580580
});
581581

582+
/**
583+
* Clean up any value coercion before
584+
* the user callbacks fire otherwise
585+
* they may get stale values. For example,
586+
* if someone calls progressStart(0) the
587+
* animation may still be reversed.
588+
*/
589+
forceDurationValue = undefined;
590+
forceDirectionValue = undefined;
591+
forceDelayValue = undefined;
592+
582593
onFinishCallbacks.forEach((onFinishCallback) => {
583594
return onFinishCallback.c(currentStep, ani);
584595
});
@@ -826,21 +837,8 @@ export const createAnimation = (animationId?: string): Animation => {
826837
}
827838
}
828839

829-
if (playTo !== undefined) {
830-
onFinish(
831-
() => {
832-
forceDurationValue = undefined;
833-
forceDirectionValue = undefined;
834-
forceDelayValue = undefined;
835-
},
836-
{
837-
oneTimeCallback: true,
838-
}
839-
);
840-
841-
if (!parentAnimation) {
842-
play();
843-
}
840+
if (playTo !== undefined && !parentAnimation) {
841+
play();
844842
}
845843

846844
return ani;

‎core/src/utils/animation/test/animation.spec.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,23 @@ import { processKeyframes } from '../animation-utils';
44
import { getTimeGivenProgression } from '../cubic-bezier';
55

66
describe('Animation Class', () => {
7+
describe('progressEnd callbacks', () => {
8+
test('coerced state should be reset before onFinish runs', (done) => {
9+
const el = document.createElement('div');
10+
const animation = createAnimation()
11+
.addElement(el)
12+
.fromTo('transform', 'translateX(0px)', 'translateX(100px)')
13+
.duration(50);
14+
15+
animation
16+
.onFinish(() => {
17+
expect(animation.getDirection()).toBe('normal');
18+
expect(animation.getDuration()).toBe(50);
19+
done();
20+
})
21+
.progressEnd(0, 0.5, 10);
22+
});
23+
});
724
describe('play()', () => {
825
it('should resolve when the animation is cancelled', async () => {
926
// Tell Jest to expect 1 assertion for async code

0 commit comments

Comments
 (0)
0