-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
docs: add tiny demo project showing a complete example
fix #33
- Loading branch information
Showing
24 changed files
with
465 additions
and
11 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers | ||
| # For additional information regarding the format and rule options, please see: | ||
| # https://github.com/browserslist/browserslist#queries | ||
| # For IE 9-11 support, please uncomment the last line of the file and adjust as needed | ||
| > 0.5% | ||
| last 2 versions | ||
| Firefox ESR | ||
| not dead | ||
| # IE 9-11 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,31 @@ | ||
| // Karma configuration file, see link for more information | ||
| // https://karma-runner.github.io/1.0/config/configuration-file.html | ||
|
|
||
| module.exports = function (config) { | ||
| config.set({ | ||
| basePath: '', | ||
| frameworks: ['jasmine', '@angular-devkit/build-angular'], | ||
| plugins: [ | ||
| require('karma-jasmine'), | ||
| require('karma-chrome-launcher'), | ||
| require('karma-jasmine-html-reporter'), | ||
| require('karma-coverage-istanbul-reporter'), | ||
| require('@angular-devkit/build-angular/plugins/karma') | ||
| ], | ||
| client: { | ||
| clearContext: false // leave Jasmine Spec Runner output visible in browser | ||
| }, | ||
| coverageIstanbulReporter: { | ||
| dir: require('path').join(__dirname, '../../coverage'), | ||
| reports: ['html', 'lcovonly'], | ||
| fixWebpackSourcePaths: true | ||
| }, | ||
| reporters: ['progress', 'kjhtml'], | ||
| port: 9876, | ||
| colors: true, | ||
| logLevel: config.LOG_INFO, | ||
| autoWatch: true, | ||
| browsers: ['Chrome'], | ||
| singleRun: false | ||
| }); | ||
| }; |
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| <form [formGroup]="form" (ngSubmit)="sayHello()"> | ||
| <input placeholder="Enter your first name" formControlName="firstName" id="firstName"/> | ||
| <button [disabled]="form.invalid">Say Hello</button> | ||
| </form> | ||
| <div *ngIf="greeting" id="greeting">{{ greeting }}</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| import { TestBed, async } from '@angular/core/testing'; | ||
| import { AppComponent } from './app.component'; | ||
| import { ComponentTester } from 'ngx-speculoos'; | ||
| import { speculoosMatchers } from 'ngx-speculoos'; | ||
| import { ReactiveFormsModule } from '@angular/forms'; | ||
|
|
||
| class AppComponentTester extends ComponentTester<AppComponent> { | ||
| constructor() { | ||
| super(AppComponent); | ||
| } | ||
|
|
||
| get firstName() { | ||
| return this.input('#firstName'); | ||
| } | ||
|
|
||
| get submit() { | ||
| return this.button('button'); | ||
| } | ||
|
|
||
| get greeting() { | ||
| return this.element('#greeting'); | ||
| } | ||
| } | ||
|
|
||
| describe('AppComponent', () => { | ||
| let tester: AppComponentTester; | ||
|
|
||
| beforeEach(async(() => { | ||
| TestBed.configureTestingModule({ | ||
| declarations: [ | ||
| AppComponent, | ||
| ], | ||
| imports: [ | ||
| ReactiveFormsModule | ||
| ] | ||
| }).compileComponents(); | ||
| })); | ||
|
|
||
| beforeEach(() => { | ||
| tester = new AppComponentTester(); | ||
|
|
||
| // a first call to detectChanges() is necessary. If the component had inputs, you would initialize them | ||
| // before calling detectChanges. For example: | ||
| // tester.someInput = 'someValue'; | ||
| tester.detectChanges(); | ||
|
|
||
| jasmine.addMatchers(speculoosMatchers); | ||
| }); | ||
|
|
||
| it('should display an empty form, with a disabled submit button and no greeting', () => { | ||
| expect(tester.firstName).toHaveValue(''); | ||
| expect(tester.submit.disabled).toBe(true); | ||
| expect(tester.greeting).toBeNull(); | ||
| }); | ||
|
|
||
| it('should enable the submit button when filling the first name', () => { | ||
| tester.firstName.fillWith('John'); | ||
| expect(tester.submit.disabled).toBe(false); | ||
| }); | ||
|
|
||
| it('should display the greeting when submitting the form', () => { | ||
| tester.firstName.fillWith('John'); | ||
| tester.submit.click(); | ||
| expect(tester.greeting).toContainText('Hello John'); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| import { Component, OnInit } from '@angular/core'; | ||
| import { FormBuilder, FormGroup, Validators } from '@angular/forms'; | ||
|
|
||
| @Component({ | ||
| selector: 'app-root', | ||
| templateUrl: './app.component.html', | ||
| styleUrls: ['./app.component.css'] | ||
| }) | ||
| export class AppComponent implements OnInit { | ||
| form: FormGroup; | ||
| greeting = ''; | ||
|
|
||
| constructor(private fb: FormBuilder) { } | ||
|
|
||
| ngOnInit() { | ||
| this.form = this.fb.group({ | ||
| firstName: ['', [Validators.required]] | ||
| }); | ||
| } | ||
|
|
||
| sayHello() { | ||
| this.greeting = `Hello ${this.form.value.firstName}`; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,17 @@ | ||
| import { BrowserModule } from '@angular/platform-browser'; | ||
| import { NgModule } from '@angular/core'; | ||
|
|
||
| import { AppComponent } from './app.component'; | ||
| import { ReactiveFormsModule } from '@angular/forms'; | ||
|
|
||
| @NgModule({ | ||
| declarations: [ | ||
| AppComponent | ||
| ], | ||
| imports: [ | ||
| BrowserModule, ReactiveFormsModule | ||
| ], | ||
| providers: [], | ||
| bootstrap: [AppComponent] | ||
| }) | ||
| export class AppModule { } |
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| export const environment = { | ||
| production: true | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| // This file can be replaced during build by using the `fileReplacements` array. | ||
| // `ng build ---prod` replaces `environment.ts` with `environment.prod.ts`. | ||
| // The list of file replacements can be found in `angular.json`. | ||
|
|
||
| export const environment = { | ||
| production: false | ||
| }; | ||
|
|
||
| /* | ||
| * In development mode, to ignore zone related error stack frames such as | ||
| * `zone.run`, `zoneDelegate.invokeTask` for easier debugging, you can | ||
| * import the following file, but please comment it out in production mode | ||
| * because it will have performance impact when throw error | ||
| */ | ||
| // import 'zone.js/dist/zone-error'; // Included with Angular CLI. |
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| <!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>Demo</title> | ||
| <base href="/"> | ||
|
|
||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <link rel="icon" type="image/x-icon" href="favicon.ico"> | ||
| </head> | ||
| <body> | ||
| <app-root></app-root> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| import { enableProdMode } from '@angular/core'; | ||
| import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; | ||
|
|
||
| import { AppModule } from './app/app.module'; | ||
| import { environment } from './environments/environment'; | ||
|
|
||
| if (environment.production) { | ||
| enableProdMode(); | ||
| } | ||
|
|
||
| platformBrowserDynamic().bootstrapModule(AppModule) | ||
| .catch(err => console.log(err)); |
Oops, something went wrong.