iSharkFly-Docs
/
angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(ivy): update specs to make use of the `element()` instruction (#25173) 

PR Close #25173
This commit is contained in:
Victor Berchet 2018-07-27 14:28:22 -07:00 committed by Igor Minar
parent f82b6b2ed7
commit 89e8b6fc0e
17 changed files with 257 additions and 502 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/core/src/render3/instructions.ts
View File

@ -635,9 +635,11 @@ export function namespaceHTML() {
* @param localRefs A set of local reference bindings on the element.
*/
export function element(
index: number, name: string, attrs?: TAttributes | null, localRefs?: string[] | null): void {
elementStart(index, name, attrs, localRefs);
index: number, name: string, attrs?: TAttributes | null,
localRefs?: string[] | null): RElement {
const rElement = elementStart(index, name, attrs, localRefs);
elementEnd();
return rElement;
}
/**
@ -1113,7 +1115,7 @@ export function storeCleanupFn(view: LViewData, cleanupFn: Function): void {
}
/** Mark the end of the element. */
export function elementEnd() {
export function elementEnd(): void {
if (isParent) {
isParent = false;
} else {

42
packages/core/test/render3/change_detection_spec.ts
View File

@ -11,8 +11,9 @@ import {withBody} from '@angular/core/testing';
import {ChangeDetectionStrategy, ChangeDetectorRef, DoCheck} from '../../src/core';
import {getRenderedText, whenRendered} from '../../src/render3/component';
import {LifecycleHooksFeature, defineComponent, defineDirective, injectChangeDetectorRef} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, detectChanges, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, interpolation1, interpolation2, listener, markDirty, text, textBinding, tick} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, detectChanges, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, interpolation1, interpolation2, listener, markDirty, text, textBinding, tick} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {containerEl, createComponent, renderComponent, requestAnimationFrame} from './render_util';
describe('change detection', () => {
@ -130,8 +131,7 @@ describe('change detection', () => {
/** <my-comp [name]="name"></my-comp> */
template: (rf: RenderFlags, ctx: MyApp) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'my-comp');
elementEnd();
element(0, 'my-comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'name', bind(ctx.name));
@ -201,8 +201,7 @@ describe('change detection', () => {
const ButtonParent = createComponent('button-parent', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'my-comp');
elementEnd();
element(0, 'my-comp');
elementStart(1, 'button', ['id', 'parent']);
{ listener('click', () => noop()); }
elementEnd();
@ -233,8 +232,7 @@ describe('change detection', () => {
template: (rf: RenderFlags, ctx: ButtonParent) => {
if (rf & RenderFlags.Create) {
text(0);
elementStart(1, 'my-comp');
elementEnd();
element(1, 'my-comp');
}
if (rf & RenderFlags.Update) {
textBinding(0, interpolation1('', ctx.doCheckCount, ' - '));
@ -247,8 +245,7 @@ describe('change detection', () => {
const MyButtonApp = createComponent('my-button-app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'button-parent');
elementEnd();
element(0, 'button-parent');
}
}, [ButtonParent]);
@ -321,8 +318,7 @@ describe('change detection', () => {
template: (rf: RenderFlags, ctx: ParentComp) => {
if (rf & RenderFlags.Create) {
text(0);
elementStart(1, 'my-comp');
elementEnd();
element(1, 'my-comp');
}
if (rf & RenderFlags.Update) {
textBinding(0, interpolation1('', ctx.doCheckCount, ' - '));
@ -400,8 +396,7 @@ describe('change detection', () => {
/** <my-comp dir></my-comp> */
const MyApp = createComponent('my-app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'my-comp', ['dir', '']);
elementEnd();
element(0, 'my-comp', ['dir', '']);
}
}, [MyComp, Dir]);
@ -421,8 +416,7 @@ describe('change detection', () => {
const MyApp = createComponent('my-app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
text(0);
elementStart(1, 'div', ['dir', '']);
elementEnd();
element(1, 'div', ['dir', '']);
}
if (rf & RenderFlags.Update) {
textBinding(1, bind(ctx.value));
@ -468,8 +462,7 @@ describe('change detection', () => {
if (ctx.showing) {
let rf0 = embeddedViewStart(0);
if (rf0 & RenderFlags.Create) {
elementStart(0, 'div', ['dir', '']);
elementEnd();
element(0, 'div', ['dir', '']);
}
}
embeddedViewEnd();
@ -566,8 +559,7 @@ describe('change detection', () => {
/** <detached-comp></detached-comp> */
template: (rf: RenderFlags, ctx: MyApp) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'detached-comp');
elementEnd();
element(0, 'detached-comp');
}
},
directives: () => [DetachedComp]
@ -702,8 +694,7 @@ describe('change detection', () => {
/** <on-push-comp [value]="value"></on-push-comp> */
const OnPushApp = createComponent('on-push-app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'on-push-comp');
elementEnd();
element(0, 'on-push-comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'value', bind(ctx.value));
@ -772,8 +763,7 @@ describe('change detection', () => {
template: (rf: RenderFlags, ctx: OnPushParent) => {
if (rf & RenderFlags.Create) {
text(0);
elementStart(1, 'on-push-comp');
elementEnd();
element(1, 'on-push-comp');
}
if (rf & RenderFlags.Update) {
textBinding(0, interpolation1('', ctx.value, ' - '));
@ -852,8 +842,7 @@ describe('change detection', () => {
if (ctx.showing) {
let rf0 = embeddedViewStart(0);
if (rf0 & RenderFlags.Create) {
elementStart(0, 'on-push-comp');
elementEnd();
element(0, 'on-push-comp');
}
embeddedViewEnd();
}
@ -937,8 +926,7 @@ describe('change detection', () => {
template: (rf: RenderFlags, ctx: AppComp) => {
if (rf & RenderFlags.Create) {
text(0);
elementStart(1, 'no-changes-comp');
elementEnd();
element(1, 'no-changes-comp');
}
if (rf & RenderFlags.Update) {
textBinding(0, interpolation1('', ctx.value, ' - '));

20
packages/core/test/render3/component_spec.ts
View File

@ -10,7 +10,7 @@
import {DoCheck, ViewEncapsulation, createInjector, defineInjectable, defineInjector} from '../../src/core';
import {getRenderedText} from '../../src/render3/component';
import {ComponentFactory, LifecycleHooksFeature, defineComponent, directiveInject, markDirty} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, text, textBinding, tick} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, text, textBinding, tick} from '../../src/render3/instructions';
import {ComponentDefInternal, DirectiveDefInternal, RenderFlags} from '../../src/render3/interfaces/definition';
import {createRendererType2} from '../../src/view/index';
@ -156,8 +156,7 @@ describe('component with a container', () => {
function template(rf: RenderFlags, ctx: {items: string[]}) {
if (rf & RenderFlags.Create) {
elementStart(0, 'wrapper');
elementEnd();
element(0, 'wrapper');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'items', bind(ctx.items));
@ -185,8 +184,7 @@ describe('encapsulation', () => {
selectors: [['wrapper']],
template: function(rf: RenderFlags, ctx: WrapperComponent) {
if (rf & RenderFlags.Create) {
elementStart(0, 'encapsulated');
elementEnd();
element(0, 'encapsulated');
}
},
factory: () => new WrapperComponent,
@ -201,8 +199,7 @@ describe('encapsulation', () => {
template: function(rf: RenderFlags, ctx: EncapsulatedComponent) {
if (rf & RenderFlags.Create) {
text(0, 'foo');
elementStart(1, 'leaf');
elementEnd();
element(1, 'leaf');
}
},
factory: () => new EncapsulatedComponent,
@ -248,8 +245,7 @@ describe('encapsulation', () => {
selectors: [['wrapper']],
template: function(rf: RenderFlags, ctx: WrapperComponentWith) {
if (rf & RenderFlags.Create) {
elementStart(0, 'leaf');
elementEnd();
element(0, 'leaf');
}
},
factory: () => new WrapperComponentWith,
@ -316,8 +312,7 @@ describe('recursive components', () => {
if (ctx.data.left != null) {
let rf0 = embeddedViewStart(0);
if (rf0 & RenderFlags.Create) {
elementStart(0, 'tree-comp');
elementEnd();
element(0, 'tree-comp');
}
if (rf0 & RenderFlags.Update) {
elementProperty(0, 'data', bind(ctx.data.left));
@ -331,8 +326,7 @@ describe('recursive components', () => {
if (ctx.data.right != null) {
let rf0 = embeddedViewStart(0);
if (rf0 & RenderFlags.Create) {
elementStart(0, 'tree-comp');
elementEnd();
element(0, 'tree-comp');
}
if (rf0 & RenderFlags.Update) {
elementProperty(0, 'data', bind(ctx.data.right));

19
packages/core/test/render3/content_spec.ts
View File

@ -12,7 +12,7 @@ import {Input, TemplateRef, ViewContainerRef, ViewRef} from '../../src/core';
import {defineDirective} from '../../src/render3/definition';
import {injectTemplateRef, injectViewContainerRef} from '../../src/render3/di';
import {AttributeMarker, detectChanges} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, loadDirective, projection, projectionDef, text} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, loadDirective, projection, projectionDef, text} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {ComponentFixture, createComponent, renderComponent, toHtml} from './render_util';
@ -169,10 +169,7 @@ describe('content projection', () => {
const Parent = createComponent('parent', (rf: RenderFlags, ctx: any) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'child');
{
elementStart(1, 'projected-comp');
elementEnd();
}
{ element(1, 'projected-comp'); }
elementEnd();
}
}, [Child, ProjectedComp]);
@ -506,8 +503,7 @@ describe('content projection', () => {
/** <child></child> */
const Parent = createComponent('parent', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'child');
elementEnd();
element(0, 'child');
// testing
childCmptInstance = loadDirective(0);
@ -1539,8 +1535,7 @@ describe('content projection', () => {
if (rf & RenderFlags.Create) {
projectionDef([[['span']]], ['span']);
projection(0, 1);
elementStart(1, 'hr');
elementEnd();
element(1, 'hr');
projection(2);
}
});
@ -1603,8 +1598,7 @@ describe('content projection', () => {
[[['', 'card-title', '']], [['', 'card-content', '']]],
['[card-title]', '[card-content]']);
projection(0, 1);
elementStart(1, 'hr');
elementEnd();
element(1, 'hr');
projection(2, 2);
}
});
@ -1662,8 +1656,7 @@ describe('content projection', () => {
[[['', 'card-title', '']], [['', 'card-content', '']]],
['[card-title]', '[card-content]']);
projection(0, 1);
elementStart(1, 'hr');
elementEnd();
element(1, 'hr');
projection(2, 2);
}
});

21
packages/core/test/render3/control_flow_spec.ts
View File

@ -7,8 +7,9 @@
*/
import {defineComponent} from '../../src/render3/definition';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementStart, embeddedViewEnd, embeddedViewStart, text, textBinding} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementStart, embeddedViewEnd, embeddedViewStart, text, textBinding} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {ComponentFixture, TemplateFixture, createComponent, renderToHtml} from './render_util';
describe('JS control flow', () => {
@ -673,8 +674,7 @@ describe('JS control flow', () => {
factory: () => new App(),
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div');
elementEnd();
element(0, 'div');
container(1);
container(2);
}
@ -684,8 +684,7 @@ describe('JS control flow', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}
@ -696,8 +695,7 @@ describe('JS control flow', () => {
if (ctx.condition2) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}
@ -740,8 +738,7 @@ describe('JS control flow', () => {
factory: () => new App(),
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div');
elementEnd();
element(0, 'div');
container(1);
container(2);
}
@ -751,8 +748,7 @@ describe('JS control flow', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}
@ -763,8 +759,7 @@ describe('JS control flow', () => {
if (ctx.condition2) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}

13
packages/core/test/render3/directive_spec.ts
View File

@ -9,7 +9,7 @@
import {EventEmitter} from '@angular/core';
import {AttributeMarker, defineDirective} from '../../src/render3/index';
import {bind, elementEnd, elementProperty, elementStart, listener, loadDirective} from '../../src/render3/instructions';
import {bind, element, elementEnd, elementProperty, elementStart, listener, loadDirective} from '../../src/render3/instructions';
import {TemplateFixture} from './render_util';
@ -33,10 +33,7 @@ describe('directive', () => {
});
}
function Template() {
elementStart(0, 'span', [AttributeMarker.SelectOnly, 'dir']);
elementEnd();
}
function Template() { element(0, 'span', [AttributeMarker.SelectOnly, 'dir']); }
const fixture = new TemplateFixture(Template, () => {}, [Directive]);
expect(fixture.html).toEqual('<span class="foo"></span>');
@ -84,8 +81,7 @@ describe('directive', () => {
*/
function createTemplate() {
// using 2 bindings to show example shape of attributes array
elementStart(0, 'span', ['class', 'fade', AttributeMarker.SelectOnly, 'test', 'other']);
elementEnd();
element(0, 'span', ['class', 'fade', AttributeMarker.SelectOnly, 'test', 'other']);
}
function updateTemplate() { elementProperty(0, 'test', bind(false)); }
@ -136,9 +132,8 @@ describe('directive', () => {
*/
function createTemplate() {
// putting name (test) in the "usual" value position
elementStart(
element(
0, 'span', ['class', 'fade', AttributeMarker.SelectOnly, 'prop1', 'test', 'prop2']);
elementEnd();
}
function updateTemplate() {

53
packages/core/test/render3/exports_spec.ts
View File

@ -7,7 +7,7 @@
*/
import {defineComponent, defineDirective} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementAttribute, elementClassProp, elementEnd, elementProperty, elementStart, elementStyling, elementStylingApply, embeddedViewEnd, embeddedViewStart, load, text, textBinding} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementAttribute, elementClassProp, elementEnd, elementProperty, elementStart, elementStyling, elementStylingApply, embeddedViewEnd, embeddedViewStart, load, text, textBinding} from '../../src/render3/instructions';
import {InitialStylingFlags, RenderFlags} from '../../src/render3/interfaces/definition';
import {ComponentFixture, createComponent, renderToHtml} from './render_util';
@ -18,8 +18,7 @@ describe('exports', () => {
/** <input value="one" #myInput> {{ myInput.value }} */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'input', ['value', 'one'], ['myInput', '']);
elementEnd();
element(0, 'input', ['value', 'one'], ['myInput', '']);
text(2);
}
let tmp: any;
@ -37,8 +36,7 @@ describe('exports', () => {
/** <comp #myComp></comp> {{ myComp.name }} */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp', null, ['myComp', '']);
elementEnd();
element(0, 'comp', null, ['myComp', '']);
text(2);
}
let tmp: any;
@ -93,10 +91,8 @@ describe('exports', () => {
/** <comp #myComp></comp> <div [myDir]="myComp"></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp', null, ['myComp', '']);
elementEnd();
elementStart(2, 'div', ['myDir', '']);
elementEnd();
element(0, 'comp', null, ['myComp', '']);
element(2, 'div', ['myDir', '']);
}
let tmp: any;
if (rf & RenderFlags.Update) {
@ -114,8 +110,7 @@ describe('exports', () => {
/** <div someDir #myDir="someDir"></div> {{ myDir.name }} */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['someDir', ''], ['myDir', 'someDir']);
elementEnd();
element(0, 'div', ['someDir', ''], ['myDir', 'someDir']);
text(2);
}
let tmp: any;
@ -143,8 +138,7 @@ describe('exports', () => {
/** <div #myDir="someDir"></div> */
const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', null, ['myDir', 'someDir']);
elementEnd();
element(0, 'div', null, ['myDir', 'someDir']);
}
});
@ -159,8 +153,7 @@ describe('exports', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
text(0);
elementStart(1, 'input', ['value', 'one'], ['myInput', '']);
elementEnd();
element(1, 'input', ['value', 'one'], ['myInput', '']);
}
const tmp = load(2) as any;
if (rf & RenderFlags.Update) {
@ -176,10 +169,8 @@ describe('exports', () => {
/** <div [title]="myInput.value"</div> <input value="one" #myInput> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div');
elementEnd();
elementStart(1, 'input', ['value', 'one'], ['myInput', '']);
elementEnd();
element(0, 'div');
element(1, 'input', ['value', 'one'], ['myInput', '']);
}
const tmp = load(2) as any;
if (rf & RenderFlags.Update) {
@ -194,10 +185,8 @@ describe('exports', () => {
/** <div [attr.aria-label]="myInput.value"</div> <input value="one" #myInput> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div');
elementEnd();
elementStart(1, 'input', ['value', 'one'], ['myInput', '']);
elementEnd();
element(0, 'div');
element(1, 'input', ['value', 'one'], ['myInput', '']);
}
const tmp = load(2) as any;
if (rf & RenderFlags.Update) {
@ -215,8 +204,7 @@ describe('exports', () => {
elementStart(0, 'div');
elementStyling([InitialStylingFlags.VALUES_MODE, 'red', true]);
elementEnd();
elementStart(1, 'input', ['type', 'checkbox', 'checked', 'true'], ['myInput', '']);
elementEnd();
element(1, 'input', ['type', 'checkbox', 'checked', 'true'], ['myInput', '']);
}
const tmp = load(2) as any;
if (rf & RenderFlags.Update) {
@ -262,10 +250,8 @@ describe('exports', () => {
/** <div [myDir]="myComp"></div><comp #myComp></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['myDir', '']);
elementEnd();
elementStart(1, 'comp', null, ['myComp', '']);
elementEnd();
element(0, 'div', ['myDir', '']);
element(1, 'comp', null, ['myComp', '']);
}
let tmp: any;
if (rf & RenderFlags.Update) {
@ -285,10 +271,8 @@ describe('exports', () => {
if (rf & RenderFlags.Create) {
text(0);
text(1);
elementStart(2, 'comp', null, ['myComp', '']);
elementEnd();
elementStart(4, 'input', ['value', 'one'], ['myInput', '']);
elementEnd();
element(2, 'comp', null, ['myComp', '']);
element(4, 'input', ['value', 'one'], ['myInput', '']);
}
let tmp1: any;
let tmp2: any;
@ -334,8 +318,7 @@ describe('exports', () => {
let tmp: any;
if (rf1 & RenderFlags.Create) {
text(0);
elementStart(1, 'input', ['value', 'one'], ['myInput', '']);
elementEnd();
element(1, 'input', ['value', 'one'], ['myInput', '']);
}
if (rf1 & RenderFlags.Update) {
tmp = load(2);

8
packages/core/test/render3/instructions_spec.ts
View File

@ -36,10 +36,7 @@ describe('instructions', () => {
elementEnd();
}
function createScript() {
elementStart(0, 'script');
elementEnd();
}
function createScript() { element(0, 'script'); }
describe('bind', () => {
it('should update bindings when value changes', () => {
@ -95,7 +92,7 @@ describe('instructions', () => {
it('should allow setting namespaced attributes', () => {
const t = new TemplateFixture(() => {
elementStart(0, 'div', [
element(0, 'div', [
// id="test"
'id',
'test',
@ -108,7 +105,6 @@ describe('instructions', () => {
'title',
'Hello',
]);
elementEnd();
});
const div = (t.hostNode.native as HTMLElement).querySelector('div') !;

50
packages/core/test/render3/integration_spec.ts
View File

@ -9,7 +9,7 @@
import {RenderFlags} from '@angular/core/src/render3';
import {defineComponent, defineDirective} from '../../src/render3/index';
import {NO_CHANGE, bind, container, containerRefreshEnd, containerRefreshStart, elementAttribute, elementClassProp, elementEnd, elementProperty, elementStart, elementStyleProp, elementStyling, elementStylingApply, embeddedViewEnd, embeddedViewStart, interpolation1, interpolation2, interpolation3, interpolation4, interpolation5, interpolation6, interpolation7, interpolation8, interpolationV, load, loadDirective, projection, projectionDef, text, textBinding} from '../../src/render3/instructions';
import {NO_CHANGE, bind, container, containerRefreshEnd, containerRefreshStart, element, elementAttribute, elementClassProp, elementEnd, elementProperty, elementStart, elementStyleProp, elementStyling, elementStylingApply, embeddedViewEnd, embeddedViewStart, interpolation1, interpolation2, interpolation3, interpolation4, interpolation5, interpolation6, interpolation7, interpolation8, interpolationV, load, loadDirective, projection, projectionDef, text, textBinding} from '../../src/render3/instructions';
import {InitialStylingFlags} from '../../src/render3/interfaces/definition';
import {HEADER_OFFSET} from '../../src/render3/interfaces/view';
import {sanitizeUrl} from '../../src/sanitization/sanitization';
@ -185,8 +185,7 @@ describe('render3 integration test', () => {
if (rf & RenderFlags.Create) {
elementStart(0, 'b');
{
elementStart(1, 'span');
elementEnd();
element(1, 'span');
elementStart(2, 'span', ['class', 'foo']);
{}
elementEnd();
@ -247,8 +246,7 @@ describe('render3 integration test', () => {
it('should support a basic component template', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'todo');
elementEnd();
element(0, 'todo');
}
}
@ -258,8 +256,7 @@ describe('render3 integration test', () => {
it('should support a component template with sibling', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'todo');
elementEnd();
element(0, 'todo');
text(1, 'two');
}
}
@ -273,10 +270,8 @@ describe('render3 integration test', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'todo');
elementEnd();
elementStart(1, 'todo');
elementEnd();
element(0, 'todo');
element(1, 'todo');
}
}
expect(renderToHtml(Template, null, defs))
@ -312,8 +307,7 @@ describe('render3 integration test', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'todo');
elementEnd();
element(0, 'todo');
}
}
@ -361,8 +355,7 @@ describe('render3 integration test', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
}
@ -409,8 +402,7 @@ describe('render3 integration test', () => {
/** <comp [condition]="condition"></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'condition', bind(ctx.condition));
@ -578,8 +570,7 @@ describe('render3 integration test', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'span');
elementEnd();
element(0, 'span');
}
if (rf & RenderFlags.Update) {
elementAttribute(0, 'title', bind(ctx.title));
@ -603,8 +594,7 @@ describe('render3 integration test', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'span');
elementEnd();
element(0, 'span');
}
if (rf & RenderFlags.Update) {
elementAttribute(0, 'title', bind(ctx.title));
@ -620,8 +610,7 @@ describe('render3 integration test', () => {
it('should update bindings', () => {
function Template(rf: RenderFlags, c: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'b');
elementEnd();
element(0, 'b');
}
if (rf & RenderFlags.Update) {
elementAttribute(0, 'a', interpolationV(c));
@ -727,8 +716,7 @@ describe('render3 integration test', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['hostBindingDir', '']);
elementEnd();
element(0, 'div', ['hostBindingDir', '']);
}
}
@ -847,8 +835,7 @@ describe('render3 integration test', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'div');
elementEnd();
element(0, 'div');
}
embeddedViewEnd();
}
@ -889,8 +876,7 @@ describe('render3 integration test', () => {
factory: () => new SanitizationComp(),
template: (rf: RenderFlags, ctx: SanitizationComp) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'a');
elementEnd();
element(0, 'a');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'href', bind(ctx.href), sanitizeUrl);
@ -909,13 +895,13 @@ describe('render3 integration test', () => {
fixture.component.updateLink('http://foo');
fixture.update();
const element = fixture.hostElement.querySelector('a') !;
expect(element.getAttribute('href')).toEqual('http://bar');
const anchor = fixture.hostElement.querySelector('a') !;
expect(anchor.getAttribute('href')).toEqual('http://bar');
fixture.component.updateLink(sanitizer.bypassSecurityTrustUrl('http://foo'));
fixture.update();
expect(element.getAttribute('href')).toEqual('http://foo');
expect(anchor.getAttribute('href')).toEqual('http://foo');
});
});
});

270
packages/core/test/render3/lifecycle_spec.ts
View File

@ -8,7 +8,7 @@
import {OnDestroy, SimpleChanges} from '../../src/core';
import {AttributeMarker, ComponentTemplate, LifecycleHooksFeature, NgOnChangesFeature, defineComponent, defineDirective} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, listener, markDirty, projection, projectionDef, store, text} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, listener, markDirty, projection, projectionDef, store, text} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {NgIf} from './common_with_def';
@ -19,8 +19,7 @@ describe('lifecycles', () => {
function getParentTemplate(name: string) {
return (rf: RenderFlags, ctx: any) => {
if (rf & RenderFlags.Create) {
elementStart(0, name);
elementEnd();
element(0, name);
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', bind(ctx.val));
@ -78,8 +77,7 @@ describe('lifecycles', () => {
/** <comp [val]="val"></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', bind(ctx.val));
@ -110,8 +108,7 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
}
@ -129,10 +126,8 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
elementStart(1, 'parent');
elementEnd();
element(0, 'parent');
element(1, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -162,8 +157,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}
@ -234,8 +228,7 @@ describe('lifecycles', () => {
/** <comp directive></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp', ['dir', '']);
elementEnd();
element(0, 'comp', ['dir', '']);
}
}
@ -251,8 +244,7 @@ describe('lifecycles', () => {
/** <div directive></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['dir', '']);
elementEnd();
element(0, 'div', ['dir', '']);
}
}
@ -274,11 +266,9 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
container(1);
elementStart(2, 'comp');
elementEnd();
element(2, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -288,8 +278,7 @@ describe('lifecycles', () => {
for (let j = 2; j < 5; j++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', j);
@ -319,11 +308,9 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
container(1);
elementStart(2, 'parent');
elementEnd();
element(2, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -333,8 +320,7 @@ describe('lifecycles', () => {
for (let j = 2; j < 5; j++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', j);
@ -402,8 +388,7 @@ describe('lifecycles', () => {
/** <comp></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
}
@ -431,8 +416,7 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
}
@ -444,8 +428,7 @@ describe('lifecycles', () => {
/** <comp></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
}
@ -460,8 +443,7 @@ describe('lifecycles', () => {
/** <comp directive></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp', ['dir', '']);
elementEnd();
element(0, 'comp', ['dir', '']);
}
}
@ -477,8 +459,7 @@ describe('lifecycles', () => {
/** <div directive></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['dir', '']);
elementEnd();
element(0, 'div', ['dir', '']);
}
}
@ -860,8 +841,7 @@ describe('lifecycles', () => {
/** <comp directive></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp', ['dir', '']);
elementEnd();
element(0, 'comp', ['dir', '']);
}
}
@ -873,8 +853,7 @@ describe('lifecycles', () => {
/** <div directive></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['dir', '']);
elementEnd();
element(0, 'div', ['dir', '']);
}
}
@ -944,8 +923,7 @@ describe('lifecycles', () => {
/** <comp></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
}
@ -981,8 +959,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}
@ -1010,8 +987,7 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
}
@ -1029,10 +1005,8 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
elementStart(1, 'parent');
elementEnd();
element(0, 'parent');
element(1, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -1053,10 +1027,7 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
{
elementStart(1, 'projected');
elementEnd();
}
{ element(1, 'projected'); }
elementEnd();
}
}
@ -1077,16 +1048,10 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
{
elementStart(1, 'projected');
elementEnd();
}
{ element(1, 'projected'); }
elementEnd();
elementStart(2, 'comp');
{
elementStart(3, 'projected');
elementEnd();
}
{ element(3, 'projected'); }
elementEnd();
}
if (rf & RenderFlags.Update) {
@ -1110,10 +1075,7 @@ describe('lifecycles', () => {
const ParentComp = createAfterViewInitComponent('parent', (rf: RenderFlags, ctx: any) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
{
elementStart(1, 'projected');
elementEnd();
}
{ element(1, 'projected'); }
elementEnd();
}
if (rf & RenderFlags.Update) {
@ -1128,10 +1090,8 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
elementStart(1, 'parent');
elementEnd();
element(0, 'parent');
element(1, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -1153,11 +1113,9 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
container(1);
elementStart(2, 'comp');
elementEnd();
element(2, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -1167,8 +1125,7 @@ describe('lifecycles', () => {
for (let i = 2; i < 4; i++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', i);
@ -1195,11 +1152,9 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
container(1);
elementStart(2, 'parent');
elementEnd();
element(2, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -1209,8 +1164,7 @@ describe('lifecycles', () => {
for (let i = 2; i < 4; i++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', i);
@ -1234,8 +1188,7 @@ describe('lifecycles', () => {
/** <comp></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
}
@ -1259,8 +1212,7 @@ describe('lifecycles', () => {
/** <comp [val]="myVal"></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', bind(ctx.myVal));
@ -1284,11 +1236,9 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
container(1);
elementStart(2, 'parent');
elementEnd();
element(2, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -1298,8 +1248,7 @@ describe('lifecycles', () => {
for (let i = 2; i < 4; i++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', i);
@ -1327,8 +1276,7 @@ describe('lifecycles', () => {
/** <comp directive></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp', ['dir', '']);
elementEnd();
element(0, 'comp', ['dir', '']);
}
}
@ -1340,8 +1288,7 @@ describe('lifecycles', () => {
/** <div directive></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['dir', '']);
elementEnd();
element(0, 'div', ['dir', '']);
}
}
@ -1383,8 +1330,7 @@ describe('lifecycles', () => {
let Grandparent = createOnDestroyComponent('grandparent', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
}, [Parent]);
@ -1416,8 +1362,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}
@ -1449,10 +1394,8 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
elementStart(1, 'comp');
elementEnd();
element(0, 'comp');
element(1, 'comp');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', bind('1'));
@ -1489,8 +1432,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
embeddedViewEnd();
}
@ -1524,8 +1466,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'grandparent');
elementEnd();
element(0, 'grandparent');
}
embeddedViewEnd();
}
@ -1561,16 +1502,10 @@ describe('lifecycles', () => {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
{
elementStart(1, 'projected');
elementEnd();
}
{ element(1, 'projected'); }
elementEnd();
elementStart(2, 'comp');
{
elementStart(3, 'projected');
elementEnd();
}
{ element(3, 'projected'); }
elementEnd();
}
if (rf1 & RenderFlags.Update) {
@ -1614,11 +1549,9 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
container(1);
elementStart(2, 'comp');
elementEnd();
element(2, 'comp');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', bind('1'));
@ -1628,8 +1561,7 @@ describe('lifecycles', () => {
if (ctx.condition2) {
let rf2 = embeddedViewStart(0);
if (rf2 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf2 & RenderFlags.Update) {
elementProperty(0, 'val', bind('2'));
@ -1692,11 +1624,9 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
container(1);
elementStart(2, 'comp');
elementEnd();
element(2, 'comp');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val', bind('1'));
@ -1706,8 +1636,7 @@ describe('lifecycles', () => {
for (let j = 2; j < ctx.len; j++) {
let rf2 = embeddedViewStart(0);
if (rf2 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf2 & RenderFlags.Update) {
elementProperty(0, 'val', bind(j));
@ -1778,8 +1707,7 @@ describe('lifecycles', () => {
text(1, 'Click me');
}
elementEnd();
elementStart(2, 'comp');
elementEnd();
element(2, 'comp');
elementStart(3, 'button');
{
listener('click', ctx.onClick.bind(ctx));
@ -1834,8 +1762,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp', ['dir', '']);
elementEnd();
element(0, 'comp', ['dir', '']);
}
embeddedViewEnd();
}
@ -1869,8 +1796,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'div', ['dir', '']);
elementEnd();
element(0, 'div', ['dir', '']);
}
embeddedViewEnd();
}
@ -1903,8 +1829,7 @@ describe('lifecycles', () => {
});
const Parent = createOnChangesComponent('parent', (rf: RenderFlags, ctx: any) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(ctx.a));
@ -1966,8 +1891,7 @@ describe('lifecycles', () => {
/** <comp [val1]="val1" [publicName]="val2"></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(ctx.val1));
@ -1992,8 +1916,7 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(ctx.val1));
@ -2018,10 +1941,8 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
elementStart(1, 'parent');
elementEnd();
element(0, 'parent');
element(1, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(1));
@ -2058,8 +1979,7 @@ describe('lifecycles', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val1', bind(1));
@ -2155,8 +2075,7 @@ describe('lifecycles', () => {
/** <comp directive></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp', ['dir', '']);
elementEnd();
element(0, 'comp', ['dir', '']);
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(1));
@ -2180,8 +2099,7 @@ describe('lifecycles', () => {
/** <div directive></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['dir', '']);
elementEnd();
element(0, 'div', ['dir', '']);
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(1));
@ -2207,11 +2125,9 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
container(1);
elementStart(2, 'comp');
elementEnd();
element(2, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(1));
@ -2223,8 +2139,7 @@ describe('lifecycles', () => {
for (let j = 2; j < 5; j++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val1', bind(j));
@ -2261,11 +2176,9 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
container(1);
elementStart(2, 'parent');
elementEnd();
element(2, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val1', bind(1));
@ -2277,8 +2190,7 @@ describe('lifecycles', () => {
for (let j = 2; j < 5; j++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
element(0, 'parent');
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'val1', bind(j));
@ -2353,10 +2265,8 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
elementStart(1, 'comp');
elementEnd();
element(0, 'comp');
element(1, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -2386,8 +2296,7 @@ describe('lifecycles', () => {
/** <comp [val]="val"></comp> */
const Parent = createAllHooksComponent('parent', (rf: RenderFlags, ctx: any) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', bind(ctx.val));
@ -2400,10 +2309,8 @@ describe('lifecycles', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
elementEnd();
elementStart(1, 'parent');
elementEnd();
element(0, 'parent');
element(1, 'parent');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'val', 1);
@ -2448,8 +2355,7 @@ describe('lifecycles', () => {
if (rf & RenderFlags.Create) {
projectionDef();
projection(0);
elementStart(1, 'view');
elementEnd();
element(1, 'view');
}
if (rf & RenderFlags.Update) {
elementProperty(1, 'val', bind(ctx.val));
@ -2467,16 +2373,10 @@ describe('lifecycles', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent');
{
elementStart(1, 'content');
elementEnd();
}
{ element(1, 'content'); }
elementEnd();
elementStart(2, 'parent');
{
elementStart(3, 'content');
elementEnd();
}
{ element(3, 'content'); }
elementEnd();
}
if (rf & RenderFlags.Update) {

9
packages/core/test/render3/listeners_spec.ts
View File

@ -7,8 +7,9 @@
*/
import {defineComponent, defineDirective} from '../../src/render3/index';
import {container, containerRefreshEnd, containerRefreshStart, elementEnd, elementStart, embeddedViewEnd, embeddedViewStart, listener, text} from '../../src/render3/instructions';
import {container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementStart, embeddedViewEnd, embeddedViewStart, listener, text} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {getRendererFactory2} from './imported_renderer2';
import {ComponentFixture, containerEl, renderComponent, renderToHtml} from './render_util';
@ -530,10 +531,8 @@ describe('event listeners', () => {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
text(0, 'Hello');
elementStart(1, 'comp');
elementEnd();
elementStart(2, 'comp');
elementEnd();
element(1, 'comp');
element(2, 'comp');
}
embeddedViewEnd();
}

6
packages/core/test/render3/outputs_spec.ts
View File

@ -9,8 +9,9 @@
import {EventEmitter} from '@angular/core';
import {defineComponent, defineDirective} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, listener, text} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, listener, text} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {containerEl, renderToHtml} from './render_util';
describe('outputs', () => {
@ -273,8 +274,7 @@ describe('outputs', () => {
listener('change', function() { return ctx.onChange(); });
}
elementEnd();
elementStart(3, 'destroy-comp');
elementEnd();
element(3, 'destroy-comp');
}
embeddedViewEnd();
}

48
packages/core/test/render3/properties_spec.ts
View File

@ -9,8 +9,9 @@
import {EventEmitter} from '@angular/core';
import {defineComponent, defineDirective, tick} from '../../src/render3/index';
import {NO_CHANGE, bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, interpolation1, listener, load, loadDirective, text, textBinding} from '../../src/render3/instructions';
import {NO_CHANGE, bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, interpolation1, listener, load, loadDirective, text, textBinding} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {ComponentFixture, renderToHtml} from './render_util';
describe('elementProperty', () => {
@ -18,8 +19,7 @@ describe('elementProperty', () => {
it('should support bindings to properties', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'span');
elementEnd();
element(0, 'span');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'id', bind(ctx));
@ -41,8 +41,7 @@ describe('elementProperty', () => {
function Template(rf: RenderFlags, ctx: string) {
if (rf & RenderFlags.Create) {
elementStart(0, 'span');
elementEnd();
element(0, 'span');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'id', rf & RenderFlags.Create ? expensive(ctx) : NO_CHANGE);
@ -56,8 +55,7 @@ describe('elementProperty', () => {
it('should support interpolation for properties', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'span');
elementEnd();
element(0, 'span');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'id', interpolation1('_', ctx, '_'));
@ -227,8 +225,7 @@ describe('elementProperty', () => {
/** <comp [id]="id"></comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'id', bind(ctx.id));
@ -398,8 +395,7 @@ describe('elementProperty', () => {
/** <div role="button" myDir></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'button', 'myDir', '']);
elementEnd();
element(0, 'div', ['role', 'button', 'myDir', '']);
}
}
@ -412,8 +408,7 @@ describe('elementProperty', () => {
/** <div role="button" [role]="role" myDir></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'button', 'myDir', '']);
elementEnd();
element(0, 'div', ['role', 'button', 'myDir', '']);
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'role', bind(ctx.role));
@ -433,8 +428,7 @@ describe('elementProperty', () => {
/** <div role="button" myDir myDirB></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'button', 'myDir', '', 'myDirB', '']);
elementEnd();
element(0, 'div', ['role', 'button', 'myDir', '', 'myDirB', '']);
}
}
@ -449,8 +443,7 @@ describe('elementProperty', () => {
/** <div role="button" dir="rtl" myDir></div> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'button', 'dir', 'rtl', 'myDir', '']);
elementEnd();
element(0, 'div', ['role', 'button', 'dir', 'rtl', 'myDir', '']);
}
}
@ -488,10 +481,8 @@ describe('elementProperty', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'button', 'dir', 'rtl', 'myDir', '']);
elementEnd();
elementStart(1, 'div', ['role', 'listbox', 'myDirB', '']);
elementEnd();
element(0, 'div', ['role', 'button', 'dir', 'rtl', 'myDir', '']);
element(1, 'div', ['role', 'listbox', 'myDirB', '']);
}
}
@ -515,8 +506,7 @@ describe('elementProperty', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'listbox', 'myDir', '']);
elementEnd();
element(0, 'div', ['role', 'listbox', 'myDir', '']);
container(1);
}
if (rf & RenderFlags.Update) {
@ -525,15 +515,13 @@ describe('elementProperty', () => {
if (ctx.condition) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'button', 'myDirB', '']);
elementEnd();
element(0, 'div', ['role', 'button', 'myDirB', '']);
}
embeddedViewEnd();
} else {
let rf2 = embeddedViewStart(1);
if (rf2 & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'menu']);
elementEnd();
element(0, 'div', ['role', 'menu']);
}
embeddedViewEnd();
}
@ -562,8 +550,7 @@ describe('elementProperty', () => {
/** <div role="button" dir #dir="myDir"></div> {{ dir.role }} */
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['role', 'button', 'myDir', ''], ['dir', 'myDir']);
elementEnd();
element(0, 'div', ['role', 'button', 'myDir', ''], ['dir', 'myDir']);
text(2);
}
if (rf & RenderFlags.Update) {
@ -591,8 +578,7 @@ describe('elementProperty', () => {
for (let i = 0; i < 2; i++) {
let rf1 = embeddedViewStart(0);
if (rf1 & RenderFlags.Create) {
elementStart(0, 'comp');
elementEnd();
element(0, 'comp');
}
embeddedViewEnd();
}

26
packages/core/test/render3/pure_function_spec.ts
View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import {defineComponent} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, load, loadDirective, reserveSlots} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, load, loadDirective, reserveSlots} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {pureFunction1, pureFunction2, pureFunction3, pureFunction4, pureFunction5, pureFunction6, pureFunction7, pureFunction8, pureFunctionV} from '../../src/render3/pure_function';
import {renderToHtml} from '../../test/render3/render_util';
@ -35,8 +35,7 @@ describe('array literals', () => {
/** <my-comp [names]="['Nancy', customName, 'Bess']"></my-comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'my-comp');
elementEnd();
element(0, 'my-comp');
reserveSlots(2);
}
if (rf & RenderFlags.Update) {
@ -92,8 +91,7 @@ describe('array literals', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'many-prop-comp');
elementEnd();
element(0, 'many-prop-comp');
reserveSlots(4);
}
if (rf & RenderFlags.Update) {
@ -147,10 +145,8 @@ describe('array literals', () => {
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'parent-comp');
elementEnd();
elementStart(1, 'parent-comp');
elementEnd();
element(0, 'parent-comp');
element(1, 'parent-comp');
}
}
@ -174,8 +170,7 @@ describe('array literals', () => {
/** <my-comp [names]="['Nancy', customName, 'Bess', customName2]"></my-comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'my-comp');
elementEnd();
element(0, 'my-comp');
reserveSlots(3);
}
if (rf & RenderFlags.Update) {
@ -302,8 +297,7 @@ describe('array literals', () => {
*/
function Template(rf: RenderFlags, c: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'my-comp');
elementEnd();
element(0, 'my-comp');
reserveSlots(12);
}
if (rf & RenderFlags.Update) {
@ -354,8 +348,7 @@ describe('object literals', () => {
/** <object-comp [config]="{duration: 500, animation: name}"></object-comp> */
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'object-comp');
elementEnd();
element(0, 'object-comp');
reserveSlots(2);
}
if (rf & RenderFlags.Update) {
@ -390,8 +383,7 @@ describe('object literals', () => {
*/
function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'object-comp');
elementEnd();
element(0, 'object-comp');
reserveSlots(7);
}
if (rf & RenderFlags.Update) {

90
packages/core/test/render3/query_spec.ts
View File

@ -111,8 +111,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elToQuery = elementStart(1, 'div', ['child', '']);
elementEnd();
elToQuery = element(1, 'div', ['child', '']);
}
},
[Child], [],
@ -182,8 +181,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(1, 'div', ['child', '']);
elementEnd();
element(1, 'div', ['child', '']);
}
},
[Child, OtherChild], [],
@ -219,10 +217,8 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elToQuery = elementStart(1, 'div', null, ['foo', '']);
elementEnd();
elementStart(3, 'div');
elementEnd();
elToQuery = element(1, 'div', null, ['foo', '']);
element(3, 'div');
}
},
[], [],
@ -257,10 +253,8 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elToQuery = elementStart(2, 'div', null, ['foo', '', 'bar', '']);
elementEnd();
elementStart(5, 'div');
elementEnd();
elToQuery = element(2, 'div', null, ['foo', '', 'bar', '']);
element(5, 'div');
}
},
[], [],
@ -305,12 +299,9 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
el1ToQuery = elementStart(1, 'div', null, ['foo', '']);
elementEnd();
elementStart(3, 'div');
elementEnd();
el2ToQuery = elementStart(4, 'div', null, ['bar', '']);
elementEnd();
el1ToQuery = element(1, 'div', null, ['foo', '']);
element(3, 'div');
el2ToQuery = element(4, 'div', null, ['bar', '']);
}
},
[], [],
@ -345,8 +336,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elToQuery = elementStart(1, 'div', null, ['foo', '']);
elementEnd();
elToQuery = element(1, 'div', null, ['foo', '']);
element(3, 'div');
}
},
@ -749,8 +739,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
div = elementStart(1, 'div', ['child', ''], ['foo', 'child']);
elementEnd();
div = element(1, 'div', ['child', ''], ['foo', 'child']);
}
},
[Child], [],
@ -784,8 +773,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
div = elementStart(1, 'div', ['child', ''], ['foo', '', 'bar', 'child']);
elementEnd();
div = element(1, 'div', ['child', ''], ['foo', '', 'bar', 'child']);
}
if (rf & RenderFlags.Update) {
childInstance = loadDirective(0);
@ -889,8 +877,7 @@ describe('query', () => {
if (rf & RenderFlags.Create) {
container(1, (rf1: RenderFlags, ctx1: any) => {
if (rf1 & RenderFlags.Create) {
elementStart(0, 'div', null, ['foo', '']);
elementEnd();
element(0, 'div', null, ['foo', '']);
}
}, null, ['ngIf', '']);
}
@ -944,8 +931,7 @@ describe('query', () => {
if (rf & RenderFlags.Create) {
container(1, (rf1: RenderFlags, row: NgForOfContext<string>) => {
if (rf1 & RenderFlags.Create) {
elementStart(0, 'div', null, ['foo', '']);
elementEnd();
element(0, 'div', null, ['foo', '']);
}
if (rf1 & RenderFlags.Update) {
elementProperty(0, 'id', bind(row.$implicit));
@ -1013,21 +999,18 @@ describe('query', () => {
if (rf & RenderFlags.Create) {
container(1, (rf: RenderFlags, ctx: {idx: number}) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', null, ['foo', '']);
elementEnd();
element(0, 'div', null, ['foo', '']);
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'id', bind('foo1_' + ctx.idx));
}
}, null, []);
elementStart(2, 'div', ['id', 'middle'], ['foo', '']);
elementEnd();
element(2, 'div', ['id', 'middle'], ['foo', '']);
container(4, (rf: RenderFlags, ctx: {idx: number}) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', null, ['foo', '']);
elementEnd();
element(0, 'div', null, ['foo', '']);
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'id', bind('foo2_' + ctx.idx));
@ -1119,8 +1102,7 @@ describe('query', () => {
if (rf & RenderFlags.Create) {
container(1, (rf: RenderFlags, ctx: {idx: number, container_idx: number}) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', null, ['foo', '']);
elementEnd();
element(0, 'div', null, ['foo', '']);
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'id', bind('foo_' + ctx.container_idx + '_' + ctx.idx));
@ -1257,8 +1239,7 @@ describe('query', () => {
let rf1 = embeddedViewStart(1);
{
if (rf1 & RenderFlags.Create) {
firstEl = elementStart(0, 'div', null, ['foo', '']);
elementEnd();
firstEl = element(0, 'div', null, ['foo', '']);
}
}
embeddedViewEnd();
@ -1309,11 +1290,9 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
firstEl = elementStart(1, 'span', null, ['foo', '']);
elementEnd();
firstEl = element(1, 'span', null, ['foo', '']);
container(3);
lastEl = elementStart(4, 'span', null, ['foo', '']);
elementEnd();
lastEl = element(4, 'span', null, ['foo', '']);
}
if (rf & RenderFlags.Update) {
containerRefreshStart(3);
@ -1322,8 +1301,7 @@ describe('query', () => {
let rf1 = embeddedViewStart(1);
{
if (rf1 & RenderFlags.Create) {
viewEl = elementStart(0, 'div', null, ['foo', '']);
elementEnd();
viewEl = element(0, 'div', null, ['foo', '']);
}
}
embeddedViewEnd();
@ -1389,8 +1367,7 @@ describe('query', () => {
let rf0 = embeddedViewStart(0);
{
if (rf0 & RenderFlags.Create) {
firstEl = elementStart(0, 'div', null, ['foo', '']);
elementEnd();
firstEl = element(0, 'div', null, ['foo', '']);
}
}
embeddedViewEnd();
@ -1399,8 +1376,7 @@ describe('query', () => {
let rf1 = embeddedViewStart(1);
{
if (rf1 & RenderFlags.Create) {
lastEl = elementStart(0, 'span', null, ['foo', '']);
elementEnd();
lastEl = element(0, 'span', null, ['foo', '']);
}
}
embeddedViewEnd();
@ -1462,8 +1438,7 @@ describe('query', () => {
let rf0 = embeddedViewStart(0);
{
if (rf0 & RenderFlags.Create) {
firstEl = elementStart(0, 'div', null, ['foo', '']);
elementEnd();
firstEl = element(0, 'div', null, ['foo', '']);
container(2);
}
if (rf0 & RenderFlags.Update) {
@ -1473,8 +1448,7 @@ describe('query', () => {
let rf2 = embeddedViewStart(0);
{
if (rf2) {
lastEl = elementStart(0, 'span', null, ['foo', '']);
elementEnd();
lastEl = element(0, 'span', null, ['foo', '']);
}
}
embeddedViewEnd();
@ -1536,8 +1510,7 @@ describe('query', () => {
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
container(2);
elementStart(3, 'span', null, ['foo', '']);
elementEnd();
element(3, 'span', null, ['foo', '']);
}
if (rf & RenderFlags.Update) {
containerRefreshStart(2);
@ -1546,8 +1519,7 @@ describe('query', () => {
let rf0 = embeddedViewStart(0);
{
if (rf0 & RenderFlags.Create) {
elementStart(0, 'div', null, ['foo', '']);
elementEnd();
element(0, 'div', null, ['foo', '']);
}
}
embeddedViewEnd();
@ -1630,8 +1602,7 @@ describe('query', () => {
'some-component-with-query',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(1, 'div', null, ['foo', '']);
elementEnd();
element(1, 'div', null, ['foo', '']);
}
},
[], [],
@ -1655,8 +1626,7 @@ describe('query', () => {
let rf1 = embeddedViewStart(1);
{
if (rf1 & RenderFlags.Create) {
elementStart(0, 'some-component-with-query');
elementEnd();
element(0, 'some-component-with-query');
}
}
embeddedViewEnd();

28
packages/core/test/render3/renderer_factory_spec.ts
View File

@ -10,8 +10,8 @@ import {AnimationEvent} from '@angular/animations';
import {MockAnimationDriver, MockAnimationPlayer} from '@angular/animations/browser/testing';
import {RendererType2, ViewEncapsulation} from '../../src/core';
import {defineComponent, detectChanges} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, listener, text, tick} from '../../src/render3/instructions';
import {defineComponent} from '../../src/render3/index';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, listener, text, tick} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {createRendererType2} from '../../src/view/index';
@ -67,8 +67,7 @@ describe('renderer factory lifecycle', () => {
logs.push('function_with_component');
if (rf & RenderFlags.Create) {
text(0, 'bar');
elementStart(1, 'some-component');
elementEnd();
element(1, 'some-component');
}
}
@ -227,12 +226,9 @@ describe('Renderer2 destruction hooks', () => {
let rf1 = embeddedViewStart(1);
{
if (rf1 & RenderFlags.Create) {
elementStart(0, 'span');
elementEnd();
elementStart(1, 'span');
elementEnd();
elementStart(2, 'span');
elementEnd();
element(0, 'span');
element(1, 'span');
element(2, 'span');
}
}
embeddedViewEnd();
@ -259,8 +255,7 @@ describe('Renderer2 destruction hooks', () => {
selectors: [['simple']],
template: function(rf: RenderFlags, ctx: SimpleComponent) {
if (rf & RenderFlags.Create) {
elementStart(0, 'span');
elementEnd();
element(0, 'span');
}
},
factory: () => new SimpleComponent,
@ -282,12 +277,9 @@ describe('Renderer2 destruction hooks', () => {
let rf1 = embeddedViewStart(1);
{
if (rf1 & RenderFlags.Create) {
elementStart(0, 'simple');
elementEnd();
elementStart(1, 'span');
elementEnd();
elementStart(2, 'simple');
elementEnd();
element(0, 'simple');
element(1, 'span');
element(2, 'simple');
}
}
embeddedViewEnd();

48
packages/core/test/render3/view_container_ref_spec.ts
View File

@ -63,8 +63,7 @@ describe('ViewContainerRef', () => {
*/
function createTemplate() {
container(0, embeddedTemplate);
elementStart(1, 'p', ['vcref', '']);
elementEnd();
element(1, 'p', ['vcref', '']);
}
function updateTemplate() {
@ -76,10 +75,8 @@ describe('ViewContainerRef', () => {
it('should work on elements', () => {
function createTemplate() {
container(0, embeddedTemplate);
elementStart(1, 'header', ['vcref', '']);
elementEnd();
elementStart(2, 'footer');
elementEnd();
element(1, 'header', ['vcref', '']);
element(2, 'footer');
}
const fixture = new TemplateFixture(createTemplate, updateTemplate, [DirectiveWithVCRef]);
@ -108,10 +105,8 @@ describe('ViewContainerRef', () => {
function createTemplate() {
container(0, embeddedTemplate);
elementStart(1, 'header-cmp', ['vcref', '']);
elementEnd();
elementStart(2, 'footer');
elementEnd();
element(1, 'header-cmp', ['vcref', '']);
element(2, 'footer');
}
const fixture = new TemplateFixture(
@ -141,10 +136,8 @@ describe('ViewContainerRef', () => {
function createTemplate() {
container(0, embeddedTemplate);
elementStart(1, 'div', ['vcref', '']);
elementEnd();
elementStart(2, 'div', ['vcref', '']);
elementEnd();
element(1, 'div', ['vcref', '']);
element(2, 'div', ['vcref', '']);
// for testing only:
firstDir = loadDirective(0);
@ -170,8 +163,7 @@ describe('ViewContainerRef', () => {
it('should work on containers', () => {
function createTemplate() {
container(0, embeddedTemplate, undefined, ['vcref', '']);
elementStart(1, 'footer');
elementEnd();
element(1, 'footer');
}
function updateTemplate() {
@ -419,8 +411,7 @@ describe('ViewContainerRef', () => {
if (rf & RenderFlags.Create) {
container(0, (rf: RenderFlags, ctx: any) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'child');
elementEnd();
element(0, 'child');
pipe(1, 'starPipe');
reserveSlots(2);
}
@ -429,11 +420,9 @@ describe('ViewContainerRef', () => {
}
});
pipe(1, 'starPipe');
elementStart(2, 'child', ['vcref', '']);
elementEnd();
element(2, 'child', ['vcref', '']);
pipe(3, 'starPipe');
elementStart(4, 'child');
elementEnd();
element(4, 'child');
reserveSlots(4);
}
if (rf & RenderFlags.Update) {
@ -1173,17 +1162,14 @@ describe('ViewContainerRef', () => {
if (rf & RenderFlags.Create) {
container(0, (rf: RenderFlags, ctx: any) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'hooks');
elementEnd();
element(0, 'hooks');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'name', bind('C'));
}
});
elementStart(1, 'hooks', ['vcref', '']);
elementEnd();
elementStart(2, 'hooks');
elementEnd();
element(1, 'hooks', ['vcref', '']);
element(2, 'hooks');
}
if (rf & RenderFlags.Update) {
const tplRef = getOrCreateTemplateRef(getOrCreateNodeInjectorForNode(load(0)));
@ -1273,10 +1259,8 @@ describe('ViewContainerRef', () => {
factory: () => new SomeComponent(),
template: (rf: RenderFlags, cmp: SomeComponent) => {
if (rf & RenderFlags.Create) {
elementStart(0, 'hooks', ['vcref', '']);
elementEnd();
elementStart(1, 'hooks');
elementEnd();
element(0, 'hooks', ['vcref', '']);
element(1, 'hooks');
}
if (rf & RenderFlags.Update) {
elementProperty(0, 'name', bind('A'));