diff options
Diffstat (limited to 'third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app')
8 files changed, 306 insertions, 0 deletions
diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.html b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.html new file mode 100644 index 0000000000..9a5a568732 --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.html @@ -0,0 +1,20 @@ +<section class="todoapp"> + <header class="header"> + <h1>Todos</h1> + <input class="new-todo" placeholder="What needs to be done?" autofocus="" [(ngModel)]="newTodo.title" (keyup.enter)="addTodo()"> + </header> + <section class="main" *ngIf="todos.length > 0"> + <ul class="todo-list"> + <li *ngFor="let todo of todos" [class.completed]="todo.complete"> + <div class="view"> + <input class="toggle" type="checkbox" (click)="toggleTodoComplete(todo)" [checked]="todo.complete"> + <label>{{todo.title}}</label> + <button class="destroy" (click)="removeTodo(todo)"></button> + </div> + </li> + </ul> + </section> + <footer class="footer" *ngIf="todos.length > 0"> + <span class="todo-count"><strong>{{todos.length}}</strong> {{todos.length == 1 ? 'item' : 'items'}} left</span> + </footer> +</section>
\ No newline at end of file diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.spec.ts b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.spec.ts new file mode 100644 index 0000000000..a8e9525e9d --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.spec.ts @@ -0,0 +1,38 @@ +/* tslint:disable:no-unused-variable */ + +import { TestBed, async } from '@angular/core/testing'; +import { AppComponent } from './app.component'; +import { FormsModule } from '@angular/forms'; +import { Todo } from './todo'; + +describe('AppComponent', () => { + beforeEach(() => { + TestBed.configureTestingModule({ + imports: [ + FormsModule + ], + declarations: [ + AppComponent + ], + }); + }); + + it('should create the app', async(() => { + let fixture = TestBed.createComponent(AppComponent); + let app = fixture.debugElement.componentInstance; + expect(app).toBeTruthy(); + })); + + it(`should have a newTodo todo`, async(() => { + let fixture = TestBed.createComponent(AppComponent); + let app = fixture.debugElement.componentInstance; + expect(app.newTodo instanceof Todo).toBeTruthy() + })); + + it('should display "Todos" in h1 tag', async(() => { + let fixture = TestBed.createComponent(AppComponent); + fixture.detectChanges(); + let compiled = fixture.debugElement.nativeElement; + expect(compiled.querySelector('h1').textContent).toContain('Todos'); + })); +}); diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.ts b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.ts new file mode 100644 index 0000000000..1ea0d80679 --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.component.ts @@ -0,0 +1,34 @@ +import {Component} from '@angular/core'; +import {Todo} from './todo'; +import {TodoDataService} from './todo-data.service'; + +@Component({ + selector: 'app-root', + templateUrl: './app.component.html', + providers: [TodoDataService] +}) +export class AppComponent { + + newTodo: Todo = new Todo(); + + constructor(private todoDataService: TodoDataService) { + } + + addTodo() { + this.todoDataService.addTodo(this.newTodo); + this.newTodo = new Todo(); + } + + toggleTodoComplete(todo) { + this.todoDataService.toggleTodoComplete(todo); + } + + removeTodo(todo) { + this.todoDataService.deleteTodoById(todo.id); + } + + get todos() { + return this.todoDataService.getAllTodos(); + } + +} diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.module.ts b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.module.ts new file mode 100644 index 0000000000..67ae49119b --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/app.module.ts @@ -0,0 +1,20 @@ +import { BrowserModule } from '@angular/platform-browser'; +import { NgModule } from '@angular/core'; +import { FormsModule } from '@angular/forms'; +import { HttpModule } from '@angular/http'; + +import { AppComponent } from './app.component'; + +@NgModule({ + declarations: [ + AppComponent + ], + imports: [ + BrowserModule, + FormsModule, + HttpModule + ], + providers: [], + bootstrap: [AppComponent] +}) +export class AppModule { } diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo-data.service.spec.ts b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo-data.service.spec.ts new file mode 100644 index 0000000000..1a15db9b5b --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo-data.service.spec.ts @@ -0,0 +1,106 @@ +import {TestBed, async, inject} from '@angular/core/testing'; +import {Todo} from './todo'; +import {TodoDataService} from './todo-data.service'; + +describe('TodoDataService', () => { + beforeEach(() => { + TestBed.configureTestingModule({ + providers: [TodoDataService] + }); + }); + + it('should ...', inject([TodoDataService], (service: TodoDataService) => { + expect(service).toBeTruthy(); + })); + + describe('#getAllTodos()', () => { + + it('should return an empty array by default', inject([TodoDataService], (service: TodoDataService) => { + expect(service.getAllTodos()).toEqual([]); + })); + + it('should return all todos', inject([TodoDataService], (service: TodoDataService) => { + let todo1 = new Todo({title: 'Hello 1', complete: false}); + let todo2 = new Todo({title: 'Hello 2', complete: true}); + service.addTodo(todo1); + service.addTodo(todo2); + expect(service.getAllTodos()).toEqual([todo1, todo2]); + })); + + }); + + describe('#save(todo)', () => { + + it('should automatically assign an incrementing id', inject([TodoDataService], (service: TodoDataService) => { + let todo1 = new Todo({title: 'Hello 1', complete: false}); + let todo2 = new Todo({title: 'Hello 2', complete: true}); + service.addTodo(todo1); + service.addTodo(todo2); + expect(service.getTodoById(1)).toEqual(todo1); + expect(service.getTodoById(2)).toEqual(todo2); + })); + + }); + + describe('#deleteTodoById(id)', () => { + + it('should remove todo with the corresponding id', inject([TodoDataService], (service: TodoDataService) => { + let todo1 = new Todo({title: 'Hello 1', complete: false}); + let todo2 = new Todo({title: 'Hello 2', complete: true}); + service.addTodo(todo1); + service.addTodo(todo2); + expect(service.getAllTodos()).toEqual([todo1, todo2]); + service.deleteTodoById(1); + expect(service.getAllTodos()).toEqual([todo2]); + service.deleteTodoById(2); + expect(service.getAllTodos()).toEqual([]); + })); + + it('should not removing anything if todo with corresponding id is not found', inject([TodoDataService], (service: TodoDataService) => { + let todo1 = new Todo({title: 'Hello 1', complete: false}); + let todo2 = new Todo({title: 'Hello 2', complete: true}); + service.addTodo(todo1); + service.addTodo(todo2); + expect(service.getAllTodos()).toEqual([todo1, todo2]); + service.deleteTodoById(3); + expect(service.getAllTodos()).toEqual([todo1, todo2]); + })); + + }); + + describe('#updateTodoById(id, values)', () => { + + it('should return todo with the corresponding id and updated data', inject([TodoDataService], (service: TodoDataService) => { + let todo = new Todo({title: 'Hello 1', complete: false}); + service.addTodo(todo); + let updatedTodo = service.updateTodoById(1, { + title: 'new title' + }); + expect(updatedTodo.title).toEqual('new title'); + })); + + it('should return null if todo is not found', inject([TodoDataService], (service: TodoDataService) => { + let todo = new Todo({title: 'Hello 1', complete: false}); + service.addTodo(todo); + let updatedTodo = service.updateTodoById(2, { + title: 'new title' + }); + expect(updatedTodo).toEqual(null); + })); + + }); + + describe('#toggleTodoComplete(todo)', () => { + + it('should return the updated todo with inverse complete status', inject([TodoDataService], (service: TodoDataService) => { + let todo = new Todo({title: 'Hello 1', complete: false}); + service.addTodo(todo); + let updatedTodo = service.toggleTodoComplete(todo); + expect(updatedTodo.complete).toEqual(true); + service.toggleTodoComplete(todo); + expect(updatedTodo.complete).toEqual(false); + })); + + }); + +});
\ No newline at end of file diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo-data.service.ts b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo-data.service.ts new file mode 100644 index 0000000000..509e37d5d4 --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo-data.service.ts @@ -0,0 +1,63 @@ +import {Injectable} from '@angular/core'; +import {Todo} from './todo'; + +@Injectable() +export class TodoDataService { + + // Placeholder for last id so we can simulate + // automatic incrementing of id's + lastId: number = 0; + + // Placeholder for todo's + todos: Todo[] = []; + + constructor() { + } + + // Simulate POST /todos + addTodo(todo: Todo): TodoDataService { + if (!todo.id) { + todo.id = ++this.lastId; + } + this.todos.push(todo); + return this; + } + + // Simulate DELETE /todos/:id + deleteTodoById(id: number): TodoDataService { + this.todos = this.todos + .filter(todo => todo.id !== id); + return this; + } + + // Simulate PUT /todos/:id + updateTodoById(id: number, values: Object = {}): Todo { + let todo = this.getTodoById(id); + if (!todo) { + return null; + } + Object.assign(todo, values); + return todo; + } + + // Simulate GET /todos + getAllTodos(): Todo[] { + return this.todos; + } + + // Simulate GET /todos/:id + getTodoById(id: number): Todo { + return this.todos + .filter(todo => todo.id === id) + .pop(); + } + + // Toggle todo complete + toggleTodoComplete(todo: Todo){ + let updatedTodo = this.updateTodoById(todo.id, { + complete: !todo.complete + }); + return updatedTodo; + } + +}
\ No newline at end of file diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo.spec.ts b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo.spec.ts new file mode 100644 index 0000000000..5a54add348 --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo.spec.ts @@ -0,0 +1,16 @@ +import {Todo} from './todo'; + +describe('Todo', () => { + it('should create an instance', () => { + expect(new Todo()).toBeTruthy(); + }); + + it('should accept values in the constructor', () => { + let todo = new Todo({ + title: 'hello', + complete: true + }); + expect(todo.title).toEqual('hello'); + expect(todo.complete).toEqual(true); + }); +});
\ No newline at end of file diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo.ts b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo.ts new file mode 100644 index 0000000000..a1d0a768b7 --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/angular/src/app/todo.ts @@ -0,0 +1,9 @@ +export class Todo { + id: number; + title: string = ''; + complete: boolean = false; + + constructor(values: Object = {}) { + Object.assign(this, values); + } +}
\ No newline at end of file |