Тестирование на основе свойств имеет много преимуществ. Так что давайте также сделаем это в Angular.
Я использую testcheck@1.0.0-rc.2


Проверить код здесь.

Это компонент, который я хочу протестировать:

@Component({
  selector: 'mst-property-based',
  template: `
    <div class="mst-todo-item" *ngFor="let todo of todos">
      {{ todo.title }}
    </div>
  `,
})
export class PropertyBasedComponent {
  @Input() todos: Todo[];
}
  1. Оберните жасмин это
    После прочтения документа testcheck я использую его следующим образом:
export interface Options {
  times?: number;
  maxSize?: number;
  seed?: number;
}
export const testcheck = {
  it: (testDescription: string, generators: Generator<any>[], testFunction: any, options?: Options) => {
    let i = 1;
    let propertyInstance;
    if (generators.length === 1) {
      propertyInstance = property(generators[0], (...args: any[]) => {
        it(testDescription + " " + i++, () => {
          testFunction(...args);
        });
        return true;
      });
    } else if (generators.length === 2) {
      propertyInstance = property(generators[0], generators[1], (...args: any[]) => {
        it(testDescription + " " + i++, () => {
          testFunction(...args);
        });
        return true;
      });
    } else if (generators.length === 3) {
      propertyInstance = property(generators[0], generators[1], generators[2], (...args: any[]) => {
        it(testDescription + " " + i++, () => {
          testFunction(...args);
        });
        return true;
     });
    } else if (generators.length === 4) {
      propertyInstance = property(generators[0], generators[1], generators[2], generators[3], (...args: any[]) => {
        it(testDescription + " " + i++, () => {
          testFunction(...args);
        });
        return true;
      });
    } else {
      throw new Error('invalid generators');
    }
    check(propertyInstance, (options || { times: 5 }));
  },
};

2. Написать функцию-генератор

export function generateTodos(length: number) {
  return gen.array(generateTodo(), { size: length });
}
export function generateTodo() {
  return gen.object({
    id: gen.sPosInt,
    title: gen.alphaNumString.notEmpty(),
  });
}

3. Протестируйте свой компонент

testcheck.it(
  'should show todo',
  [
    generateTodos(5),
  ],
  (todos) => {
    fixture.detectChanges();
    component.todos = todos;
    fixture.detectChanges();
    queryDebugElements(de, '.mst-todo-item').forEach((el, index) => {
      hasContent(el, todos[index].title);
    });
  }
);