我创建了一个非常简单的组件,它根据您使用的操作系统(在我的示例中是iOS和Android)显示图像
import { UAParser } from "ua-parser-js";
export const DownloadApp = ({ appleStoreUrl, playStoreUrl }: DownloadAppProps): JSX.Element => {
const parser = new UAParser();
const os = parser.getOS();
return (<div className="flex h-12">
{os.name === "iOS" && (
<div>
<a href={appleStoreUrl} title="Apple App Store">
<AppleAppStore height="48" />
</a>
</div>
)}
{(os.name === "Android" || os.name === "Android[-x86]") && (
<div className="shrink">
<a href={playStoreUrl} title="Google Play Store">
<GooglePlayStore height="48" />
</a>
</div>
)}
</div>)}
当在设备上手动测试时,这一切都工作得很好,但我试图在react-testing-library
和jest
中编写一些单元测试,以检查是否根据操作系统响应显示了正确的图像。
我试过模拟ua-parser-js
库,但我总是需要示例化库来获得getOS()
函数,我想设置该函数的mockImplementation以返回iOS和Android,但它似乎完全忽略了模拟,只是调用ua-parser-js
包并返回undefined。
1条答案
按热度按时间eyh26e7m1#
除了模仿ua-parser-js之外,还有一个选项是用jest模仿userAgent getter,通过这种方法,您可以使用任何您喜欢的用户代理来匹配您的测试场景。
在beforeEach中:
在您的售后服务中: