Unite для тестирования струнной интерполяции угловой 4

Question

В моем HTML у меня есть:

<label>{{placeholder}}</label>

Заполнитель является переменной компонента, как проверить интерполяцию строки в угловых с жасмином?

Answer 1

Вы можете попробовать этот код

describe('WelcomeComponent', () => {
  let comp: any;
    beforeEach(() => {
      TestBed.configureTestingModule({
        // provide the component-under-test and dependent service
        declarations: [
          WelcomeComponent
        ]
      });

      fixture = TestBed.createComponent(WelcomeComponent);
      comp = fixture.componentInstance;
    });

    it('set placeholder some default value', () => {
      comp.placeholder = 'some text';
      expect(comp.placeholder).toContain('some text');
    });
});

Answer 2

Если вы используете Angular CLI, он генерирует базовый тест для вас, который делает именно это.

<h1>{{ placeholder }}</h1>

import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';
describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent
      ],
    }).compileComponents();
  }));
  it('should render placeholder in a h1 tag', async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    fixture.detectChanges();
    const compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('h1').textContent).toContain('my value');
  }));
});