11//make sure you import mocha-config before @angular/core
2- import { assert } from "./test-config" ;
3- import { Component , ElementRef , Renderer , NgZone } from "@angular/core" ;
4- import { ProxyViewContainer } from "ui/proxy-view-container" ;
5- import { Red } from "color/known-colors" ;
6- import { dumpView } from "./test-utils" ;
7- import { TestApp } from "./test-app" ;
8- import { LayoutBase } from "ui/layouts/layout-base" ;
9- import { StackLayout } from "ui/layouts/stack-layout" ;
2+ import { assert } from "./test-config" ;
3+ import { Component , ElementRef , Renderer , NgZone } from "@angular/core" ;
4+ import { ProxyViewContainer } from "ui/proxy-view-container" ;
5+ import { Red } from "color/known-colors" ;
6+ import { dumpView } from "./test-utils" ;
7+ import { TestApp } from "./test-app" ;
8+ import { LayoutBase } from "ui/layouts/layout-base" ;
9+ import { StackLayout } from "ui/layouts/stack-layout" ;
10+ import { ContentView } from "ui/content-view" ;
11+ import { Button } from "ui/button" ;
12+ import { NgView } from "nativescript-angular/element-registry" ;
1013
1114@Component ( {
1215 template : `<StackLayout><Label text="Layout"></Label></StackLayout>`
@@ -170,9 +173,9 @@ describe('Renderer E2E', () => {
170173 it ( "executes events inside NgZone when listen is called inside NgZone" , ( done ) => {
171174 const eventName = "someEvent" ;
172175 const view = new StackLayout ( ) ;
173- const evetArg = { eventName, object : view } ;
176+ const eventArg = { eventName, object : view } ;
174177 const callback = ( arg ) => {
175- assert . equal ( arg , evetArg ) ;
178+ assert . equal ( arg , eventArg ) ;
176179 assert . isTrue ( NgZone . isInAngularZone ( ) , "Event should be executed inside NgZone" ) ;
177180 done ( ) ;
178181 } ;
@@ -183,25 +186,25 @@ describe('Renderer E2E', () => {
183186
184187 setTimeout ( ( ) => {
185188 testApp . zone . runOutsideAngular ( ( ) => {
186- view . notify ( evetArg ) ;
189+ view . notify ( eventArg ) ;
187190 } ) ;
188191 } , 10 ) ;
189192 } ) ;
190193
191194 it ( "executes events inside NgZone when listen is called outside NgZone" , ( done ) => {
192195 const eventName = "someEvent" ;
193196 const view = new StackLayout ( ) ;
194- const evetArg = { eventName, object : view } ;
197+ const eventArg = { eventName, object : view } ;
195198 const callback = ( arg ) => {
196- assert . equal ( arg , evetArg ) ;
199+ assert . equal ( arg , eventArg ) ;
197200 assert . isTrue ( NgZone . isInAngularZone ( ) , "Event should be executed inside NgZone" ) ;
198201 done ( ) ;
199202 } ;
200203
201204 testApp . zone . runOutsideAngular ( ( ) => {
202205 testApp . renderer . listen ( view , eventName , callback ) ;
203206
204- view . notify ( evetArg ) ;
207+ view . notify ( eventArg ) ;
205208 } ) ;
206209 } ) ;
207210
@@ -265,7 +268,7 @@ describe('Renderer createElement', () => {
265268 return TestApp . create ( ) . then ( ( app ) => {
266269 testApp = app ;
267270 renderer = testApp . renderer ;
268- } )
271+ } ) ;
269272 } ) ;
270273
271274 after ( ( ) => {
@@ -291,4 +294,83 @@ describe('Renderer createElement', () => {
291294 const result = renderer . createElement ( null , "unknown-tag" , null ) ;
292295 assert . instanceOf ( result , ProxyViewContainer , "Renderer should create ProxyViewContainer form 'unknown-tag'" )
293296 } ) ;
294- } )
297+ } ) ;
298+
299+
300+ describe ( 'Renderer attach/detach' , ( ) => {
301+ let testApp : TestApp = null ;
302+ let renderer : Renderer = null ;
303+
304+ before ( ( ) => {
305+ return TestApp . create ( ) . then ( ( app ) => {
306+ testApp = app ;
307+ renderer = testApp . renderer ;
308+ } ) ;
309+ } ) ;
310+
311+ after ( ( ) => {
312+ testApp . dispose ( ) ;
313+ } ) ;
314+
315+ it ( "createElement element with parent attaches element to content view" , ( ) => {
316+ const parent = < ContentView > renderer . createElement ( null , "ContentView" , null ) ;
317+ const button = < Button > renderer . createElement ( parent , "Button" , null ) ;
318+
319+ assert . equal ( parent . content , button ) ;
320+ assert . equal ( button . parent , parent ) ;
321+ } ) ;
322+
323+ it ( "createElement element with parent attaches element to layout view" , ( ) => {
324+ const parent = < StackLayout > renderer . createElement ( null , "StackLayout" , null ) ;
325+ const button = < Button > renderer . createElement ( parent , "Button" , null ) ;
326+
327+ assert . equal ( parent . getChildAt ( 0 ) , button ) ;
328+ assert . equal ( button . parent , parent ) ;
329+ } ) ;
330+
331+ it ( "detachView element removes element from content view" , ( ) => {
332+ const parent = < ContentView > renderer . createElement ( null , "ContentView" , null ) ;
333+ const button = < Button > renderer . createElement ( parent , "Button" , null ) ;
334+
335+ renderer . detachView ( [ button ] ) ;
336+
337+ assert . isNull ( parent . content ) ;
338+ assert . isUndefined ( button . parent ) ;
339+ } ) ;
340+
341+ it ( "detachView element removes element from layout view" , ( ) => {
342+ const parent = < StackLayout > renderer . createElement ( null , "StackLayout" , null ) ;
343+ const button = < Button > renderer . createElement ( parent , "Button" , null ) ;
344+
345+ renderer . detachView ( [ button ] ) ;
346+
347+ assert . equal ( parent . getChildrenCount ( ) , 0 ) ;
348+ assert . isUndefined ( button . parent ) ;
349+ } ) ;
350+
351+ it ( "attaching template anchor in content view does not replace its content" , ( ) => {
352+ const parent = < ContentView > renderer . createElement ( null , "ContentView" , null ) ;
353+ const button = < Button > renderer . createElement ( parent , "Button" , null ) ;
354+
355+ assert . equal ( parent . content , button ) ;
356+
357+ const anchor = < NgView > renderer . createTemplateAnchor ( parent ) ;
358+
359+ assert . equal ( parent . content , button ) ;
360+ assert . equal ( anchor . parent , parent ) ;
361+ assert . equal ( anchor . templateParent , parent ) ;
362+ } ) ;
363+
364+ it ( "attaching and detaching template anchor to content view does not affect its content" , ( ) => {
365+ const parent = < ContentView > renderer . createElement ( null , "ContentView" , null ) ;
366+ const button = < Button > renderer . createElement ( parent , "Button" , null ) ;
367+ const anchor = < NgView > renderer . createTemplateAnchor ( null ) ;
368+ assert . equal ( parent . content , button ) ;
369+
370+ renderer . attachViewAfter ( button , [ anchor ] ) ;
371+ assert . equal ( parent . content , button ) ;
372+
373+ renderer . detachView ( [ anchor ] ) ;
374+ assert . equal ( parent . content , button ) ;
375+ } ) ;
376+ } ) ;
0 commit comments