diff --git a/packages/core/src/render3/component.ts b/packages/core/src/render3/component.ts index b053e5eb99..5d602a4c24 100644 --- a/packages/core/src/render3/component.ts +++ b/packages/core/src/render3/component.ts @@ -9,7 +9,7 @@ import {ComponentRef, EmbeddedViewRef, Injector} from '../core'; import {assertNotNull} from './assert'; -import {NG_HOST_SYMBOL, createError, createViewState, directiveCreate, elementHost, enterView, leaveView} from './instructions'; +import {NG_HOST_SYMBOL, createError, createViewState, directive, elementHost, enterView, leaveView} from './instructions'; import {LElement} from './l_node'; import {ComponentDef, ComponentType} from './public_interfaces'; import {RElement, Renderer3, RendererFactory3} from './renderer'; @@ -146,7 +146,7 @@ export function renderComponent( // Create element node at index 0 in data array elementHost(opts.host || componentDef.tag, componentDef); // Create directive instance with n() and store at index 1 in data array (el is 0) - component = directiveCreate(1, componentDef.n(), componentDef); + component = directive(1, componentDef.n(), componentDef); } finally { leaveView(oldView); } diff --git a/packages/core/src/render3/index.ts b/packages/core/src/render3/index.ts index 29c71f5e85..33d03d6fca 100644 --- a/packages/core/src/render3/index.ts +++ b/packages/core/src/render3/index.ts @@ -20,7 +20,7 @@ import {ComponentDef, ComponentTemplate, ComponentType, DirectiveDef, DirectiveD // - lower case for closing: c(containerEnd), e(elementEnd), v(viewEnd) // clang-format off export { - LifeCycleGuard, + LifecycleHook, NO_CHANGE as NC, @@ -35,33 +35,36 @@ export { bind8 as b8, bindV as bV, - containerCreate as C, - containerEnd as c, - contentProjection as P, + componentRefresh as r, - directiveCreate as D, - directiveLifeCycle as l, - distributeProjectedNodes as dP, + containerStart as C, + containerEnd as c, + containerRefreshStart as cR, + containerRefreshEnd as cr, + + directive as D, elementAttribute as a, elementClass as k, - elementCreate as E, elementEnd as e, elementProperty as p, + elementStart as E, elementStyle as s, - listenerCreate as L, + lifecycle as l, + listener as L, memory as m, - queryCreate as Q, - refreshComponent as r, - refreshContainer as rC, - refreshContainerEnd as rc, - refreshQuery as rQ, - textCreate as T, - textCreateBound as t, + projection as P, + projectionDef as pD, - viewCreate as V, + query as Q, + queryRefresh as qR, + + text as T, + textBinding as t, + + viewStart as V, viewEnd as v, } from './instructions'; // clang-format on diff --git a/packages/core/src/render3/instructions.ts b/packages/core/src/render3/instructions.ts index f7e4c23bc5..54350ddcb7 100644 --- a/packages/core/src/render3/instructions.ts +++ b/packages/core/src/render3/instructions.ts @@ -23,19 +23,18 @@ import {QueryList, QueryState_} from './query'; import {RComment, RElement, RText, Renderer3, ProceduralRenderer3, ObjectOrientedRenderer3, RendererStyleFlags3} from './renderer'; import {isDifferent, stringify} from './util'; -export {refreshQuery} from './query'; +export {queryRefresh} from './query'; /** - * Enum used by the directiveLifecycle (l) instruction to determine which lifecycle - * hook is requesting processing and whether it should be allowed to run. It "guards" - * certain hooks, e.g. "ngOnInit" should only run once on creation. + * Enum used by the lifecycle (l) instruction to determine which lifecycle hook is requesting + * processing. */ -export const enum LifeCycleGuard {ON_INIT = 1, ON_DESTROY = 2, ON_CHANGES = 4} +export const enum LifecycleHook {ON_INIT = 1, ON_DESTROY = 2, ON_CHANGES = 4} /** - * directiveCreate (D) sets a property on all component instances using this constant - * as a key, and the component's host node (LElement) as the value. This is used in - * methods like detectChanges to facilitate jumping from an instance to the host node. + * directive (D) sets a property on all component instances using this constant as a key and the + * component's host node (LElement) as the value. This is used in methods like detectChanges to + * facilitate jumping from an instance to the host node. */ export const NG_HOST_SYMBOL = '__ngHostLNode__'; @@ -63,14 +62,13 @@ let nextNgElementId = 0; * * - ObjectedOrientedRenderer3 * - * This is the native browser API style. e.g. operations are methods on individual objects - * like HTMLElement. With this style, no additional code is needed (reducing payload size) - * as a facade. + * This is the native browser API style, e.g. operations are methods on individual objects + * like HTMLElement. With this style, no additional code is needed as a facade (reducing payload size). * * - ProceduralRenderer3 * * In non-native browser environments (e.g. platforms such as web-workers), this is the facade - * that facilitates element manipulation. This also facilitates backwards compatibility with + * that enables element manipulation. This also facilitates backwards compatibility with * Renderer2. */ let renderer: Renderer3; @@ -299,8 +297,8 @@ export function renderTemplate(host: LElement, template: ComponentTemplate * Registers this directive as present in its node's injector by flipping the directive's * corresponding bit in the injector's bloom filter. * - * @param injector The injector to which the type should be added - * @param type The directive type to add + * @param injector The injector in which the directive should be registered + * @param type The directive to register */ export function bloomAdd(injector: LNodeInjector, type: Type): void { let id: number|undefined = (type as any)[NG_ELEMENT_ID]; @@ -382,7 +380,7 @@ export function getOrCreateNodeInjector(): LNodeInjector { * name and elements with an odd index hold an attribute value, ex.: * ['id', 'warning5', 'class', 'alert'] */ -export function elementCreate( +export function elementStart( index: number, nameOrComponentDef?: string | ComponentDef, attrs?: string[]): RElement { let node: LElement; let native: RElement; @@ -437,9 +435,9 @@ function getTemplateStatic(template: ComponentTemplate): NgStaticData { function setUpAttributes(native: RElement, attrs: string[]): void { ngDevMode && assertEqual(attrs.length % 2, 0, 'attrs.length % 2'); - const isFnRenderer = (renderer as ProceduralRenderer3).setAttribute; + const isProceduralRenderer = (renderer as ProceduralRenderer3).setAttribute; for (let i = 0; i < attrs.length; i += 2) { - isFnRenderer ? (renderer as ProceduralRenderer3).setAttribute !(native, attrs[i], attrs[i | 1]) : + isProceduralRenderer ? (renderer as ProceduralRenderer3).setAttribute !(native, attrs[i], attrs[i | 1]) : native.setAttribute(attrs[i], attrs[i | 1]); } } @@ -483,7 +481,7 @@ export function elementHost(elementOrSelector: RElement | string, def: Component * @param listener The function to be called when event emits * @param useCapture Whether or not to use capture in event listener. */ -export function listenerCreate( +export function listener( eventName: string, listener: EventListener, useCapture = false): void { ngDevMode && assertPreviousIsParent(); const node = previousOrParentNode; @@ -510,7 +508,7 @@ export function listenerCreate( const outputs = staticData.outputs; let outputData: (number | string)[]|undefined; if (outputs && (outputData = outputs[eventName])) { - outputCreate(outputData, listener); + createOutput(outputData, listener); } } @@ -518,7 +516,7 @@ export function listenerCreate( * Iterates through the outputs associated with a particular event name and subscribes to * each output. */ -function outputCreate(outputs: (number | string)[], listener: Function): void { +function createOutput(outputs: (number | string)[], listener: Function): void { for (let i = 0; i < outputs.length; i += 2) { ngDevMode && assertDataInRange(outputs[i] as number); const subscription = data[outputs[i] as number][outputs[i | 1]].subscribe(listener); @@ -526,9 +524,7 @@ function outputCreate(outputs: (number | string)[], listener: Function): void { } } -/** - * Mark the end of the element. - */ +/** Mark the end of the element. */ export function elementEnd() { if (isParent) { isParent = false; @@ -568,10 +564,8 @@ export function elementAttribute(index: number, attrName: string, value: any): v * Update a property on an Element. * * If the property name also exists as an input property on one of the element's directives, - * the component property will be set instead of the element property. This check is also - * done at compile time to determine whether to generate an i() or p() instruction, but must - * be conducted at runtime as well so child components that add new @Inputs don't have to be - * re-compiled. + * the component property will be set instead of the element property. This check must + * be conducted at runtime so child components that add new @Inputs don't have to be re-compiled. * * @param index The index of the element to update in the data array * @param propName Name of property. Because it is going to DOM, this is not subject to @@ -736,7 +730,7 @@ export function elementStyle( * @param value Value to write. This value will be stringified. * If value is not provided than the actual creation of the text node is delayed. */ -export function textCreate(index: number, value?: any): void { +export function text(index: number, value?: any): void { ngDevMode && assertEqual(currentView.bindingStartIndex, null, 'bindingStartIndex'); const textNode = value != null ? ((renderer as ProceduralRenderer3).createText ? @@ -756,7 +750,7 @@ export function textCreate(index: number, value?: any): void { * @param index Index of the node in the data array. * @param value Stringified value to write. */ -export function textCreateBound(index: number, value: T | NO_CHANGE): void { +export function textBinding(index: number, value: T | NO_CHANGE): void { // TODO(misko): I don't think index < nodes.length check is needed here. let existingNode = index < data.length && data[index] as LText; if (existingNode && existingNode.native) { @@ -773,7 +767,7 @@ export function textCreateBound(index: number, value: T | NO_CHANGE): void { (renderer as ObjectOrientedRenderer3).createTextNode !(stringify(value))); insertChild(existingNode, currentView); } else { - textCreate(index, value); + text(index, value); } } @@ -793,9 +787,9 @@ export function textCreateBound(index: number, value: T | NO_CHANGE): void { * @param directive The directive instance. * @param directiveDef DirectiveDef object which contains information about the template. */ -export function directiveCreate(index: number): T; -export function directiveCreate(index: number, directive: T, directiveDef: DirectiveDef): T; -export function directiveCreate( +export function directive(index: number): T; +export function directive(index: number, directive: T, directiveDef: DirectiveDef): T; +export function directive( index: number, directive?: T, directiveDef?: DirectiveDef): T { let instance; if (directive == null) { @@ -914,26 +908,26 @@ export function diPublic(def: DirectiveDef): void { * For the onInit lifecycle hook, it will return whether or not the ngOnInit() function * should run. If so, ngOnInit() will be called outside of this function. * - * e.g. l(LifecycleGuard.ON_INIT) && ctx.ngOnInit(); + * e.g. l(LifecycleHook.ON_INIT) && ctx.ngOnInit(); * * For the onDestroy lifecycle hook, this instruction also accepts an onDestroy * method that should be stored and called internally when the parent view is being * cleaned up. * - * e.g. l(LifecycleGuard.ON_DESTROY, ctx, ctx.onDestroy); + * e.g. l(LifecycleHook.ON_DESTROY, ctx, ctx.onDestroy); * * @param lifeCycle * @param self * @param method */ -export function directiveLifeCycle( - lifeCycle: LifeCycleGuard.ON_DESTROY, self: any, method: Function): void; -export function directiveLifeCycle(lifeCycle: LifeCycleGuard): boolean; -export function directiveLifeCycle( - lifeCycle: LifeCycleGuard, self?: any, method?: Function): boolean { - if (lifeCycle === LifeCycleGuard.ON_INIT) { +export function lifecycle( + lifeCycle: LifecycleHook.ON_DESTROY, self: any, method: Function): void; +export function lifecycle(lifeCycle: LifecycleHook): boolean; +export function lifecycle( + lifeCycle: LifecycleHook, self?: any, method?: Function): boolean { + if (lifeCycle === LifecycleHook.ON_INIT) { return creationMode; - } else if (lifeCycle === LifeCycleGuard.ON_DESTROY) { + } else if (lifeCycle === LifecycleHook.ON_DESTROY) { (cleanup || (currentView.cleanup = cleanup = [])).push(method, self); } return false; @@ -954,7 +948,7 @@ export function directiveLifeCycle( * @param tagName The name of the container element, if applicable * @param attrs The attrs attached to the container, if applicable */ -export function containerCreate( +export function containerStart( index: number, template?: ComponentTemplate, tagName?: string, attrs?: string[]): void { ngDevMode && assertEqual(currentView.bindingStartIndex, null, 'bindingStartIndex'); @@ -1004,7 +998,7 @@ export function containerEnd() { * * @param index The index of the container in the data array */ -export function refreshContainer(index: number): void { +export function containerRefreshStart(index: number): void { ngDevMode && assertDataInRange(index); previousOrParentNode = data[index] as LNode; ngDevMode && assertNodeType(previousOrParentNode, LNodeFlags.Container); @@ -1017,7 +1011,7 @@ export function refreshContainer(index: number): void { * * Marking the end of ViewContainer is the time when to child Views get inserted or removed. */ -export function refreshContainerEnd(): void { +export function containerRefreshEnd(): void { if (isParent) { isParent = false; } else { @@ -1041,7 +1035,7 @@ export function refreshContainerEnd(): void { * @param viewBlockId The ID of this view * @return Whether or not this view is in creation mode */ -export function viewCreate(viewBlockId: number): boolean { +export function viewStart(viewBlockId: number): boolean { const container = (isParent ? previousOrParentNode : previousOrParentNode.parent !) as LContainer; ngDevMode && assertNodeType(container, LNodeFlags.Container); const containerState = container.data; @@ -1088,9 +1082,7 @@ function initViewStaticData(viewIndex: number, parent: LContainer): NgStaticData return containerStatic[viewIndex]; } -/** - * Marks the end of the LView. - */ +/** Marks the end of the LView. */ export function viewEnd(): void { isParent = false; const viewNode = previousOrParentNode = currentView.node as LView; @@ -1113,8 +1105,16 @@ export function viewEnd(): void { } ///////////// - -export const refreshComponent: +/** + * Refreshes the component view. + * + * In other words, enters the component's view and processes it to update bindings, queries, etc. + * + * @param directiveIndex + * @param elementIndex + * @param template + */ +export const componentRefresh: (directiveIndex: number, elementIndex: number, template: ComponentTemplate) => void = function( this: undefined | {template: ComponentTemplate}, directiveIndex: number, @@ -1143,7 +1143,7 @@ export const refreshComponent: * * @param {CssSelector[]} selectors */ -export function distributeProjectedNodes(selectors?: CssSelector[]): LNode[][] { +export function projectionDef(selectors?: CssSelector[]): LNode[][] { const noOfNodeBuckets = selectors ? selectors.length + 1 : 1; const distributedNodes = new Array(noOfNodeBuckets); for (let i = 0; i < noOfNodeBuckets; i++) { @@ -1189,13 +1189,13 @@ export function distributeProjectedNodes(selectors?: CssSelector[]): LNode[][] { /** * Inserts previously re-distributed projected nodes. This instruction must be preceded by a call - * to the distributeProjectedNodes instruction. + * to the projectionDef instruction. * * @param {number} nodeIndex * @param {number} localIndex - index under which distribution of projected nodes was memorized * @param {number} selectorIndex - 0 means without any selector */ -export function contentProjection( +export function projection( nodeIndex: number, localIndex: number, selectorIndex: number = 0): void { const projectedNodes: ProjectionState = []; const node = createLNode(nodeIndex, LNodeFlags.Projection, null, projectedNodes); @@ -1228,8 +1228,8 @@ export function contentProjection( /** * Given a current view, finds the nearest component's host (LElement). * - * @param {ViewState} viewState - * @returns {LElement} + * @param viewState ViewState for which we want a host element node + * @returns The host node */ function findComponentHost(viewState: ViewState): LElement { let viewRootLNode = viewState.node; @@ -1246,13 +1246,13 @@ function findComponentHost(viewState: ViewState): LElement { } /** - * Adds a ViewState or a ContainerState to the end of the current - * view tree. + * Adds a ViewState or a ContainerState to the end of the current view tree. * - * This structure will be used to traverse through nested views - * to remove listeners and call onDestroy callbacks. + * This structure will be used to traverse through nested views to remove listeners + * and call onDestroy callbacks. * - * @param {ViewState | ContainerState} state + * @param state The ViewState or ContainerState to add to the view tree + * @returns The state passed in */ export function addToViewTree(state: T): T { currentView.tail ? (currentView.tail.next = state) : (currentView.child = state); @@ -1699,7 +1699,7 @@ function valueInData(data: any[], index: number, value?: T): T { return value !; } -export function queryCreate(predicate: Type| any[], descend?: boolean): QueryList { +export function query(predicate: Type| any[], descend?: boolean): QueryList { ngDevMode && assertPreviousIsParent(); const queryList = new QueryList(); const query = currentQuery || (currentQuery = new QueryState_()); diff --git a/packages/core/src/render3/public_interfaces.ts b/packages/core/src/render3/public_interfaces.ts index 11ea849431..04148ec9f4 100644 --- a/packages/core/src/render3/public_interfaces.ts +++ b/packages/core/src/render3/public_interfaces.ts @@ -7,7 +7,7 @@ */ import {Type} from '../core'; -import {diPublic, refreshComponent} from './instructions'; +import {diPublic, componentRefresh} from './instructions'; /** @@ -150,7 +150,7 @@ export function defineComponent(componentDefinition: ComponentDefArgs): Co n: componentDefinition.factory, tag: (componentDefinition as ComponentDefArgs).tag || null !, template: (componentDefinition as ComponentDefArgs).template || null !, - r: componentDefinition.refresh || refreshComponent, + r: componentDefinition.refresh || componentRefresh, inputs: invertObject(componentDefinition.inputs), outputs: invertObject(componentDefinition.outputs), methods: invertObject(componentDefinition.methods), diff --git a/packages/core/src/render3/query.ts b/packages/core/src/render3/query.ts index 6696be0d17..f569fba451 100644 --- a/packages/core/src/render3/query.ts +++ b/packages/core/src/render3/query.ts @@ -209,6 +209,6 @@ class QueryList_/* implements viewEngine.QueryList */ { export type QueryList = viewEngine.QueryList; export const QueryList: typeof viewEngine.QueryList = QueryList_ as any; -export function refreshQuery(query: QueryList): boolean { +export function queryRefresh(query: QueryList): boolean { return (query as any as QueryList_)._refresh(); } diff --git a/packages/core/test/render3/basic_perf.ts b/packages/core/test/render3/basic_perf.ts index 52023e5799..f3037f0ef5 100644 --- a/packages/core/test/render3/basic_perf.ts +++ b/packages/core/test/render3/basic_perf.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {C, E, T, V, c, defineComponent, e, rC, rc, v} from '../../src/render3/index'; +import {C, E, T, V, c, defineComponent, e, cR, cr, v} from '../../src/render3/index'; import {document, renderComponent} from './render_util'; @@ -39,7 +39,7 @@ describe('iv perf test', () => { C(0); c(); } - rC(0); + cR(0); { for (let i = 0; i < count; i++) { let cm0 = V(0); @@ -53,7 +53,7 @@ describe('iv perf test', () => { v(); } } - rc(); + cr(); }, factory: () => new Component }); diff --git a/packages/core/test/render3/content_spec.ts b/packages/core/test/render3/content_spec.ts index cd170644cf..72a2b0e107 100644 --- a/packages/core/test/render3/content_spec.ts +++ b/packages/core/test/render3/content_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {C, D, E, P, T, V, c, dP, detectChanges, e, m, rC, rc, v} from '../../src/render3/index'; +import {C, D, E, P, T, V, c, pD, detectChanges, e, m, cR, cr, v} from '../../src/render3/index'; import {createComponent, renderComponent, toHtml} from './render_util'; @@ -18,7 +18,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, 'div'); { P(2, 0); } e(); @@ -46,7 +46,7 @@ describe('content projection', () => { it('should project content when root.', () => { const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); P(1, 0); } }); @@ -68,7 +68,7 @@ describe('content projection', () => { it('should re-project content when root.', () => { const GrandChild = createComponent('grand-child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, 'div'); { P(2, 0); } e(); @@ -76,7 +76,7 @@ describe('content projection', () => { }); const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, GrandChild.ngComponentDef); { D(2, GrandChild.ngComponentDef.n(), GrandChild.ngComponentDef); @@ -108,7 +108,7 @@ describe('content projection', () => { it('should project content with container.', () => { const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, 'div'); { P(2, 0); } e(); @@ -126,7 +126,7 @@ describe('content projection', () => { } e(); } - rC(3); + cR(3); { if (ctx.value) { if (V(0)) { @@ -135,7 +135,7 @@ describe('content projection', () => { v(); } } - rc(); + cr(); Child.ngComponentDef.r(1, 0); }); const parent = renderComponent(Parent); @@ -151,7 +151,7 @@ describe('content projection', () => { it('should project content with container into root', () => { const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); P(1, 0); } }); @@ -165,7 +165,7 @@ describe('content projection', () => { } e(); } - rC(2); + cR(2); { if (ctx.value) { if (V(0)) { @@ -174,7 +174,7 @@ describe('content projection', () => { v(); } } - rc(); + cr(); Child.ngComponentDef.r(1, 0); }); const parent = renderComponent(Parent); @@ -192,7 +192,7 @@ describe('content projection', () => { it('should project content with container and if-else.', () => { const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, 'div'); { P(2, 0); } e(); @@ -210,7 +210,7 @@ describe('content projection', () => { } e(); } - rC(3); + cR(3); { if (ctx.value) { if (V(0)) { @@ -224,7 +224,7 @@ describe('content projection', () => { v(); } } - rc(); + cr(); Child.ngComponentDef.r(1, 0); }); const parent = renderComponent(Parent); @@ -251,7 +251,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, 'div'); { C(2); @@ -259,7 +259,7 @@ describe('content projection', () => { } e(); } - rC(2); + cR(2); { if (!ctx.skipContent) { if (V(0)) { @@ -270,7 +270,7 @@ describe('content projection', () => { v(); } } - rc(); + cr(); }); /** @@ -308,7 +308,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, 'div'); { C(2); @@ -316,7 +316,7 @@ describe('content projection', () => { } e(); } - rC(2); + cR(2); { if (!ctx.skipContent) { if (V(0)) { @@ -325,7 +325,7 @@ describe('content projection', () => { v(); } } - rc(); + cr(); }); /** @@ -357,7 +357,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, 'div'); { P(2, 0); } e(); @@ -406,7 +406,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); P(1, 0); E(2, 'div'); { @@ -415,7 +415,7 @@ describe('content projection', () => { } e(); } - rC(3); + cR(3); { if (ctx.show) { if (V(0)) { @@ -424,7 +424,7 @@ describe('content projection', () => { v(); } } - rc(); + cr(); }); /** @@ -459,7 +459,7 @@ describe('content projection', () => { const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { m(0, - dP([[[['span', 'title', 'toFirst'], null]], [[['span', 'title', 'toSecond'], null]]])); + pD([[[['span', 'title', 'toFirst'], null]], [[['span', 'title', 'toSecond'], null]]])); E(1, 'div', ['id', 'first']); { P(2, 0, 1); } e(); @@ -506,7 +506,7 @@ describe('content projection', () => { const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { m(0, - dP([[[['span', 'class', 'toFirst'], null]], [[['span', 'class', 'toSecond'], null]]])); + pD([[[['span', 'class', 'toFirst'], null]], [[['span', 'class', 'toSecond'], null]]])); E(1, 'div', ['id', 'first']); { P(2, 0, 1); } e(); @@ -553,7 +553,7 @@ describe('content projection', () => { const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { m(0, - dP([[[['span', 'class', 'toFirst'], null]], [[['span', 'class', 'toSecond'], null]]])); + pD([[[['span', 'class', 'toFirst'], null]], [[['span', 'class', 'toSecond'], null]]])); E(1, 'div', ['id', 'first']); { P(2, 0, 1); } e(); @@ -599,7 +599,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP([[[['span'], null]], [[['span', 'class', 'toSecond'], null]]])); + m(0, pD([[[['span'], null]], [[['span', 'class', 'toSecond'], null]]])); E(1, 'div', ['id', 'first']); { P(2, 0, 1); } e(); @@ -645,7 +645,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP([[[['span', 'class', 'toFirst'], null]]])); + m(0, pD([[[['span', 'class', 'toFirst'], null]]])); E(1, 'div', ['id', 'first']); { P(2, 0, 1); } e(); @@ -692,7 +692,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP([[[['span', 'class', 'toSecond'], null]]])); + m(0, pD([[[['span', 'class', 'toSecond'], null]]])); E(1, 'div', ['id', 'first']); { P(2, 0); } e(); @@ -746,7 +746,7 @@ describe('content projection', () => { */ const GrandChild = createComponent('grand-child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP([[[['span'], null]]])); + m(0, pD([[[['span'], null]]])); P(1, 0, 1); E(2, 'hr'); e(); @@ -762,7 +762,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP()); + m(0, pD()); E(1, GrandChild.ngComponentDef); { D(2, GrandChild.ngComponentDef.n(), GrandChild.ngComponentDef); @@ -812,7 +812,7 @@ describe('content projection', () => { */ const Child = createComponent('child', function(ctx: any, cm: boolean) { if (cm) { - m(0, dP([[[['div'], null]]])); + m(0, pD([[[['div'], null]]])); E(1, 'span'); { P(2, 0, 1); } e(); @@ -834,7 +834,7 @@ describe('content projection', () => { } e(); } - rC(2); + cR(2); { if (true) { if (V(0)) { @@ -845,7 +845,7 @@ describe('content projection', () => { v(); } } - rc(); + cr(); Child.ngComponentDef.r(1, 0); }); const parent = renderComponent(Parent); diff --git a/packages/core/test/render3/control_flow_spec.ts b/packages/core/test/render3/control_flow_spec.ts index 1eff32d70e..9da2df08a4 100644 --- a/packages/core/test/render3/control_flow_spec.ts +++ b/packages/core/test/render3/control_flow_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {C, E, T, V, b, c, e, rC, rc, t, v} from '../../src/render3/index'; +import {C, E, T, V, b, c, e, cR, cr, t, v} from '../../src/render3/index'; import {renderToHtml} from './render_util'; @@ -23,7 +23,7 @@ describe('JS control flow', () => { } e(); } - rC(1); + cR(1); { if (ctx.condition) { let cm1 = V(1); @@ -38,7 +38,7 @@ describe('JS control flow', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, ctx)).toEqual('
Hello
'); @@ -74,7 +74,7 @@ describe('JS control flow', () => { } e(); } - rC(1); + cR(1); { if (ctx.condition) { let cm1 = V(1); @@ -87,7 +87,7 @@ describe('JS control flow', () => { } e(); } - rC(1); + cR(1); { if (ctx.condition2) { let cm2 = V(2); @@ -99,12 +99,12 @@ describe('JS control flow', () => { v(); } } - rc(); + cr(); } v(); } } - rc(); + cr(); } expect(renderToHtml(Template, ctx)).toEqual('
Hello
'); @@ -143,7 +143,7 @@ describe('JS control flow', () => { C(2); c(); } - rC(2); + cR(2); { if (ctx.condition1) { let cm0 = V(0); @@ -152,7 +152,7 @@ describe('JS control flow', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition2) { let cm0 = V(0); @@ -164,12 +164,12 @@ describe('JS control flow', () => { v(); } } - rc(); + cr(); } v(); } } - rc(); + cr(); } expect(renderToHtml(Template, {condition1: true, condition2: true})) @@ -191,7 +191,7 @@ describe('JS control flow', () => { } e(); } - rC(1); + cR(1); { for (let i = 0; i < ctx.data.length; i++) { let cm1 = V(1); @@ -206,7 +206,7 @@ describe('JS control flow', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, ctx)).toEqual('
  • a
  • b
  • c
'); @@ -240,7 +240,7 @@ describe('JS control flow', () => { } e(); } - rC(1); + cR(1); { for (let i = 0; i < ctx.data[0].length; i++) { let cm1 = V(1); @@ -253,7 +253,7 @@ describe('JS control flow', () => { } e(); } - rC(1); + cR(1); { ctx.data[1].forEach((value: string, ind: number) => { if (V(2)) { @@ -263,12 +263,12 @@ describe('JS control flow', () => { v(); }); } - rc(); + cr(); } v(); } } - rc(); + cr(); } expect(renderToHtml(Template, ctx)).toEqual('
  • aman
  • bmbn
  • cmcn
'); @@ -303,7 +303,7 @@ describe('JS control flow', () => { } e(); } - rC(2); + cR(2); { for (let i = 0; i < ctx.cafes.length; i++) { let cm1 = V(1); @@ -317,7 +317,7 @@ describe('JS control flow', () => { T(3, '-'); } t(1, b(ctx.cafes[i].name)); - rC(2); + cR(2); { for (let j = 0; j < ctx.cafes[i].entrees.length; j++) { if (V(1)) { @@ -327,12 +327,12 @@ describe('JS control flow', () => { v(); } } - rc(); + cr(); } v(); } } - rc(); + cr(); } const ctx = { @@ -385,7 +385,7 @@ describe('JS control flow', () => { } e(); } - rC(2); + cR(2); { for (let i = 0; i < ctx.cafes.length; i++) { let cm1 = V(1); @@ -399,7 +399,7 @@ describe('JS control flow', () => { T(3, '-'); } t(1, b(ctx.cafes[i].name)); - rC(2); + cR(2); { for (let j = 0; j < ctx.cafes[i].entrees.length; j++) { let cm1 = V(1); @@ -412,7 +412,7 @@ describe('JS control flow', () => { c(); } t(1, b(ctx.cafes[i].entrees[j].name)); - rC(2); + cR(2); { for (let k = 0; k < ctx.cafes[i].entrees[j].foods.length; k++) { if (V(1)) { @@ -422,17 +422,17 @@ describe('JS control flow', () => { v(); } } - rc(); + cr(); } v(); } } - rc(); + cr(); } v(); } } - rc(); + cr(); } const ctx = { @@ -476,7 +476,7 @@ describe('JS control flow', () => { } e(); } - rC(1); + cR(1); { if (ctx.condition) { let cm1 = V(1); @@ -500,7 +500,7 @@ describe('JS control flow', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, ctx)).toEqual('
Hello
'); @@ -527,7 +527,7 @@ describe('JS for loop', () => { } e(); } - rC(1); + cR(1); { for (let i = 0; i < ctx.data1.length; i++) { if (V(1)) { @@ -544,7 +544,7 @@ describe('JS for loop', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, ctx)).toEqual('
abc12
'); @@ -587,20 +587,20 @@ describe('function calls', () => { } e(); } - rC(2); + cR(2); { let cm0 = V(0); { spanify({message: ctx.data[0]}, cm0); } v(); } - rc(); - rC(3); + cr(); + cR(3); { let cm0 = V(0); { spanify({message: ctx.data[1]}, cm0); } v(); } - rc(); + cr(); } expect(renderToHtml(Template, ctx)) diff --git a/packages/core/test/render3/di_spec.ts b/packages/core/test/render3/di_spec.ts index 465ac8b29c..f5d1ebddf5 100644 --- a/packages/core/test/render3/di_spec.ts +++ b/packages/core/test/render3/di_spec.ts @@ -9,7 +9,7 @@ import {ElementRef, TemplateRef, ViewContainerRef} from '@angular/core'; import {bloomFindPossibleInjector} from '../../src/render3/di'; -import {C, D, E, PublicFeature, T, V, b, b2, c, defineDirective, e, inject, injectElementRef, injectTemplateRef, injectViewContainerRef, rC, rc, t, v} from '../../src/render3/index'; +import {C, D, E, PublicFeature, T, V, b, b2, c, defineDirective, e, inject, injectElementRef, injectTemplateRef, injectViewContainerRef, cR, cr, t, v} from '../../src/render3/index'; import {bloomAdd, createLNode, createViewState, enterView, getOrCreateNodeInjector, leaveView} from '../../src/render3/instructions'; import {LNodeFlags, LNodeInjector} from '../../src/render3/l_node'; @@ -291,7 +291,7 @@ describe('di', () => { } e(); } - rC(2); + cR(2); { if (V(0)) { E(0, 'span'); @@ -305,7 +305,7 @@ describe('di', () => { t(3, b2('', D(1).value, '-', D(2).value, '')); v(); } - rc(); + cr(); } expect(renderToHtml(Template, {})).toEqual('
ParentDirective-true
'); diff --git a/packages/core/test/render3/exports_spec.ts b/packages/core/test/render3/exports_spec.ts index 6267d7b84e..17b6a46ddf 100644 --- a/packages/core/test/render3/exports_spec.ts +++ b/packages/core/test/render3/exports_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {C, D, E, T, V, a, b, c, defineComponent, defineDirective, e, k, p, rC, rc, t, v} from '../../src/render3/index'; +import {C, D, E, T, V, a, b, c, defineComponent, defineDirective, e, k, p, cR, cr, t, v} from '../../src/render3/index'; import {renderToHtml} from './render_util'; @@ -267,7 +267,7 @@ describe('exports', () => { } e(); } - rC(1); + cR(1); { if (ctx.condition) { let cm1 = V(1); @@ -283,7 +283,7 @@ describe('exports', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, { diff --git a/packages/core/test/render3/integration_spec.ts b/packages/core/test/render3/integration_spec.ts index 5ac13201da..0840f86666 100644 --- a/packages/core/test/render3/integration_spec.ts +++ b/packages/core/test/render3/integration_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {C, D, E, NC, T, V, a, b, b1, b2, b3, b4, b5, b6, b7, b8, bV, c, defineComponent, e, k, p, r, rC, rc, s, t, v} from '../../src/render3/index'; +import {C, D, E, NC, T, V, a, b, b1, b2, b3, b4, b5, b6, b7, b8, bV, c, defineComponent, e, k, p, r, cR, cr, s, t, v} from '../../src/render3/index'; import {NO_CHANGE} from '../../src/render3/instructions'; import {containerEl, renderToHtml} from './render_util'; @@ -363,7 +363,7 @@ describe('iv integration test', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -374,7 +374,7 @@ describe('iv integration test', () => { v(); } } - rc(); + cr(); }, factory: () => new MyComp, inputs: {condition: 'condition'} @@ -487,7 +487,7 @@ describe('iv integration test', () => { e(); } a(0, 'title', b(ctx.title)); - rC(1); + cR(1); { if (true) { let cm1 = V(1); @@ -502,7 +502,7 @@ describe('iv integration test', () => { v(); } } - rc(); + cr(); } // initial binding @@ -602,7 +602,7 @@ describe('iv integration test', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -613,7 +613,7 @@ describe('iv integration test', () => { v(); } } - rc(); + cr(); } expect((Template as any).ngStaticData).toBeUndefined(); diff --git a/packages/core/test/render3/lifecycle_spec.ts b/packages/core/test/render3/lifecycle_spec.ts index d2a539690f..4780475908 100644 --- a/packages/core/test/render3/lifecycle_spec.ts +++ b/packages/core/test/render3/lifecycle_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {C, ComponentTemplate, D, E, L, LifeCycleGuard, T, V, b, c, defineComponent, e, l, p, rC, rc, v} from '../../src/render3/index'; +import {C, ComponentTemplate, D, E, L, LifecycleHook, T, V, b, c, defineComponent, e, l, p, cR, cr, v} from '../../src/render3/index'; import {containerEl, renderToHtml} from './render_util'; describe('lifecycles', () => { @@ -36,7 +36,7 @@ describe('lifecycles', () => { tag: name, factory: () => { const comp = new Component(); - l(LifeCycleGuard.ON_DESTROY, comp, comp.ngOnDestroy); + l(LifecycleHook.ON_DESTROY, comp, comp.ngOnDestroy); return comp; }, inputs: {val: 'val'}, @@ -57,7 +57,7 @@ describe('lifecycles', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -69,7 +69,7 @@ describe('lifecycles', () => { v(); } } - rc(); + cr(); } renderToHtml(Template, {condition: true}); @@ -90,7 +90,7 @@ describe('lifecycles', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -108,7 +108,7 @@ describe('lifecycles', () => { v(); } } - rc(); + cr(); } renderToHtml(Template, {condition: true}); @@ -130,7 +130,7 @@ describe('lifecycles', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -142,7 +142,7 @@ describe('lifecycles', () => { v(); } } - rc(); + cr(); } renderToHtml(Template, {condition: true}); @@ -174,7 +174,7 @@ describe('lifecycles', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -186,7 +186,7 @@ describe('lifecycles', () => { v(); } } - rc(); + cr(); } renderToHtml(Template, {condition: true}); @@ -211,7 +211,7 @@ describe('lifecycles', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -226,7 +226,7 @@ describe('lifecycles', () => { } p(0, 'val', b('1')); Comp.ngComponentDef.r(1, 0); - rC(2); + cR(2); { if (ctx.condition2) { if (V(0)) { @@ -239,13 +239,13 @@ describe('lifecycles', () => { v(); } } - rc(); + cr(); p(3, 'val', b('3')); Comp.ngComponentDef.r(4, 3); v(); } } - rc(); + cr(); } renderToHtml(Template, {condition: true, condition2: true}); @@ -289,7 +289,7 @@ describe('lifecycles', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -304,7 +304,7 @@ describe('lifecycles', () => { } p(0, 'val', b('1')); Comp.ngComponentDef.r(1, 0); - rC(2); + cR(2); { for (let j = 2; j < ctx.len; j++) { if (V(0)) { @@ -317,13 +317,13 @@ describe('lifecycles', () => { v(); } } - rc(); + cr(); p(3, 'val', b('5')); Comp.ngComponentDef.r(4, 3); v(); } } - rc(); + cr(); } /** @@ -369,7 +369,7 @@ describe('lifecycles', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -393,7 +393,7 @@ describe('lifecycles', () => { v(); } } - rc(); + cr(); } class App { diff --git a/packages/core/test/render3/listeners_spec.ts b/packages/core/test/render3/listeners_spec.ts index c124c833b8..e8a5b4288c 100644 --- a/packages/core/test/render3/listeners_spec.ts +++ b/packages/core/test/render3/listeners_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {C, D, E, L, T, V, c, defineComponent, e, rC, rc, v} from '../../src/render3/index'; +import {C, D, E, L, T, V, c, defineComponent, e, cR, cr, v} from '../../src/render3/index'; import {containerEl, renderComponent, renderToHtml} from './render_util'; @@ -89,7 +89,7 @@ describe('event listeners', () => { if (cm) { C(0); } - rC(0); + cR(0); { if (ctx.showing) { if (V(1)) { @@ -103,7 +103,7 @@ describe('event listeners', () => { v(); } } - rc(); + cr(); } let comp = new MyComp(); @@ -138,7 +138,7 @@ describe('event listeners', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.showing) { if (V(0)) { @@ -146,7 +146,7 @@ describe('event listeners', () => { C(1); c(); } - rC(1); + cR(1); { if (ctx.button) { if (V(0)) { @@ -160,11 +160,11 @@ describe('event listeners', () => { v(); } } - rc(); + cr(); v(); } } - rc(); + cr(); } const comp = {showing: true, counter: 0, button: true, onClick: function() { this.counter++; }}; @@ -198,7 +198,7 @@ describe('event listeners', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.showing) { if (V(0)) { @@ -215,7 +215,7 @@ describe('event listeners', () => { v(); } } - rc(); + cr(); } const ctx = {showing: true}; @@ -255,7 +255,7 @@ describe('event listeners', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -265,7 +265,7 @@ describe('event listeners', () => { C(2); c(); } - rC(1); + cR(1); { if (ctx.sub1) { if (V(0)) { @@ -279,8 +279,8 @@ describe('event listeners', () => { v(); } } - rc(); - rC(2); + cr(); + cR(2); { if (ctx.sub2) { if (V(0)) { @@ -294,11 +294,11 @@ describe('event listeners', () => { v(); } } - rc(); + cr(); v(); } } - rc(); + cr(); } const ctx = {condition: true, counter1: 0, counter2: 0, sub1: true, sub2: true}; diff --git a/packages/core/test/render3/outputs_spec.ts b/packages/core/test/render3/outputs_spec.ts index 5ca50924e1..518b99473a 100644 --- a/packages/core/test/render3/outputs_spec.ts +++ b/packages/core/test/render3/outputs_spec.ts @@ -8,7 +8,7 @@ import {EventEmitter} from '@angular/core'; -import {C, D, E, L, LifeCycleGuard, T, V, b, c, defineComponent, defineDirective, e, l, p, rC, rc, v} from '../../src/render3/index'; +import {C, D, E, L, LifecycleHook, T, V, b, c, defineComponent, defineDirective, e, l, p, cR, cr, v} from '../../src/render3/index'; import {containerEl, renderToHtml} from './render_util'; @@ -129,7 +129,7 @@ describe('outputs', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -144,7 +144,7 @@ describe('outputs', () => { v(); } } - rc(); + cr(); } let counter = 0; @@ -176,14 +176,14 @@ describe('outputs', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition2) { if (V(0)) { @@ -198,11 +198,11 @@ describe('outputs', () => { v(); } } - rc(); + cr(); v(); } } - rc(); + cr(); } let counter = 0; @@ -232,7 +232,7 @@ describe('outputs', () => { template: function(ctx: any, cm: boolean) {}, factory: () => { destroyComp = new DestroyComp(); - l(LifeCycleGuard.ON_DESTROY, destroyComp, destroyComp.ngOnDestroy); + l(LifecycleHook.ON_DESTROY, destroyComp, destroyComp.ngOnDestroy); return destroyComp; } }); @@ -250,7 +250,7 @@ describe('outputs', () => { C(0); c(); } - rC(0); + cR(0); { if (ctx.condition) { if (V(0)) { @@ -275,7 +275,7 @@ describe('outputs', () => { v(); } } - rc(); + cr(); } let clickCounter = 0; @@ -420,7 +420,7 @@ describe('outputs', () => { C(2); c(); } - rC(2); + cR(2); { if (ctx.condition) { if (V(0)) { @@ -445,7 +445,7 @@ describe('outputs', () => { v(); } } - rc(); + cr(); } let counter = 0; diff --git a/packages/core/test/render3/properties_spec.ts b/packages/core/test/render3/properties_spec.ts index d0bb71df45..566b76392c 100644 --- a/packages/core/test/render3/properties_spec.ts +++ b/packages/core/test/render3/properties_spec.ts @@ -8,7 +8,7 @@ import {EventEmitter} from '@angular/core'; -import {C, D, E, L, T, V, b, b1, c, defineComponent, defineDirective, e, p, rC, rc, t, v} from '../../src/render3/index'; +import {C, D, E, L, T, V, b, b1, c, defineComponent, defineDirective, e, p, cR, cr, t, v} from '../../src/render3/index'; import {NO_CHANGE} from '../../src/render3/instructions'; import {renderToHtml} from './render_util'; @@ -270,7 +270,7 @@ describe('elementProperty', () => { c(); } p(0, 'id', b(ctx.id1)); - rC(3); + cR(3); { if (ctx.condition) { if (V(0)) { @@ -293,7 +293,7 @@ describe('elementProperty', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, {condition: true, id1: 'one', id2: 'two', id3: 'three'})) @@ -467,7 +467,7 @@ describe('elementProperty', () => { C(2); c(); } - rC(2); + cR(2); { if (ctx.condition) { if (V(0)) { @@ -485,7 +485,7 @@ describe('elementProperty', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, { @@ -530,7 +530,7 @@ describe('elementProperty', () => { C(0); c(); } - rC(0); + cR(0); { for (let i = 0; i < 2; i++) { if (V(0)) { @@ -542,7 +542,7 @@ describe('elementProperty', () => { v(); } } - rc(); + cr(); } expect(renderToHtml(Template, {})) diff --git a/packages/core/test/render3/query_spec.ts b/packages/core/test/render3/query_spec.ts index edb77de5e5..1097f7fb32 100644 --- a/packages/core/test/render3/query_spec.ts +++ b/packages/core/test/render3/query_spec.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {D, E, Q, QueryList, e, m, rQ} from '../../src/render3/index'; +import {D, E, Q, QueryList, e, m, qR} from '../../src/render3/index'; import {createComponent, renderComponent} from './render_util'; @@ -40,8 +40,8 @@ describe('query', () => { } e(); } - rQ(tmp = m>(0)) && (ctx.query0 = tmp as QueryList); - rQ(tmp = m>(1)) && (ctx.query1 = tmp as QueryList); + qR(tmp = m>(0)) && (ctx.query0 = tmp as QueryList); + qR(tmp = m>(1)) && (ctx.query1 = tmp as QueryList); }); const parent = renderComponent(Cmp);