React native Jest模拟并监视导入的异步函数

我试图弄清楚如何在Jest中模拟导入的属性函数

这是我的组件

AboutScreen.js

import React from 'react';
import { Constants, WebBrowser } from 'expo';
import { View, Text } from 'react-native';

const AboutScreen = () => { 
return (
  <View>
    <Text testId={"t-and-c"} onPress={() => WebBrowser.openBrowserAsync('tcUrl')}>
Terms & conditions
    </Text>
  </View>
  );
};


export default AboutScreen;

从“React”导入React；
从“expo”导入{Constants，WebBrowser}；
从“react native”导入{View，Text}；
常量AboutScreen=（）=>{
返回(
WebBrowser.openBrowserAsync（'tcUrl'）}>
条款与条件
);
};
导出默认值AboutScreen；

我在AboutScreen.test.js中的测试如下所示

import React from 'react';
import { shallow } from 'enzyme';
import config from '../../config';
import AboutScreen from '../AboutScreen';
import { Constants, WebBrowser } from 'expo';
const { termsAndConditionsUrl, privacyPolicyUrl } = config;

jest.mock('expo', () => ({
  Constants: {
    manifest: {
        version: '0.0.1',
        releaseChannel: 'PROD',
    },
  WebBrowser: {
    openBrowserAsync: jest.fn()
    }
  },
 }));

it('click on terms and conditions link', () => {
   const mock = jest.spyOn(WebBrowser, 'openBrowserAsync'); 
   mock.mockImplementation(() => Promise.resolve());
   // above statement return 'Cannot spyOn on a primitive value; undefined given' 
   // WebBrowser.openBrowserAsync = jest.fn(); --> This returns `WebBroser undefined
   const wrapper = shallow(<AboutScreen />);
   wrapper.find({ testId: 't-and-c' }).simulate('click');
   expect(mock).lastCalledWith('abc');
   // expect(WebBrowser.openBrowserAsync).toHaveBeenCalledWith('tcUrl);
});

从“React”导入React；
从“酶”导入{shall}；
从“../../config”导入配置；
从“../AboutScreen”导入AboutScreen；
从“expo”导入{Constants，WebBrowser}；
const{termsAndConditionsUrl，privacyPolicyUrl}=config；
开玩笑的模仿（'expo'，（）=>({
常数：{
舱单：{
版本：“0.0.1”，
releaseChannel:'PROD'，
},
网络浏览器：{
openBrowserAsync:jest.fn（）
}
},
}));
它（'点击条款和条件链接'，（）=>{
const mock=jest.spyOn（WebBrowser，“openBrowserAsync”）；
mock.mockImplementation（（）=>Promise.resolve（））；
//上述语句返回“不能在原语值上窥视；未定义给定”
//WebBrowser.openBrowserAsync=jest.fn（）；-->这将返回'WebBrowser undefined'
常量包装器=浅（）；
find（{testId:'t-and-c'}）.simulate（'click'）；
expect（mock）.lastCalledWith（'abc'）；
//期望（WebBrowser.openBrowserAsync）.toHaveBeenCalledWith（'tcUrl）；
});

我能够模拟

常量.manifest.version

，但无法理解如何模拟'Browser'对象中的函数。

你成功了

---

您当前正在模拟

WebBrowser

，使其成为

常量

中的一个属性，因此需要像这样移出：

jest.mock（'expo'，（）=>({
常数：{
舱单：{
版本：“0.0.1”，
releaseChannel:'PROD'，
}
},
网络浏览器：{
openBrowserAsync:jest.fn（）
}
}));

---

另一个问题是使用

shall

时

simulate

如何工作。从文档的部分：

即使名称暗示这模拟了实际事件，

.simulate（）

实际上会根据您提供的事件以组件的道具为目标。例如，

.simulate（'click'）

将实际获得

onClick

属性并调用它

…而且由于您的组件没有

onClick

属性调用

.simulate（'click'）

最终什么也不做

来自Airbnb的开发人员建议直接调用道具并避免

simulate

您可以通过如下方式直接调用道具来调用

onPress

：

wrapper.find（{testId:'t-and-c'}）.props（）.onPress（）；

---

因此，总体而言，工作测试如下所示：

从“React”导入React；
从“酶”导入{shall}；
从“../../config”导入配置；
从“../AboutScreen”导入AboutScreen；
从“expo”导入{Constants，WebBrowser}；
const{termsAndConditionsUrl，privacyPolicyUrl}=config；
开玩笑的模仿（'expo'，（）=>({
常数：{
舱单：{
版本：“0.0.1”，
releaseChannel:'PROD'，
}
},
网络浏览器：{
openBrowserAsync:jest.fn（）
}
}));
它（'点击条款和条件链接'，（）=>{
const mock=jest.spyOn（WebBrowser，“openBrowserAsync”）；
mock.mockImplementation（（）=>Promise.resolve（））；
常量包装器=浅（）；
find（{testId:'t-and-c'}）.props（）.onPress（）；
expect（mock）.toHaveBeenCalledWith（'tcUrl'）；//成功！
});

如何还原

常量

mock？这是可行的，但在触发事件后如何等待承诺解决方案？