Angular - Jasmine/karma - 订阅 lambda 表达式未执行答案

【问题标题】：Angular - Jasmine/karma - subscribe lambda expression is not getting executedAngular - Jasmine/karma - 订阅 lambda 表达式未执行
【发布时间】：2020-01-12 20:22:38
【问题描述】：

我正在使用 Jasmine/karma 为 angular 6 组件中的 observable 编写单元测试用例。请找到我正在为其编写测试用例的组件方法。

public ngOnInit(): void {
{
   this.editOrderContainer.getEditOrderState().subscribe(editOrderState => {
            this.shipAddressEditted = editOrderState.data.shipAddressEdited;
            this.shipInstructionEditted = editOrderState.data.shipInstructionEditted;
            this.hasShippingDetailsChanged = (this.shipAddressEditted || this.shipInstructionEditted) && this.existedAffectedOrderNumbers;
        });
...
}

在上面的代码中，我的测试用例应该涵盖/预期变量“hasShippingDetailsChanged”。在规范文件中，我会有如下的“它”

it('verify if Shipping instructions text is set to true if instructions test is changed.', () => {
            expect(component.hasShippingDetailsChanged).toBeTruthy();
        });

.spec 文件中的 mocking/spy 代码如下，

let editOrderContainer: any;
let getEditOrderState: any;

beforeEach(async () => {
...
     editOrderContainer = jasmine.createSpyObj('editOrderContainer', ['getEditOrderState', 'rebookOrder']);
            editOrderContainer.getEditOrderState.and.callFake(() => {
                return getEditOrderState;
            });
            getEditOrderState = {
                subscribe: function () {
                    return getOrderDetailsServiceResult();
                }
            };
            spyOn(getEditOrderState, 'subscribe').and.callThrough();
            ...
 });

 function getOrderDetailsServiceResult() {
        return {
            shipAddressEditted: true,
            shipInstructionEditted : true
        };
    }

EditOrderContainer 代码如下：

public getEditOrderState(): Observable<EditOrderState> {
        return this.store.select(s => s.editOrderReducer);
    }

我在这里面临的问题，它正在返回订阅中 editOrderState 的值，而 lambda 表达式语句没有得到执行

即shipAddressEditted、shipInstructionEditted、hasShippingDetailsChanged 的赋值语句没有被执行。我希望执行这些行，以便分配所需的变量 hasShippingDetailsChanged。

任何想法我在这里做错了什么？为什么 subscribe lambda 表达式没有在 spec 文件中执行？

【问题讨论】：

标签： angular typescript unit-testing jasmine karma-jasmine

【解决方案1】：

尝试使用stub，这样它也可以在其他地方重复使用。尝试以下更改：

在构造函数中将editOrderContainer 设为public：

constructor(public editOrderContainer: EditOrderContainer,.....)

创建一个stub 为EditOrderContainerStub：

export class EditOrderContainerStub{
   getEditOrderState(){
     return of({
       data: {
          shipAddressEditted: true,
          shipInstructionEditted : true
        }
     })
   }
}

在providers 的spec 文件中：

beforeEach(async () => {
    providers:[{provide: EditOrderContainer , useClass: EditOrderContainerStub}],

//....... your declaration

});

it('verify if Shipping instructions text is set to true if instructions test is changed.', () => {
     component.existedAffectedOrderNumbers = true;
     component.ngOnInit();
     expect(component.hasShippingDetailsChanged).toBeTruthy();
 });

【讨论】：

不，它没有解决问题。即使进行了您给出的更改，它仍然没有被执行
@Krishnan ：你设置了component.existedAffectedOrderNumbers = true 吗？让我更新我的代码

【解决方案2】：

我找到了答案，问题在于我为 editOrderContainer 及其方法 getEditOrderState 创建间谍的方式，该方法返回一个 observable。

在我之前的代码中，Observable.of(editOrderState) 缺少这是必需的。我也不应该或不需要模拟/监视subscribe 方法

我的间谍对象如下所示..

editOrderContainer = jasmine.createSpyObj('editOrderContainer', ['getEditOrderState', 'rebookOrder']);
editOrderContainer.getEditOrderState.and.callFake(() => {
            var editOrderState = getOrderDetailsServiceResult();
            return Observable.of(editOrderState);
        });


 function getOrderDetailsServiceResult() {
        return {
                data: {
                        shipAddressEdited: true,
                        shipInstructionEditted: true
                    }
                };
    }

【讨论】：