Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit cc2e14f

Browse files
committed
fix(tests): Use Renderer2. Update template anchor tests.
No longer using "template" elements, but #comment nodes.
1 parent 0d2c256 commit cc2e14f

File tree

6 files changed

+42
-63
lines changed

6 files changed

+42
-63
lines changed

‎nativescript-angular/directives/action-bar.ts‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { ActionItem, ActionBar, NavigationButton } from "tns-core-modules/ui/act
33
import { isBlank } from "../lang-facade";
44
import { Page } from "tns-core-modules/ui/page";
55
import { View } from "tns-core-modules/ui/core/view";
6-
import { registerElement, ViewClassMeta, NgView,TEMPLATE } from "../element-registry";
6+
import { registerElement, ViewClassMeta, NgView } from "../element-registry";
77

88
let actionBarMeta: ViewClassMeta = {
99
skipAddToDom: true,
@@ -17,8 +17,6 @@ let actionBarMeta: ViewClassMeta = {
1717
} else if (child instanceof ActionItem) {
1818
bar.actionItems.addItem(childView);
1919
childView.parent = bar;
20-
} else if (child.nodeName === TEMPLATE) {
21-
child.templateParent = parent;
2220
} else if (child.nodeName !== "#text" && child instanceof View) {
2321
bar.titleView = childView;
2422
}
@@ -34,8 +32,7 @@ let actionBarMeta: ViewClassMeta = {
3432
} else if (child instanceof ActionItem) {
3533
bar.actionItems.removeItem(childView);
3634
childView.parent = null;
37-
} else if (child.nodeName !== TEMPLATE && child instanceof View &&
38-
bar.titleView && bar.titleView === childView) {
35+
} else if (child instanceof View && bar.titleView && bar.titleView === childView) {
3936
bar.titleView = null;
4037
}
4138
},

‎nativescript-angular/element-registry.ts‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,10 @@ import { View } from "tns-core-modules/ui/core/view";
22

33
export type ViewResolver = () => ViewClass;
44
export type NgView = View & ViewExtensions;
5-
export const TEMPLATE = "ng-template";
6-
75
export interface ViewClassMeta {
86
skipAddToDom?: boolean;
97
insertChild?: (parent: NgView, child: NgView, atIndex: number) => void;
108
removeChild?: (parent: NgView, child: NgView) => void;
11-
isTemplateAnchor?: boolean;
129
}
1310

1411
export interface ViewExtensions {
@@ -71,11 +68,6 @@ export function isKnownView(elementName: string): boolean {
7168
elementMap.has(elementName.toLowerCase());
7269
}
7370

74-
// Empty view used for template anchors
75-
export class TemplateView extends View {
76-
}
77-
registerElement(TEMPLATE, () => TemplateView, { isTemplateAnchor: true });
78-
7971
// Register default NativeScript components
8072
// Note: ActionBar related components are registerd together with action-bar directives.
8173
registerElement("AbsoluteLayout", () => require("tns-core-modules/ui/layouts/absolute-layout").AbsoluteLayout);

‎nativescript-angular/index.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,13 +17,11 @@ export * from "./view-util";
1717
export * from "./resource-loader";
1818
export {
1919
ViewResolver,
20-
TEMPLATE,
2120
ViewClass,
2221
ViewClassMeta,
2322
registerElement,
2423
getViewClass,
2524
getViewMeta,
2625
isKnownView,
27-
TemplateView
2826
} from "./element-registry";
2927
export * from "./value-accessors/base-value-accessor";

‎nativescript-angular/view-util.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ export class ViewUtil {
6969
}
7070
} else if (isContentView(parent)) {
7171
// Explicit handling of template anchors inside ContentView
72-
if (child.meta.isTemplateAnchor) {
72+
if (child.nodeName==="#comment") {
7373
parent._addView(child, atIndex);
7474
} else {
7575
parent.content = child;
@@ -96,7 +96,7 @@ export class ViewUtil {
9696
}
9797

9898
// Explicit handling of template anchors inside ContentView
99-
if (child.meta.isTemplateAnchor) {
99+
if (child.nodeName==="#comment") {
100100
parent._removeView(child);
101101
}
102102
} else if (isView(parent)) {

‎tests/app/tests/renderer-tests.ts‎

Lines changed: 36 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// make sure you import mocha-config before @angular/core
22
import { assert } from "./test-config";
3-
import { Component, ElementRef, Renderer, NgZone } from "@angular/core";
3+
import { Component, ElementRef, Renderer2, NgZone } from "@angular/core";
44
import { ProxyViewContainer } from "ui/proxy-view-container";
55
import { Red } from "color/known-colors";
66
import { dumpView } from "./test-utils";
@@ -214,7 +214,7 @@ describe("Renderer E2E", () => {
214214
it("ngIf hides component when false", () => {
215215
return testApp.loadComponent(NgIfLabel).then((componentRef) => {
216216
const componentRoot = componentRef.instance.elementRef.nativeElement;
217-
assert.equal("(ProxyViewContainer (template))", dumpView(componentRoot));
217+
assert.equal("(ProxyViewContainer (#comment))", dumpView(componentRoot));
218218
});
219219
});
220220

@@ -225,15 +225,15 @@ describe("Renderer E2E", () => {
225225

226226
component.show = true;
227227
testApp.appRef.tick();
228-
assert.equal("(ProxyViewContainer (template), (Label))", dumpView(componentRoot));
228+
assert.equal("(ProxyViewContainer (#comment), (Label))", dumpView(componentRoot));
229229
});
230230
});
231231

232232
it("ngFor creates element for each item", () => {
233233
return testApp.loadComponent(NgForLabel).then((componentRef) => {
234234
const componentRoot = componentRef.instance.elementRef.nativeElement;
235235
assert.equal(
236-
"(ProxyViewContainer (template), (Label[text=one]), (Label[text=two]), (Label[text=three]))",
236+
"(ProxyViewContainer (#comment), (Label[text=one]), (Label[text=two]), (Label[text=three]))",
237237
dumpView(componentRoot, true));
238238
});
239239
});
@@ -247,7 +247,7 @@ describe("Renderer E2E", () => {
247247
testApp.appRef.tick();
248248

249249
assert.equal(
250-
"(ProxyViewContainer (template), (Label[text=one]), (Label[text=three]))",
250+
"(ProxyViewContainer (#comment), (Label[text=one]), (Label[text=three]))",
251251
dumpView(componentRoot, true));
252252
});
253253
});
@@ -261,7 +261,7 @@ describe("Renderer E2E", () => {
261261
testApp.appRef.tick();
262262

263263
assert.equal(
264-
"(ProxyViewContainer (template), " +
264+
"(ProxyViewContainer (#comment), " +
265265
"(Label[text=one]), (Label[text=new]), (Label[text=two]), (Label[text=three]))",
266266
dumpView(componentRoot, true));
267267
});
@@ -271,7 +271,7 @@ describe("Renderer E2E", () => {
271271

272272
describe("Renderer createElement", () => {
273273
let testApp: TestApp = null;
274-
let renderer: Renderer = null;
274+
let renderer: Renderer2 = null;
275275

276276
before(() => {
277277
return TestApp.create().then((app) => {
@@ -285,30 +285,30 @@ describe("Renderer createElement", () => {
285285
});
286286

287287
it("creates element from CamelCase", () => {
288-
const result = renderer.createElement(null,"StackLayout",null);
288+
const result = renderer.createElement("StackLayout");
289289
assert.instanceOf(result, StackLayout, "Renderer should create StackLayout form 'StackLayout'");
290290
});
291291

292292
it("creates element from lowercase", () => {
293-
const result = renderer.createElement(null,"stacklayout",null);
293+
const result = renderer.createElement("stacklayout");
294294
assert.instanceOf(result, StackLayout, "Renderer should create StackLayout form 'stacklayout'");
295295
});
296296

297297
it("creates element from kebab-case", () => {
298-
const result = renderer.createElement(null,"stack-layout",null);
298+
const result = renderer.createElement("stack-layout");
299299
assert.instanceOf(result, StackLayout, "Renderer should create StackLayout form 'stack-layout'");
300300
});
301301

302302
it("creates ProxyViewContainer for unknownTag", () => {
303-
const result = renderer.createElement(null,"unknown-tag",null);
303+
const result = renderer.createElement("unknown-tag");
304304
assert.instanceOf(result, ProxyViewContainer, "Renderer should create ProxyViewContainer form 'unknown-tag'");
305305
});
306306
});
307307

308308

309309
describe("Renderer attach/detach", () => {
310310
let testApp: TestApp = null;
311-
let renderer: Renderer = null;
311+
let renderer: Renderer2 = null;
312312

313313
before(() => {
314314
return TestApp.create().then((app) => {
@@ -322,65 +322,57 @@ describe("Renderer attach/detach", () => {
322322
});
323323

324324
it("createElement element with parent attaches element to content view", () => {
325-
const parent = <ContentView>renderer.createElement(null, "ContentView", null);
326-
const button = <Button>renderer.createElement(parent, "Button", null);
325+
const parent = <ContentView>renderer.createElement("ContentView");
326+
const button = <Button>renderer.createElement("Button");
327+
renderer.appendChild(parent, button);
327328

328329
assert.equal(parent.content, button);
329330
assert.equal(button.parent, parent);
330331
});
331332

332333
it("createElement element with parent attaches element to layout view", () => {
333-
const parent = <StackLayout>renderer.createElement(null, "StackLayout", null);
334-
const button = <Button>renderer.createElement(parent, "Button", null);
334+
const parent = <StackLayout>renderer.createElement("StackLayout");
335+
const button = <Button>renderer.createElement("Button");
336+
renderer.appendChild(parent, button);
335337

336338
assert.equal(parent.getChildAt(0), button);
337339
assert.equal(button.parent, parent);
338340
});
339341

340342
it("detachView element removes element from content view", () => {
341-
const parent = <ContentView>renderer.createElement(null, "ContentView", null);
342-
const button = <Button>renderer.createElement(parent, "Button", null);
343+
const parent = <ContentView>renderer.createElement("ContentView");
344+
const button = <Button>renderer.createElement("Button");
345+
renderer.appendChild(parent, button);
343346

344-
renderer.detachView([button]);
347+
renderer.removeChild(parent,button);
345348

346349
assert.isNull(parent.content);
347350
assert.isUndefined(button.parent);
348351
});
349352

350353
it("detachView element removes element from layout view", () => {
351-
const parent = <StackLayout>renderer.createElement(null, "StackLayout", null);
352-
const button = <Button>renderer.createElement(parent, "Button", null);
354+
const parent = <StackLayout>renderer.createElement("StackLayout");
355+
const button = <Button>renderer.createElement("Button");
356+
renderer.appendChild(parent, button);
353357

354-
renderer.detachView([button]);
358+
renderer.removeChild(parent,button);
355359

356360
assert.equal(parent.getChildrenCount(), 0);
357361
assert.isUndefined(button.parent);
358362
});
359363

360-
it("attaching template anchor in content view does not replace its content", () => {
361-
const parent = <ContentView>renderer.createElement(null, "ContentView", null);
362-
const button = <Button>renderer.createElement(parent, "Button", null);
364+
it("attaching and detaching comment anchor to content view does not affect its content", () => {
365+
const parent = <ContentView>renderer.createElement("ContentView");
366+
const button = <Button>renderer.createElement("Button");
367+
renderer.appendChild(parent, button);
368+
const anchor = <NgView>renderer.createComment("anchor");
369+
assert.equal(parent.content, button, "parent has button as initial content");
363370

364-
assert.equal(parent.content, button);
365-
366-
const anchor = <NgView>renderer.createTemplateAnchor(parent);
367-
368-
assert.equal(parent.content, button);
369-
assert.equal(anchor.parent, parent);
370-
assert.equal(anchor.templateParent, parent);
371-
});
371+
renderer.appendChild(parent, anchor);
372+
assert.equal(parent.content, button, "parent still has button as content after inserting anchor");
372373

373-
it("attaching and detaching template anchor to content view does not affect its content", () => {
374-
const parent = <ContentView>renderer.createElement(null, "ContentView", null);
375-
const button = <Button>renderer.createElement(parent, "Button", null);
376-
const anchor = <NgView>renderer.createTemplateAnchor(null);
377-
assert.equal(parent.content, button);
378-
379-
renderer.attachViewAfter(button, [anchor]);
380-
assert.equal(parent.content, button);
381-
382-
renderer.detachView([anchor]);
383-
assert.equal(parent.content, button);
374+
renderer.removeChild(parent, anchor);
375+
assert.equal(parent.content, button, "parent has button as content even after removing anchor");
384376
});
385377
});
386378

‎tests/app/tests/test-app.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { NativeScriptModule } from "nativescript-angular/nativescript.module";
33
import { NativeScriptRouterModule } from "nativescript-angular/router";
44
import {
55
Type, Component, ComponentRef,
6-
ComponentFactoryResolver, ApplicationRef, Renderer,
6+
ComponentFactoryResolver, ApplicationRef, Renderer2,
77
ViewContainerRef, NgZone, NgModule,
88
} from "@angular/core";
99

@@ -23,7 +23,7 @@ export class TestApp {
2323
private resolver: ComponentFactoryResolver,
2424
private containerRef: ViewContainerRef,
2525
public appRef: ApplicationRef,
26-
public renderer: Renderer,
26+
public renderer: Renderer2,
2727
public zone: NgZone
2828
) {
2929

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /