Как сделать модульные тесты Angular 2 для метатегов из библиотеки платформы браузера? - PullRequest
Новая
       21

Как сделать модульные тесты Angular 2 для метатегов из библиотеки платформы браузера?

0 голосов
/ 28 февраля 2020

Я пишу модульные тесты для компонента Angular 2 с жасмином. Я хотел бы проверить, были ли заданы метатеги для моего документа с указанным значением c при создании экземпляра моего компонента. Мой компонент: 

import { Component } from '@angular/core';
import { Meta } from '@angular/platform-browser';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent {

  constructor (
    private meta: Meta
  ) {
    // Only 2 objects of metatag for example
    this.meta.addTags([
      {httpEquiv: 'X-UA-Compatible', content: 'IE=edge', title: '123'},
      {name: 'keywords', content: 'My keywords'}
    ], true)
  }  
}

Вот что я написал для тестирования, но он не работает. 

import { TestBed, async, ComponentFixture } from '@angular/core/testing';
import { Meta } from '@angular/platform-browser';
import { AppComponent } from './app.component';

describe('AppComponent', () => {

  let meta: Meta;
  let metatags: HTMLMetaElement[];
  let comp: AppComponent;
  let fixture: ComponentFixture<AppComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ AppComponent ],
      providers: [ { provide: Meta } ],
    }).compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(AppComponent);
    comp = fixture.componentInstance;
    fixture.detectChanges();
  });

  it(`should have a metatag name=keywords with content='My keywords'`, () => {
    meta = TestBed.get(Meta);
    expect(meta.getTag('name=keywords')).toBe('My keywords');
  });

  it(`should have a metatag httpEquiv=X-UA-Compatible with content: 'IE=edge' and title: '123'`, () => {
    metatags = TestBed.get(Meta);
    expect(metatags.getTags('httpEquiv=X-UA-Compatible').content).toBe('IE=edge');
    expect(metatags.getTags('httpEquiv=X-UA-Compatible').title).toBe('123');
  });
});

Когда я запускаю тесты, в консоли выдается несколько ошибок:


ОШИБКА в src / app / app.component.spe c .ts: 27: 47 - ошибка TS2345: Аргумент типа «Мои ключевые слова» не может быть назначен параметру типа «Ожидаемый».

27 Ожидайте (meta.getTag ('name = Keywords')). toBe ('Мои ключевые слова ');

src / app / app.component.spe c .ts: 32: 21 - ошибка TS2339: свойство' getTags 'не существует для типа' HTMLMetaElement [] '.

32 Ожидайте (metatags.getTags ('httpEquiv = X-UA-совместимый'). Content) .toBe ('IE = edge');

src / app / app.component.spe c .ts: 33: 21 - ошибка TS2339: свойство 'getTags' не существует для типа 'HTMLMetaElement []'.

33 Ожидается (metatags.getTags ('httpEquiv = X-UA-Compatible'). title ) .toBe ('123');

1 Ответ

0 голосов
/ 28 февраля 2020

Я нашел решение этой проблемы. Вот мой новый код: 

import { TestBed, async, ComponentFixture } from '@angular/core/testing';
import { Meta } from '@angular/platform-browser';
import { AppComponent } from './app.component';

describe('AppComponent', () => {

  let meta: Meta;
  let metatags: HTMLMetaElement[];
  let comp: AppComponent;
  let fixture: ComponentFixture<AppComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ AppComponent ],
      providers: [
        { provide: Meta, useClass: Meta }
      ],
    }).compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(AppComponent);
    comp = fixture.componentInstance;
    fixture.detectChanges();
  });

  it(`should have a metatag name=keywords with content='My keywords'`, () => {
    meta = TestBed.get(Meta);
    expect(meta.getTag('name=keywords').content).toBe('My keywords');
  });

  it(`should have a metatag httpEquiv=X-UA-Compatible with content: 'IE=edge', title: '123'`, () => {
    metatags = TestBed.get(Meta).getTags('httpEquiv=X-UA-Compatible');
    metatags.forEach(el => {
      expect(el.content).toBe('IE=edge');
      expect(el.title).toBe('123');
    });    
  });
});
...