2017-11-20 13:21:17 -05:00
|
|
|
/**
|
|
|
|
* @license
|
|
|
|
* Copyright Google Inc. All Rights Reserved.
|
|
|
|
*
|
|
|
|
* Use of this source code is governed by an MIT-style license that can be
|
|
|
|
* found in the LICENSE file at https://angular.io/license
|
|
|
|
*/
|
|
|
|
|
2018-01-25 11:52:10 -05:00
|
|
|
import {MockDirectory, setup} from '../aot/test_util';
|
|
|
|
import {compile, expectEmit} from './mock_compile';
|
2017-11-20 13:21:17 -05:00
|
|
|
|
|
|
|
describe('r3_view_compiler', () => {
|
|
|
|
const angularFiles = setup({
|
|
|
|
compileAngular: true,
|
|
|
|
compileAnimations: false,
|
|
|
|
compileCommon: true,
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('hello world', () => {
|
|
|
|
it('should be able to generate the hello world component', () => {
|
|
|
|
const files: MockDirectory = {
|
|
|
|
app: {
|
|
|
|
'hello.ts': `
|
|
|
|
import {Component, NgModule} from '@angular/core';
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'hello-world',
|
|
|
|
template: 'Hello, world!'
|
|
|
|
})
|
|
|
|
export class HelloWorldComponent {
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
@NgModule({
|
|
|
|
declarations: [HelloWorldComponent]
|
|
|
|
})
|
|
|
|
export class HelloWorldModule {}
|
|
|
|
`
|
|
|
|
}
|
|
|
|
};
|
|
|
|
compile(files, angularFiles);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should be able to generate the example', () => {
|
|
|
|
const files: MockDirectory = {
|
|
|
|
app: {
|
|
|
|
'example.ts': `
|
|
|
|
import {Component, OnInit, OnDestroy, ElementRef, Input, NgModule} from '@angular/core';
|
|
|
|
import {CommonModule} from '@angular/common';
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'my-app',
|
|
|
|
template: '<todo [data]="list"></todo>'
|
|
|
|
})
|
|
|
|
export class MyApp implements OnInit {
|
|
|
|
|
|
|
|
list: any[] = [];
|
|
|
|
|
|
|
|
constructor(public elementRef: ElementRef) {}
|
|
|
|
|
|
|
|
ngOnInit(): void {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'todo',
|
|
|
|
template: '<ul class="list" [title]="myTitle"><li *ngFor="let item of data">{{data}}</li></ul>'
|
|
|
|
})
|
|
|
|
export class TodoComponent implements OnInit, OnDestroy {
|
|
|
|
|
|
|
|
@Input()
|
|
|
|
data: any[] = [];
|
|
|
|
|
|
|
|
myTitle: string;
|
|
|
|
|
|
|
|
constructor(public elementRef: ElementRef) {}
|
|
|
|
|
|
|
|
ngOnInit(): void {}
|
|
|
|
|
|
|
|
ngOnDestroy(): void {}
|
|
|
|
}
|
|
|
|
|
|
|
|
@NgModule({
|
|
|
|
declarations: [TodoComponent, MyApp],
|
|
|
|
imports: [CommonModule]
|
|
|
|
})
|
|
|
|
export class TodoModule{}
|
|
|
|
`
|
|
|
|
}
|
|
|
|
};
|
|
|
|
const result = compile(files, angularFiles);
|
|
|
|
expect(result.source).toContain('@angular/core');
|
|
|
|
});
|
2018-01-11 18:37:56 -05:00
|
|
|
|
2018-01-31 16:11:07 -05:00
|
|
|
describe('interpolations', () => {
|
|
|
|
// Regression #21927
|
|
|
|
it('should generate a correct call to bV with more than 8 interpolations', () => {
|
|
|
|
const files: MockDirectory = {
|
|
|
|
app: {
|
|
|
|
'example.ts': `
|
|
|
|
import {Component, NgModule} from '@angular/core';
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'my-app',
|
|
|
|
template: ' {{list[0]}} {{list[1]}} {{list[2]}} {{list[3]}} {{list[4]}} {{list[5]}} {{list[6]}} {{list[7]}} {{list[8]}} '
|
|
|
|
})
|
2018-01-25 11:52:10 -05:00
|
|
|
export class MyApp {
|
2018-01-31 16:11:07 -05:00
|
|
|
list: any[] = [];
|
|
|
|
}
|
|
|
|
|
|
|
|
@NgModule({declarations: [MyApp]})
|
|
|
|
export class MyModule {}`
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2018-02-14 14:22:14 -05:00
|
|
|
const bV_call = `$r3$.ɵiV([' ',ctx.list[0],' ',ctx.list[1],' ',ctx.list[2],' ',ctx.list[3],
|
2018-01-31 16:11:07 -05:00
|
|
|
' ',ctx.list[4],' ',ctx.list[5],' ',ctx.list[6],' ',ctx.list[7],' ',ctx.list[8],
|
|
|
|
' '])`;
|
|
|
|
const result = compile(files, angularFiles);
|
|
|
|
expectEmit(result.source, bV_call, 'Incorrect bV call');
|
|
|
|
});
|
|
|
|
});
|
2017-11-20 13:21:17 -05:00
|
|
|
});
|