Jest:模拟导航程序.storage.persist

Question

我正在尝试模拟navigator.storage.persist:的响应

test('Navigator.storage.persist error should be caught', async () => {
const persistMock = jest.fn(() => Promise.reject('Persist error'));
Object.defineProperty(global.navigator,
{ 'storage': 'persist' }, {
value: persistMock,
configurable: true
});
try {
await doStuff();
expect(global.navigator.storage.persist.mock.calls).to.equal(1);
expect(axios.mock.calls).to.equal(1);
} catch (error) {
expect(error).toBeUndefined();
}
})

我得到的错误：ReferenceError: persist is not defined

//Original Code
//Code in doStuff()
...
try {
const granted = await navigator.storage.persist();
if (granted)
console.log("Storage is now going to be persistent...", granted);
} catch (error) {
errorMessage = `Client did not allow storage to be persistent..${error}`;
}
...

我知道我嘲笑它是错误的，但我在网上找不到任何现有的例子可以模仿。我最多看过一些类似"如何用笑话嘲笑window.navigator.langage"的东西，但在我的情况下，persist嵌套在navigator.storage中，我不知道如何到达该层。

提前感谢！

Answer 1

您就快到了。以下是单元测试解决方案：

index.ts:

export async function doStuff() {
try {
const granted = await navigator.storage.persist();
if (granted) {
console.log('Storage is now going to be persistent...', granted);
}
} catch (error) {
const errorMessage = `Client did not allow storage to be persistent..${error.message}`;
throw new Error(errorMessage);
}
}

index.test.ts:

import { doStuff } from './';
describe('61069460', () => {
afterEach(() => {
jest.restoreAllMocks();
});
it('should granted', async () => {
const persistMock = jest.fn().mockResolvedValueOnce(true);
Object.defineProperty(navigator, 'storage', {
value: {
persist: persistMock,
},
configurable: true,
});
const logSpy = jest.spyOn(console, 'log');
await doStuff();
expect(persistMock).toBeCalledTimes(1);
expect(logSpy).toBeCalledWith('Storage is now going to be persistent...', true);
});
it('should throw custom error', async () => {
const mError = new Error('IO');
const persistMock = jest.fn().mockRejectedValueOnce(mError);
Object.defineProperty(navigator, 'storage', {
value: {
persist: persistMock,
},
configurable: true,
});
const logSpy = jest.spyOn(console, 'log');
await expect(doStuff()).rejects.toThrowError('Client did not allow storage to be persistent..IO');
expect(persistMock).toBeCalledTimes(1);
expect(logSpy).not.toBeCalled();
});
});

带覆盖率报告的单元测试结果：

PASS  stackoverflow/61069460/index.test.ts (9.134s)
61069460
✓ should granted (15ms)
✓ should throw custom error (3ms)
console.log node_modules/jest-environment-enzyme/node_modules/jest-mock/build/index.js:866
Storage is now going to be persistent... true
----------|---------|----------|---------|---------|-------------------
File      | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
----------|---------|----------|---------|---------|-------------------
All files |     100 |       50 |     100 |     100 |                   
index.ts |     100 |       50 |     100 |     100 | 4                 
----------|---------|----------|---------|---------|-------------------
Test Suites: 1 passed, 1 total
Tests:       2 passed, 2 total
Snapshots:   0 total
Time:        10.135s

源代码：https://github.com/mrdulin/react-apollo-graphql-starter-kit/tree/master/stackoverflow/61069460