Question

任何人都知道如何覆盖只读窗口或[htmlelement] .style？

等只读对象中的属性和函数

需要测试的示例函数：

public static getCSSTransitionEvent(element: HTMLElement): string {
    let transitions = {
        'transition': 'transitionend',
        'OTransition': 'oTransitionEnd',
        'MozTransition': 'transitionend',
        'WebkitTransition': 'webkitTransitionEnd'
    };

    for (let transition in transitions) {
        if (element.style[transition] !== undefined ) {
            return transitions[transition];
        }
    }
    return;
}

如何覆盖element.style中的transition属性来测试函数底部未定义的函数？

另一个例子，我如何测试这个if语句

function isCryptoAvailable() {
    if (typeof (window.crypto) !== 'undefined' && typeof (window.crypto.getRandomValues) !== 'undefined') {
        return true
    }
    else {
        return false
    }
}

Answer 1

这是通过属性描述符完成的。只读属性将writable描述符属性设置为false。只要它们是configurable，就可以使用Object.defineProperty重新定义它们，如：

 const cryptoDescriptor = Object.getOwnPropertyDescriptor(window, 'crypto');

 afterEach(() => {
   if (origCryptoDescriptor) {
     delete window.crypto;
     Object.defineProperty(window, 'crypto', cryptoDescriptor);
   }
 });

 it('...', () => {
   expect(origCryptoDescriptor).toBeTruthy();
   expect(origCryptoDescriptor.configurable).toBeTruthy();

   const cryptoMock = ...;
   delete window.crypto;
   window.crypto = cryptoMock;
   ...
 });

描述符应该在afterEach中恢复，因为即使测试失败也会执行它。如果属性不可配置，测试将失败。这在某些浏览器中是可行的，因此应该在已知失败的浏览器中从套件中排除测试。

同样涉及涉及非全局变量（如HTMLElement对象的函数，但如果可以完全模拟此对象而不是模拟其属性，则这是首选策略。

覆盖茉莉花单元测试中的只读对象

1 个答案: