ファイル:login.component.spec.ts
リファクタリングテストユニット4角度とジャスミン
- ジャスミン、カルマ、および角度4
コード:
// To set up
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { TestBed, ComponentFixture, async } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { MaterialModule } from '@angular/material';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
// To support the view
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { PageLoginComponent } from './login.component';
describe('PageLoginComponent',() => {
let component: PageLoginComponent;
let fixture: ComponentFixture<PageLoginComponent>;
// To Assign
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [
PageLoginComponent,
],
imports: [
RouterTestingModule,
BrowserAnimationsModule,
MaterialModule,
FormsModule,
ReactiveFormsModule,
]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(PageLoginComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
// To Tear down
it('should be created',() => {
expect(component).toBeDefined();
});
it('should return true',() => {
component.login();
console.log(component.form.errors);
expect(component.form.errors.invalidLogin).toBe(true);
});
});
このテストのために私がする必要がある実行しますこれらのすべての輸入を行います。
認証フォルダの下に、ログインコンポーネント、ロック画面、確認、パスワードを忘れました。
これらのコンポーネントごとにテストを書く必要があります。彼らはほぼ同じ輸入品を使用しています(少なくとも// set up
部分)。
同様のインポートを共有モジュールに入れて、その1つのモジュールを新しいテストにインポートする方法はありますか?
(良くないオブジェクト指向設計の実践、私はそれが可能であるならば、私はちょうど好奇心、ということを知っている)事前に
感謝。
------------- login.component.ts - 場合は、あなたが
import { UsernameValidators } from './username.validator';
import { Component } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormControl, FormGroup, Validators, FormBuilder } from '@angular/forms';
@Component({
selector: 'my-page-login',
styles: [],
templateUrl: './login.component.html'
})
export class PageLoginComponent {
form = new FormGroup({
username: new FormControl('', [
Validators.required
]),
password: new FormControl('', Validators.required)
});
// Defining property - For the ease of access
get username() {
return this.form.get('username');
}
get password() {
return this.form.get('password');
}
login() {
this.form.setErrors({
invalidLogin: true
});
}
}