如何在茉莉花单元测试中传递一个空数组？

Question

我正在开发一个 angular 项目，我正在测试一个函数，该函数填充一个变量名 'recentSearches'，该变量名使用 *ngFor 呈现 table，该函数接收一个名为 'recentSearches' 的变量作为参数，它是一个数组。当添加参数 'recentSearches' 不为空时，我需要在 table 上方显示一个名为“最近”的标签。我在class的开头创建了一个boolean属性，名称为'recentSearchesHasValue'，默认为false，当函数为运行时，如果'recentSearches' 有我将 'recentSearchesHasValue' 设置为 true 的元素，然后在 HTML 我检查，使用 *ngIf wheter 'recentSearchesHasValue' 是真还是假来显示 'recent' 标签.一切正常。我的问题是单元测试。当 'recentSearches' 是填充对象数组和它为空时，我正在尝试为这两种情况创建单元测试。我写的第一个测试通过了，但是第二个没有通过测试。这是我上面描述的.ts中的函数：

handleRecentSearchesDisplay(recentSearches: RecentSearch[]): void {
    if (recentSearches) {
        this.recentSearchesHasValue = true;
        this.recentSearches = recentSearches;
        this.viewRecentSearches = [];
        for (const search of recentSearches) {
            this.viewRecentSearches.push(this.createRecentSearch(search));
        }

        if (!this.viewRecentSearches.length) {
            this.progressbarVisibility.emit(false);
        }
    }
}

这是我失败的测试：

describe('handleRecentSearchesDisplay', () => {
    let recentSearch: RecentSearch[] = RecentSearchesTestModal;

    it('display recent label if recentSearch is not empty', () => {
        spyOn(component, 'createRecentSearch');
        component.handleRecentSearchesDisplay(recentSearch);
        expect(component.recentSearchesHasValue).toBeTrue();
    });

    it('Do not display recent label if recentSearch is empty', () => {
        spyOn(component, 'createRecentSearch');
        let recentSearch = [];
        component.handleRecentSearchesDisplay(recentSearch);
        expect(component.recentSearchesHasValue).toBeFalse();
    });
});

感谢您的帮助。谢谢。

Answer 1

我认为您必须将 if 条件更改为：

handleRecentSearchesDisplay(recentSearches: RecentSearch[]): void {
    if (recentSearches?.length > 0) { // here you need to test if list is not empty
        this.recentSearchesHasValue = true;
        this.recentSearches = recentSearches;
        this.viewRecentSearches = [];
        for (const search of recentSearches) {
            this.viewRecentSearches.push(this.createRecentSearch(search));
        }

        if (!this.viewRecentSearches.length) {
            this.progressbarVisibility.emit(false);
        }
    }
}

如何在茉莉花单元测试中传递一个空数组？

how to pass an empty array in a unit test with jasmine?

jasmine

karma-jasmine

angular