Question

我有一个组件，该组件以编程方式创建一个span元素并向其中添加文本，然后检查其offsetWidth。在我的测试中，该值为0。我想知道如何将其“强制”为另一个任意值以进行测试。

我尝试了以下方法，但无济于事：

Object.defineProperty(HTMLElement.prototype, 'offsetWidth', { configurable: true, value: 500 })

有人能指出我正确的方向吗？谢谢！

Github：https://github.com/sickdyd/react-dynamic-badge

这是组件测试文件的链接：https://github.com/sickdyd/react-dynamic-badge/blob/master/src/test/test/DynamicBadge.test.js

Answer 1

为解决此问题，我使用了一种称为依赖注入（https://chipcullen.com/how-to-fake-the-window-object-in-jest-and-enzyme/）的技术

基本上通过测试用的道具，并在您的代码中使用它：

// for testing purposes use props.testRulerSpanWidth
// if it exists, otherwise use the default rulerSpan.offestWidth

const rulerSpanWidth = props.testRulerSpanWidth ?
                        props.testRulerSpanWidth
                       :
                        rulerSpan.offsetWidth;

ReactJS和开玩笑：如何为element.offsetWidth使用模拟值？

1 个答案: