mirror of https://github.com/abpframework/abp.git
26 changed files with 449 additions and 317 deletions
@ -1,55 +1,63 @@ |
|||||
import { Component, DebugElement } from '@angular/core' |
import { Component, DebugElement, ChangeDetectorRef } from '@angular/core'; |
||||
import { ComponentFixture, TestBed } from '@angular/core/testing' |
import { ComponentFixture, TestBed } from '@angular/core/testing'; |
||||
import { ShowPasswordDirective } from '../directives'; |
|
||||
import { By } from '@angular/platform-browser'; |
import { By } from '@angular/platform-browser'; |
||||
|
import { ShowPasswordDirective } from '../directives'; |
||||
|
|
||||
@Component({ |
@Component({ |
||||
standalone:true, |
template: ` <input [abpShowPassword]="true" />
|
||||
template: ` |
<input [abpShowPassword]="false" /> |
||||
<input [abpShowPassword]="true"> |
<input /> |
||||
<input [abpShowPassword]="false"> |
<input [abpShowPassword]="showPassword" />`,
|
||||
<input /> |
imports: [ShowPasswordDirective], |
||||
<input [abpShowPassword]="showPassword" />`,
|
|
||||
imports:[ShowPasswordDirective] |
|
||||
}) |
}) |
||||
class TestComponent { |
class TestComponent { |
||||
showPassword = false |
showPassword = false; |
||||
} |
} |
||||
|
|
||||
describe('ShowPasswordDirective',()=>{ |
describe('ShowPasswordDirective', () => { |
||||
let fixture: ComponentFixture<TestComponent>;; |
let fixture: ComponentFixture<TestComponent>; |
||||
let des : DebugElement[]; |
let des: DebugElement[]; |
||||
let desAll : DebugElement[]; |
let desAll: DebugElement[]; |
||||
let bareInput; |
let bareInput; |
||||
|
|
||||
beforeEach(()=>{ |
beforeEach(() => { |
||||
fixture = TestBed.configureTestingModule({ |
fixture = TestBed.configureTestingModule({ |
||||
imports: [ TestComponent ] |
imports: [TestComponent], |
||||
}).createComponent(TestComponent) |
}).createComponent(TestComponent); |
||||
|
|
||||
fixture.detectChanges(); |
fixture.detectChanges(); |
||||
|
|
||||
des = fixture.debugElement.queryAll(By.directive(ShowPasswordDirective)); |
des = fixture.debugElement.queryAll(By.directive(ShowPasswordDirective)); |
||||
|
|
||||
desAll = fixture.debugElement.queryAll(By.all()); |
desAll = fixture.debugElement.queryAll(By.all()); |
||||
|
|
||||
bareInput = fixture.debugElement.query(By.css('input:not([abpShowPassword])')); |
bareInput = fixture.debugElement.query(By.css('input:not([abpShowPassword])')); |
||||
}) |
}); |
||||
|
|
||||
it('should have three input has ShowPasswordDirective elements', () => { |
it('should have three input has ShowPasswordDirective elements', () => { |
||||
expect(des.length).toBe(3); |
expect(des.length).toBe(3); |
||||
}); |
}); |
||||
|
|
||||
test.each([[0,'text'],[1,'password'],[2,'text'],[3,'password']])('%p. input type must be %p)', (index,inpType) => { |
test.each([ |
||||
const inputType = desAll[index].nativeElement.type; |
[0, 'text'], |
||||
expect(inputType).toBe(inpType); |
[1, 'password'], |
||||
}); |
[2, 'text'], |
||||
|
[3, 'password'], |
||||
it('should have three input has ShowPasswordDirective elements', () => { |
])('%p. input type must be %p)', (index, inpType) => { |
||||
const input = des[2].nativeElement |
const inputType = desAll[index].nativeElement.type; |
||||
expect(input.type).toBe('password') |
expect(inputType).toBe(inpType); |
||||
fixture.componentInstance.showPassword = true |
}); |
||||
fixture.detectChanges() |
|
||||
expect(input.type).toBe('text') |
it('should toggle input type when showPassword changes', () => { |
||||
}); |
const input = des[2].nativeElement; |
||||
}); |
expect(input.type).toBe('password'); |
||||
|
|
||||
|
fixture.componentInstance.showPassword = true; |
||||
|
|
||||
|
const cdr = fixture.componentRef.injector.get(ChangeDetectorRef); |
||||
|
cdr.markForCheck(); |
||||
|
cdr.detectChanges(); |
||||
|
|
||||
|
expect(input.type).toBe('text'); |
||||
|
}); |
||||
|
}); |
||||
|
|||||
Loading…
Reference in new issue