111 lines
		
	
	
		
			4.1 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			111 lines
		
	
	
		
			4.1 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
import {
 | 
						|
  beforeEach,
 | 
						|
  ddescribe,
 | 
						|
  describe,
 | 
						|
  expect,
 | 
						|
  iit,
 | 
						|
  inject,
 | 
						|
  it,
 | 
						|
  xit,
 | 
						|
} from '@angular/core/testing/testing_internal';
 | 
						|
import {TestComponentBuilder, ComponentFixture} from '@angular/compiler/testing';
 | 
						|
import {AsyncTestCompleter} from '@angular/core/testing/testing_internal';
 | 
						|
import {Component, Directive, TemplateRef, ContentChildren, QueryList} from '@angular/core';
 | 
						|
import {NgTemplateOutlet} from '@angular/common';
 | 
						|
 | 
						|
export function main() {
 | 
						|
  describe('insert', () => {
 | 
						|
    it('should do nothing if templateRef is null',
 | 
						|
       inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
 | 
						|
         var template = `<template [ngTemplateOutlet]="null"></template>`;
 | 
						|
         tcb.overrideTemplate(TestComponent, template)
 | 
						|
             .createAsync(TestComponent)
 | 
						|
             .then((fixture) => {
 | 
						|
 | 
						|
               fixture.detectChanges();
 | 
						|
               expect(fixture.nativeElement).toHaveText('');
 | 
						|
 | 
						|
               async.done();
 | 
						|
             });
 | 
						|
       }));
 | 
						|
 | 
						|
    it('should insert content specified by TemplateRef',
 | 
						|
       inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
 | 
						|
         var template =
 | 
						|
             `<tpl-refs #refs="tplRefs"><template>foo</template></tpl-refs><template [ngTemplateOutlet]="currentTplRef"></template>`;
 | 
						|
         tcb.overrideTemplate(TestComponent, template)
 | 
						|
             .createAsync(TestComponent)
 | 
						|
             .then((fixture) => {
 | 
						|
 | 
						|
               fixture.detectChanges();
 | 
						|
               expect(fixture.nativeElement).toHaveText('');
 | 
						|
 | 
						|
               var refs = fixture.debugElement.children[0].references['refs'];
 | 
						|
 | 
						|
               fixture.componentInstance.currentTplRef = refs.tplRefs.first;
 | 
						|
               fixture.detectChanges();
 | 
						|
               expect(fixture.nativeElement).toHaveText('foo');
 | 
						|
 | 
						|
               async.done();
 | 
						|
             });
 | 
						|
       }));
 | 
						|
 | 
						|
    it('should clear content if TemplateRef becomes null',
 | 
						|
       inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
 | 
						|
         var template =
 | 
						|
             `<tpl-refs #refs="tplRefs"><template>foo</template></tpl-refs><template [ngTemplateOutlet]="currentTplRef"></template>`;
 | 
						|
         tcb.overrideTemplate(TestComponent, template)
 | 
						|
             .createAsync(TestComponent)
 | 
						|
             .then((fixture) => {
 | 
						|
 | 
						|
               fixture.detectChanges();
 | 
						|
               var refs = fixture.debugElement.children[0].references['refs'];
 | 
						|
 | 
						|
               fixture.componentInstance.currentTplRef = refs.tplRefs.first;
 | 
						|
               fixture.detectChanges();
 | 
						|
               expect(fixture.nativeElement).toHaveText('foo');
 | 
						|
 | 
						|
               fixture.componentInstance.currentTplRef = null;
 | 
						|
               fixture.detectChanges();
 | 
						|
               expect(fixture.nativeElement).toHaveText('');
 | 
						|
 | 
						|
               async.done();
 | 
						|
             });
 | 
						|
       }));
 | 
						|
 | 
						|
    it('should swap content if TemplateRef changes',
 | 
						|
       inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
 | 
						|
         var template = `<tpl-refs #refs="tplRefs"><template>foo</template><template>bar</template></tpl-refs><template [ngTemplateOutlet]="currentTplRef"></template>`;
 | 
						|
         tcb.overrideTemplate(TestComponent, template)
 | 
						|
             .createAsync(TestComponent)
 | 
						|
             .then((fixture) => {
 | 
						|
 | 
						|
               fixture.detectChanges();
 | 
						|
               var refs = fixture.debugElement.children[0].references['refs'];
 | 
						|
 | 
						|
               fixture.componentInstance.currentTplRef = refs.tplRefs.first;
 | 
						|
               fixture.detectChanges();
 | 
						|
               expect(fixture.nativeElement).toHaveText('foo');
 | 
						|
 | 
						|
               fixture.componentInstance.currentTplRef = refs.tplRefs.last;
 | 
						|
               fixture.detectChanges();
 | 
						|
               expect(fixture.nativeElement).toHaveText('bar');
 | 
						|
 | 
						|
               async.done();
 | 
						|
             });
 | 
						|
       }));
 | 
						|
 | 
						|
  });
 | 
						|
}
 | 
						|
 | 
						|
 | 
						|
@Directive({selector: 'tpl-refs', exportAs: 'tplRefs'})
 | 
						|
class CaptureTplRefs {
 | 
						|
  @ContentChildren(TemplateRef) tplRefs: QueryList<TemplateRef<any>>;
 | 
						|
}
 | 
						|
 | 
						|
@Component({selector: 'test-cmp', directives: [NgTemplateOutlet, CaptureTplRefs], template: ''})
 | 
						|
class TestComponent {
 | 
						|
  currentTplRef: TemplateRef<any>;
 | 
						|
}
 |