javascript - 如何监视函数中调用的属性？

Question

我需要监视“offsetWidth”，因为该值现在未定义。 getCurrentPage 是一个根据 id currentpage 获取元素的函数。

getCurrentPage 上的 spy 工作，但我还需要声明 offsetWidth。但这没有用。

函数:

getCurrentPage() {
    return this.$document[0].getElementById('currentPage');
}

calculateStep() {
    this.stepWidth = this.getCurrentPage().offsetWidth / (this.totalSteps - 1);
    return this.stepWidth;
}

单元测试:

let stepWidth = new StepController();
stepWidth.totalSteps = 5;

const dummyCurrentPage = '<div id="currentPage" style="width: 20%;"></div>';

spyOn(stepWidth, 'getCurrentPage').and.returnValue(dummyCurrentPage);

const expectedResult = '200 / 4';

const result = stepWidth.calculateStep();

expect(result).toBe(expectedResult);
});

我如何窥探 this.getCurrentPage().offsetWidth 的 offsetWidth？

Answer 1

找到了答案，将 dummyCurrentPage 转为 angular.element 并将 offsetWidth 定义为 angular.element。

const element = angular.element('<div id="currentPage" style="width: 20%;"></div>');

stepWidth.getCurrentPage().offsetWidth = 50;