Jest 模拟 localStorage 方法

IT技术 javascript reactjs local-storage jestjs
2021-04-21 05:42:02

我想在玩笑中模拟 localStorage 方法以进行错误模拟。我在utility.js 中定义了localstorage getter 和setter 方法。我想模拟localStorage.setItem在utility.setItem调用时抛出错误。

//file: utility.js
export default {
  getItem(key) {
    return localStorage.getItem(key);
  },
  setItem(key, value) {
    localStorage.setItem(key, value);
  }
};

开玩笑，

test('throw error', () => {
  localStorage.setItem = jest.fn(() => {
    console.log(" called ");
    throw new Error('ERROR');
  });

  utility.setItem('123', 'value');
});

然而，localStorage.setItemmock 永远不会被调用。我也试过做

window.localStorage.setItem = jest.genMockFunction(()=>{console.log(" Mock Called")});
global.localStorage.setItem = jest.fn(()=>{console.log(" Mock Called")});
4个回答

jest.spyOn(window.localStorage.__proto__, 'setItem');完全不需要其他任何东西，如此处所述：https : //github.com/facebook/jest/issues/6798#issuecomment-440988627

这也适用于我使用 sinon
2021-06-08 05:42:02

这与 Andreas 在答案中建议的一致，但我能够使用Storage接口模拟它。我做了这样的事情，

开玩笑，

test('throw error', () => {
  Storage.prototype.setItem = jest.fn(() => {
    console.log(" called "); // <-- was called 
    throw new Error('ERROR');
  });

  utility.setItem('123', 'value');
});

这个PR讨论也很有帮助。

我试过这个但回来了 ReferenceError: Storage is not defined
2021-05-28 05:42:02

如果你想测试 localStorage 函数，那么我想推荐jest-localstorage-mock npm 包。

按照文档在您的设置测试文件中配置此包后，您可以在之后执行此操作。

test('should save to localStorage', () => {
  const KEY = 'foo',
    VALUE = 'bar';
  dispatch(action.update(KEY, VALUE));
  expect(localStorage.setItem).toHaveBeenLastCalledWith(KEY, VALUE);
  expect(localStorage.__STORE__[KEY]).toBe(VALUE);
  expect(Object.keys(localStorage.__STORE__).length).toBe(1);
});


test('should have cleared the sessionStorage', () => {
  dispatch(action.reset());
  expect(sessionStorage.clear).toHaveBeenCalledTimes(1);
  expect(sessionStorage.__STORE__).toEqual({}); // check store values
  expect(sessionStorage.length).toBe(0); // or check length
});

要访问被测module全局范围内的内容，您需要使用global命名空间。所以要访问localStorage使用global.localStorage：

global.storage = {
  store:{},
  getItem: (key)=>this.store[key],
  setItem: (key, value)=> this.store[key] = value
}
其它你可能感兴趣的问题
上一篇任务“:app:compileDebugJavaWithJavac”执行失败。> 找不到 tools.jar 下一篇更新 Firebase 中的所有子项