Вот несколько очень полезных вспомогательных функций для меня, когда я пишу модульные тесты Angular.
-
Проверить код здесь.
-
Элементы запроса:
function queryDebugElement(de: DebugElement, selector: string) {
return de.query(By.css(selector));
}
function queryDebugElements(de: DebugElement, selector: string) {
return de.queryAll(By.css(selector));
}
Проверяем, есть ли элементы:
function hasElement(de: DebugElement, selector: string, failedMessage?: string) {
failedMessage = failedMessage || '';
expect(!!queryDebugElement(de, selector)).toBe(true, failedMessage);
}
function hasNoElement(de: DebugElement, selector: string, failedMessage?: string) {
failedMessage = failedMessage || '';
expect(!!queryDebugElement(de, selector)).toBe(false, failedMessage);
}
Проверяем, есть ли контент:
function hasContent(el: DebugElement | string, content: string, failedMessage?: string) {
failedMessage = failedMessage || '';
if (typeof el === "string") {
expect(el).toContain(content, failedMessage);
} else {
expect(el.nativeElement.textContent).toContain(content, failedMessage);
}
}
function hasNoContent(el: DebugElement | string, content: string, failedMessage?: string) {
failedMessage = failedMessage || '';
if (typeof el === "string") {
expect(el).not.toContain(content, failedMessage);
} else {
expect(el.nativeElement.textContent).not.toContain(content, failedMessage);
}
}
Проверьте, есть ли классы css:
function hasCssClass(el: DebugElement, cssClass: string, failedMessage?: string) {
failedMessage = failedMessage || '';
expect(getCssClassArray(el).indexOf(cssClass) > -1).toBe(true, failedMessage);
}
function hasNoCssClass(el: DebugElement, cssClass: string, failedMessage?: string) {
failedMessage = failedMessage || '';
expect(getCssClassArray(el).indexOf(cssClass) === -1).toBe(true, failedMessage);
}
function getCssClassLength(de: DebugElement) {
return getCssClassArray(de).length;
}
function getCssClassArray(de: DebugElement) {
return de.nativeElement.className.split(" ");
}