Skip to content

Commit 4c778cd

Browse files
thePunderWomanalxhub
thePunderWoman
authored and
alxhub
committed
perf(animations): made errors in the animations package tree shakeable (#45004)
This moves all the error strings into exported functions that can be tree shaken away. PR Close #45004
1 parent 5ac5967 commit 4c778cd

27 files changed

+527
-126
lines changed

‎goldens/public-api/animations/errors.md‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
## API Report File for "angular-srcs"
2+
3+
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
4+
5+
```ts
6+
7+
// @public
8+
export const enum RuntimeErrorCode {
9+
// (undocumented)
10+
ANIMATION_FAILED = 3502,
11+
// (undocumented)
12+
BUILDING_FAILED = 3501,
13+
// (undocumented)
14+
CREATE_ANIMATION_FAILED = 3504,
15+
// (undocumented)
16+
INVALID_CSS_UNIT_VALUE = 3005,
17+
// (undocumented)
18+
INVALID_DEFINITION = 3007,
19+
// (undocumented)
20+
INVALID_EXPRESSION = 3015,
21+
// (undocumented)
22+
INVALID_KEYFRAMES = 3011,
23+
// (undocumented)
24+
INVALID_NODE_TYPE = 3004,
25+
// (undocumented)
26+
INVALID_OFFSET = 3012,
27+
// (undocumented)
28+
INVALID_PARALLEL_ANIMATION = 3010,
29+
// (undocumented)
30+
INVALID_PARAM_VALUE = 3003,
31+
// (undocumented)
32+
INVALID_PROPERTY = 3009,
33+
// (undocumented)
34+
INVALID_QUERY = 3014,
35+
// (undocumented)
36+
INVALID_STAGGER = 3013,
37+
// (undocumented)
38+
INVALID_STATE = 3008,
39+
// (undocumented)
40+
INVALID_STYLE_PARAMS = 3001,
41+
// (undocumented)
42+
INVALID_STYLE_VALUE = 3002,
43+
// (undocumented)
44+
INVALID_TIMING_VALUE = 3000,
45+
// (undocumented)
46+
INVALID_TRANSITION_ALIAS = 3016,
47+
// (undocumented)
48+
INVALID_TRIGGER = 3006,
49+
// (undocumented)
50+
KEYFRAME_OFFSETS_OUT_OF_ORDER = 3200,
51+
// (undocumented)
52+
KEYFRAMES_MISSING_OFFSETS = 3202,
53+
// (undocumented)
54+
MISSING_EVENT = 3303,
55+
// (undocumented)
56+
MISSING_OR_DESTROYED_ANIMATION = 3300,
57+
// (undocumented)
58+
MISSING_PLAYER = 3301,
59+
// (undocumented)
60+
MISSING_TRIGGER = 3302,
61+
// (undocumented)
62+
NEGATIVE_DELAY_VALUE = 3101,
63+
// (undocumented)
64+
NEGATIVE_STEP_VALUE = 3100,
65+
// (undocumented)
66+
REGISTRATION_FAILED = 3503,
67+
// (undocumented)
68+
TRANSITION_FAILED = 3505,
69+
// (undocumented)
70+
TRIGGER_BUILD_FAILED = 3404,
71+
// (undocumented)
72+
TRIGGER_PARSING_FAILED = 3403,
73+
// (undocumented)
74+
TRIGGER_TRANSITIONS_FAILED = 3402,
75+
// (undocumented)
76+
UNREGISTERED_TRIGGER = 3401,
77+
// (undocumented)
78+
UNSUPPORTED_TRIGGER_EVENT = 3400,
79+
// (undocumented)
80+
VALIDATION_FAILED = 3500
81+
}
82+
83+
// (No @packageDocumentation comment for this package)
84+
85+
```

‎goldens/size-tracking/aio-payloads.json‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,13 @@
1414
"aio-local": {
1515
"master": {
1616
"uncompressed": {
17-
"runtime": 4330,
18-
"main": 452029,
19-
"polyfills": 37271,
20-
"styles": 70394,
21-
"light-theme": 77232,
22-
"dark-theme": 77356
17+
"runtime": 4343,
18+
"main": 451244,
19+
"polyfills": 37297,
20+
"styles": 70379,
21+
"light-theme": 77582,
22+
"dark-theme": 77711
2323
}
2424
}
2525
}
26-
}
26+
}

‎goldens/size-tracking/integration-payloads.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,8 +60,8 @@
6060
"animations": {
6161
"master": {
6262
"uncompressed": {
63-
"runtime": 1073,
64-
"main": 172602,
63+
"runtime": 1070,
64+
"main": 171374,
6565
"polyfills": 37242
6666
}
6767
}

‎packages/animations/BUILD.bazel‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
load("//tools:defaults.bzl", "api_golden_test_npm_package", "ng_module", "ng_package")
1+
load("//tools:defaults.bzl", "api_golden_test", "api_golden_test_npm_package", "ng_module", "ng_package")
22

33
package(default_visibility = ["//visibility:public"])
44

@@ -48,3 +48,14 @@ api_golden_test_npm_package(
4848
golden_dir = "angular/goldens/public-api/animations",
4949
npm_package = "angular/packages/animations/npm_package",
5050
)
51+
52+
api_golden_test(
53+
name = "animations_errors",
54+
data = [
55+
"//goldens:public-api",
56+
"//packages/animations",
57+
"//packages/animations/browser",
58+
],
59+
entry_point = "angular/packages/animations/browser/src/errors.d.ts",
60+
golden = "angular/goldens/public-api/animations/errors.md",
61+
)

‎packages/animations/browser/src/dsl/animation.ts‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
*/
88
import {AnimationMetadata, AnimationMetadataType, AnimationOptions, ɵStyleDataMap} from '@angular/animations';
99

10+
import {buildingFailed, validationFailed} from '../error_helpers';
1011
import {AnimationDriver} from '../render/animation_driver';
1112
import {ENTER_CLASSNAME, LEAVE_CLASSNAME, normalizeStyles} from '../util';
1213

@@ -19,11 +20,10 @@ import {ElementInstructionMap} from './element_instruction_map';
1920
export class Animation {
2021
private _animationAst: Ast<AnimationMetadataType>;
2122
constructor(private _driver: AnimationDriver, input: AnimationMetadata|AnimationMetadata[]) {
22-
const errors: string[] = [];
23+
const errors: Error[] = [];
2324
const ast = buildAnimationAst(_driver, input, errors);
2425
if (errors.length) {
25-
const errorMessage = `animation validation failed:\n${errors.join('\n')}`;
26-
throw new Error(errorMessage);
26+
throw validationFailed(errors);
2727
}
2828
this._animationAst = ast;
2929
}
@@ -42,8 +42,7 @@ export class Animation {
4242
this._driver, element, this._animationAst, ENTER_CLASSNAME, LEAVE_CLASSNAME, start, dest,
4343
options, subInstructions, errors);
4444
if (errors.length) {
45-
const errorMessage = `animation building failed:\n${errors.join('\n')}`;
46-
throw new Error(errorMessage);
45+
throw buildingFailed(errors);
4746
}
4847
return result;
4948
}

‎packages/animations/browser/src/dsl/animation_ast_builder.ts‎

Lines changed: 17 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
*/
88
import {AnimateTimings, AnimationAnimateChildMetadata, AnimationAnimateMetadata, AnimationAnimateRefMetadata, AnimationGroupMetadata, AnimationKeyframesSequenceMetadata, AnimationMetadata, AnimationMetadataType, AnimationOptions, AnimationQueryMetadata, AnimationQueryOptions, AnimationReferenceMetadata, AnimationSequenceMetadata, AnimationStaggerMetadata, AnimationStateMetadata, AnimationStyleMetadata, AnimationTransitionMetadata, AnimationTriggerMetadata, AUTO_STYLE, style, ɵStyleDataMap} from '@angular/animations';
99

10+
import {invalidDefinition, invalidKeyframes, invalidOffset, invalidParallelAnimation, invalidProperty, invalidStagger, invalidState, invalidStyleValue, invalidTrigger, keyframeOffsetsOutOfOrder, keyframesMissingOffsets} from '../error_helpers';
1011
import {AnimationDriver} from '../render/animation_driver';
1112
import {getOrSetDefaultValue} from '../render/shared';
1213
import {convertToMap, copyObj, extractStyleParams, iteratorToArray, NG_ANIMATING_SELECTOR, NG_TRIGGER_SELECTOR, normalizeAnimationEntry, resolveTiming, SUBSTITUTION_EXPR_START, validateStyleParams, visitDslNode} from '../util';
@@ -56,7 +57,7 @@ const SELF_TOKEN_REGEX = new RegExp(`\s*${SELF_TOKEN}\s*,?`, 'g');
5657
*/
5758
export function buildAnimationAst(
5859
driver: AnimationDriver, metadata: AnimationMetadata|AnimationMetadata[],
59-
errors: string[]): Ast<AnimationMetadataType> {
60+
errors: Error[]): Ast<AnimationMetadataType> {
6061
return new AnimationAstBuilderVisitor(driver).build(metadata, errors);
6162
}
6263

@@ -65,7 +66,7 @@ const ROOT_SELECTOR = '';
6566
export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
6667
constructor(private _driver: AnimationDriver) {}
6768

68-
build(metadata: AnimationMetadata|AnimationMetadata[], errors: string[]):
69+
build(metadata: AnimationMetadata|AnimationMetadata[], errors: Error[]):
6970
Ast<AnimationMetadataType> {
7071
const context = new AnimationAstBuilderContext(errors);
7172
this._resetContextStyleTimingState(context);
@@ -87,8 +88,7 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
8788
const states: StateAst[] = [];
8889
const transitions: TransitionAst[] = [];
8990
if (metadata.name.charAt(0) == '@') {
90-
context.errors.push(
91-
'animation triggers cannot be prefixed with an `@` sign (e.g. trigger(\'@foo\', [...]))');
91+
context.errors.push(invalidTrigger());
9292
}
9393

9494
metadata.definitions.forEach(def => {
@@ -107,8 +107,7 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
107107
depCount += transition.depCount;
108108
transitions.push(transition);
109109
} else {
110-
context.errors.push(
111-
'only state() and transition() definitions can sit inside of a trigger()');
110+
context.errors.push(invalidDefinition());
112111
}
113112
});
114113

@@ -142,10 +141,7 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
142141
});
143142
if (missingSubs.size) {
144143
const missingSubsArr = iteratorToArray(missingSubs.values());
145-
context.errors.push(`state("${
146-
metadata
147-
.name}", ...) must define default values for all the following style substitutions: ${
148-
missingSubsArr.join(', ')}`);
144+
context.errors.push(invalidState(metadata.name, missingSubsArr));
149145
}
150146
}
151147

@@ -252,7 +248,7 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
252248
if (styleTuple === AUTO_STYLE) {
253249
styles.push(styleTuple);
254250
} else {
255-
context.errors.push(`The provided style string value ${styleTuple} is not allowed.`);
251+
context.errors.push(invalidStyleValue(styleTuple));
256252
}
257253
} else {
258254
styles.push(convertToMap(styleTuple));
@@ -301,8 +297,7 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
301297

302298
tuple.forEach((value, prop) => {
303299
if (!this._driver.validateStyleProperty(prop)) {
304-
context.errors.push(`The provided animation property "${
305-
prop}" is not a supported CSS property for animations`);
300+
context.errors.push(invalidProperty(prop));
306301
return;
307302
}
308303

@@ -314,11 +309,8 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
314309
if (collectedEntry) {
315310
if (startTime != endTime && startTime >= collectedEntry.startTime &&
316311
endTime <= collectedEntry.endTime) {
317-
context.errors.push(`The CSS property "${prop}" that exists between the times of "${
318-
collectedEntry.startTime}ms" and "${
319-
collectedEntry
320-
.endTime}ms" is also being animated in a parallel animation between the times of "${
321-
startTime}ms" and "${endTime}ms"`);
312+
context.errors.push(invalidParallelAnimation(
313+
prop, collectedEntry.startTime, collectedEntry.endTime, startTime, endTime));
322314
updateCollectedStyle = false;
323315
}
324316

@@ -343,7 +335,7 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
343335
KeyframesAst {
344336
const ast: KeyframesAst = {type: AnimationMetadataType.Keyframes, styles: [], options: null};
345337
if (!context.currentAnimateTimings) {
346-
context.errors.push(`keyframes() must be placed inside of a call to animate()`);
338+
context.errors.push(invalidKeyframes());
347339
return ast;
348340
}
349341

@@ -372,17 +364,17 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
372364
});
373365

374366
if (keyframesOutOfRange) {
375-
context.errors.push(`Please ensure that all keyframe offsets are between 0 and 1`);
367+
context.errors.push(invalidOffset());
376368
}
377369

378370
if (offsetsOutOfOrder) {
379-
context.errors.push(`Please ensure that all keyframe offsets are in order`);
371+
context.errors.push(keyframeOffsetsOutOfOrder());
380372
}
381373

382374
const length = metadata.steps.length;
383375
let generatedOffset = 0;
384376
if (totalKeyframesWithOffsets > 0 && totalKeyframesWithOffsets < length) {
385-
context.errors.push(`Not all style() steps within the declared keyframes() contain offsets`);
377+
context.errors.push(keyframesMissingOffsets());
386378
} else if (totalKeyframesWithOffsets == 0) {
387379
generatedOffset = MAX_KEYFRAME_OFFSET / (length - 1);
388380
}
@@ -462,7 +454,7 @@ export class AnimationAstBuilderVisitor implements AnimationDslVisitor {
462454
visitStagger(metadata: AnimationStaggerMetadata, context: AnimationAstBuilderContext):
463455
StaggerAst {
464456
if (!context.currentQuery) {
465-
context.errors.push(`stagger() can only be used inside of query()`);
457+
context.errors.push(invalidStagger());
466458
}
467459
const timings = metadata.timings === 'full' ?
468460
{duration: 0, delay: 0, easing: 'full'} :
@@ -511,7 +503,7 @@ export class AnimationAstBuilderContext {
511503
public currentTime: number = 0;
512504
public collectedStyles = new Map<string, Map<string, StyleTimeTuple>>();
513505
public options: AnimationOptions|null = null;
514-
constructor(public errors: string[]) {}
506+
constructor(public errors: Error[]) {}
515507
}
516508

517509
type OffsetStyles = string|ɵStyleDataMap;
@@ -537,7 +529,7 @@ function consumeOffset(styles: OffsetStyles|Array<OffsetStyles>): number|null {
537529
return offset;
538530
}
539531

540-
function constructTimingAst(value: string|number|AnimateTimings, errors: string[]) {
532+
function constructTimingAst(value: string|number|AnimateTimings, errors: Error[]) {
541533
let timings: AnimateTimings|null = null;
542534
if (value.hasOwnProperty('duration')) {
543535
timings = value as AnimateTimings;

‎packages/animations/browser/src/dsl/animation_timeline_builder.ts‎

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
*/
88
import {AnimateChildOptions, AnimateTimings, AnimationMetadataType, AnimationOptions, AnimationQueryOptions, AUTO_STYLE, ɵPRE_STYLE as PRE_STYLE, ɵStyleDataMap} from '@angular/animations';
99

10+
import {invalidQuery} from '../error_helpers';
1011
import {AnimationDriver} from '../render/animation_driver';
1112
import {copyStyles, interpolateParams, iteratorToArray, resolveTiming, resolveTimingValue, visitDslNode} from '../util';
1213

@@ -103,8 +104,7 @@ export function buildAnimationTimelines(
103104
driver: AnimationDriver, rootElement: any, ast: Ast<AnimationMetadataType>,
104105
enterClassName: string, leaveClassName: string, startingStyles: ɵStyleDataMap = new Map(),
105106
finalStyles: ɵStyleDataMap = new Map(), options: AnimationOptions,
106-
subInstructions?: ElementInstructionMap,
107-
errors: string[] = []): AnimationTimelineInstruction[] {
107+
subInstructions?: ElementInstructionMap, errors: Error[] = []): AnimationTimelineInstruction[] {
108108
return new AnimationTimelineBuilderVisitor().buildKeyframes(
109109
driver, rootElement, ast, enterClassName, leaveClassName, startingStyles, finalStyles,
110110
options, subInstructions, errors);
@@ -116,7 +116,7 @@ export class AnimationTimelineBuilderVisitor implements AstVisitor {
116116
enterClassName: string, leaveClassName: string, startingStyles: ɵStyleDataMap,
117117
finalStyles: ɵStyleDataMap, options: AnimationOptions,
118118
subInstructions?: ElementInstructionMap,
119-
errors: string[] = []): AnimationTimelineInstruction[] {
119+
errors: Error[] = []): AnimationTimelineInstruction[] {
120120
subInstructions = subInstructions || new ElementInstructionMap();
121121
const context = new AnimationTimelineContext(
122122
driver, rootElement, subInstructions, enterClassName, leaveClassName, errors, []);
@@ -465,7 +465,7 @@ export class AnimationTimelineContext {
465465
constructor(
466466
private _driver: AnimationDriver, public element: any,
467467
public subInstructions: ElementInstructionMap, private _enterClassName: string,
468-
private _leaveClassName: string, public errors: string[], public timelines: TimelineBuilder[],
468+
private _leaveClassName: string, public errors: Error[], public timelines: TimelineBuilder[],
469469
initialTimeline?: TimelineBuilder) {
470470
this.currentTimeline = initialTimeline || new TimelineBuilder(this._driver, element, 0);
471471
timelines.push(this.currentTimeline);
@@ -573,7 +573,7 @@ export class AnimationTimelineContext {
573573

574574
invokeQuery(
575575
selector: string, originalSelector: string, limit: number, includeSelf: boolean,
576-
optional: boolean, errors: string[]): any[] {
576+
optional: boolean, errors: Error[]): any[] {
577577
let results: any[] = [];
578578
if (includeSelf) {
579579
results.push(this.element);
@@ -591,8 +591,7 @@ export class AnimationTimelineContext {
591591
}
592592

593593
if (!optional && results.length == 0) {
594-
errors.push(`\`query("${originalSelector}")\` returned zero elements. (Use \`query("${
595-
originalSelector}", { optional: true })\` if you wish to allow this.)`);
594+
errors.push(invalidQuery(originalSelector));
596595
}
597596
return results;
598597
}
@@ -720,7 +719,7 @@ export class TimelineBuilder {
720719
}
721720

722721
setStyles(
723-
input: Array<(ɵStyleDataMap | string)>, easing: string|null, errors: string[],
722+
input: Array<(ɵStyleDataMap | string)>, easing: string|null, errors: Error[],
724723
options?: AnimationOptions) {
725724
if (easing) {
726725
this._previousKeyframe.set('easing', easing);

0 commit comments

Comments
 (0)