fix(animations): only process element nodes through the animation engine (#15268)
Closes #15267 Closes #15268 PR Close #15268
This commit is contained in:
parent
bcc29ffdd1
commit
80075afe8a
|
@ -67,11 +67,18 @@ export class DomAnimationEngine {
|
||||||
}
|
}
|
||||||
|
|
||||||
onInsert(element: any, domFn: () => any): void {
|
onInsert(element: any, domFn: () => any): void {
|
||||||
this._flaggedInserts.add(element);
|
if (element['nodeType'] == 1) {
|
||||||
|
this._flaggedInserts.add(element);
|
||||||
|
}
|
||||||
domFn();
|
domFn();
|
||||||
}
|
}
|
||||||
|
|
||||||
onRemove(element: any, domFn: () => any): void {
|
onRemove(element: any, domFn: () => any): void {
|
||||||
|
if (element['nodeType'] != 1) {
|
||||||
|
domFn();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
let lookupRef = this._elementTriggerStates.get(element);
|
let lookupRef = this._elementTriggerStates.get(element);
|
||||||
if (lookupRef) {
|
if (lookupRef) {
|
||||||
const possibleTriggers = Object.keys(lookupRef);
|
const possibleTriggers = Object.keys(lookupRef);
|
||||||
|
|
|
@ -54,7 +54,9 @@ export class NoopAnimationEngine extends AnimationEngine {
|
||||||
|
|
||||||
onRemove(element: any, domFn: () => any): void {
|
onRemove(element: any, domFn: () => any): void {
|
||||||
domFn();
|
domFn();
|
||||||
this._flaggedRemovals.add(element);
|
if (element['nodeType'] == 1) {
|
||||||
|
this._flaggedRemovals.add(element);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
setProperty(element: any, property: string, value: any): void {
|
setProperty(element: any, property: string, value: any): void {
|
||||||
|
|
|
@ -328,6 +328,29 @@ export function main() {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('removals / insertions', () => {
|
||||||
|
it('should allow text nodes to be removed through the engine', () => {
|
||||||
|
const engine = makeEngine();
|
||||||
|
const node = document.createTextNode('hello');
|
||||||
|
element.appendChild(node);
|
||||||
|
|
||||||
|
let called = false;
|
||||||
|
engine.onRemove(node, () => called = true);
|
||||||
|
|
||||||
|
expect(called).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should allow text nodes to be inserted through the engine', () => {
|
||||||
|
const engine = makeEngine();
|
||||||
|
const node = document.createTextNode('hello');
|
||||||
|
|
||||||
|
let called = false;
|
||||||
|
engine.onInsert(node, () => called = true);
|
||||||
|
|
||||||
|
expect(called).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe('transition operations', () => {
|
describe('transition operations', () => {
|
||||||
it('should persist the styles on the element as actual styles once the animation is complete',
|
it('should persist the styles on the element as actual styles once the animation is complete',
|
||||||
() => {
|
() => {
|
||||||
|
|
|
@ -20,8 +20,8 @@ export function main() {
|
||||||
() => {
|
() => {
|
||||||
const engine = new NoopAnimationEngine();
|
const engine = new NoopAnimationEngine();
|
||||||
|
|
||||||
const elm1 = {};
|
const elm1 = {nodeType: 1};
|
||||||
const elm2 = {};
|
const elm2 = {nodeType: 1};
|
||||||
engine.onRemove(elm1, capture('1'));
|
engine.onRemove(elm1, capture('1'));
|
||||||
engine.onRemove(elm2, capture('2'));
|
engine.onRemove(elm2, capture('2'));
|
||||||
|
|
||||||
|
@ -158,7 +158,7 @@ export function main() {
|
||||||
|
|
||||||
it('should fire a removal listener even if the listener is deregistered prior to flush', () => {
|
it('should fire a removal listener even if the listener is deregistered prior to flush', () => {
|
||||||
const engine = new NoopAnimationEngine();
|
const engine = new NoopAnimationEngine();
|
||||||
const elm = {};
|
const elm = {nodeType: 1};
|
||||||
|
|
||||||
const fn = engine.listen(elm, 'trig', 'start', capture('removal listener'));
|
const fn = engine.listen(elm, 'trig', 'start', capture('removal listener'));
|
||||||
fn();
|
fn();
|
||||||
|
|
Loading…
Reference in New Issue