0

我希望这个问题能澄清很多人关于测试 Angular 文档几乎没有提到的模板驱动表单。我在此表单中有一个要测试的输入。我想使用 Jasmine 在 Angular 中测试一个简单的 DOM。这是一个使用 NgForm 的模板驱动表单,如下所示:

<form name="editForm" role="form"  novalidate (ngSubmit)="save()" #editForm="ngForm">
    <input #inputtotest type="text" class="form-control" name="nombre" id="field_nombre"
        [(ngModel)]="paciente.nombre" required/>               

我只想测试:

  • 如果此标签的此输入使用 NgModel 发送数据(paciente.nombre),或者如果其属性为 paciente.model 则更好。

根据此响应,我们可以使用ViewChild在 DOM 上使用 viewchild 如何在组件类中获取 ngForm 变量引用

我的组件文件是这样的:

//all the other imports
import { ViewChild } from '@angular/core';

@Component({
   ...
})

export class PacienteDialogComponent implements OnInit 
{
    @ViewChild('inputtotest') inputtotest: **ElementRef**;  //Create a viewchild of my input s I can obtain its value
    paciente: Paciente; //Paciente is a modal that initializes the nombre
    ...
}

我为表单编写测试的规范文件是这样的:

//All te Angular imports
describe('Component Tests', () => {

    describe('Paciente Management Dialog Component', () => {
        let comp: PacienteDialogComponent;
        let fixture: ComponentFixture<PacienteDialogComponent>;
        //starts my code
        let input: HTMLElement;

        beforeEach(async(() => {
            TestBed.configureTestingModule({
                .....angular imports                        


        }));

        beforeEach(() => {
            fixture = TestBed.createComponent(PacienteDialogComponent);
            comp = fixture.componentInstance;
            input = `fixture.debugElement.query(By.css('inputtotest')).nativeElement;`
        });

测试:

it ('The form should call save method on submit', async(() => {
    fixture.detectChanges(); 
    spyOn(comp,'save');
    savebutton.click();
    expect(comp.save).toHaveBeenCalledTimes(0);
}));



it ('The form should have the input for paciente.nombre', async(() => {
    fixture.detectChanges();


expect(inputname.getAttribute.value).toEqual(paciente.nombre);

}));

现在我已经获得了作为 HTML 元素的输入,但我没有找到任何方法来检查它是否等于 paciente.nombre 的 ngModel 值。我在示例中这样做,结果是错误:

类型名称字符串中不存在属性值。我做错了什么吗?

4

0 回答 0