在Jest和React Native中模拟平台检测

Question

我试图测试的一些代码检测平台,例如:

import { Platform } from 'react-native';
...

if (Platform.OS === 'android') {
  ...
} else {
  ...
}

有没有一种合理的方法可以用Jest和/或其他东西来模拟这个,所以我可以在一次测试中测试两个分支？

或者是将它解耦并将平台放入例如上下文变量的智能方法？虽然总是感觉重组代码使其更容易测试是一种欺骗.

Answer 1

这对我有用(Jest 21.2.1,Enzyme 3.2.0):

jest.mock('Platform', () => {
    const Platform = require.requireActual('Platform');
    Platform.OS = 'android';
    return Platform;
});

把它无论是在测试的顶部,或者在一个beforeAll例如.

Answer 2

对于寻找此内容的每个人，它对我的​​帮助如下：

jest.mock('react-native/Libraries/Utilities/Platform', () => ({
    OS: 'android', // or 'ios'
    select: () => null
}));

Answer 3

我实现了一个小模拟，允许您Platform在测试期间在同一测试文件中进行更改。

将其添加到您的jest 设置文件中

jest.mock('react-native/Libraries/Utilities/Platform', () => {
  let platform = {
    OS: 'ios',
  }

  const select = jest.fn().mockImplementation((obj) => {
    const value = obj[platform.OS]
    return !value ? obj.default : value
  })

  platform.select = select

  return platform
});

然后你就可以轻松地改变Platform你的测试了。如果您正在使用Platform.select它也将按预期工作！

import { Platform } from 'react-native'

describe('When Android', () => {
  it('should ...', () => {
    Platform.OS = 'android'
    ...
  })
})

describe('When iOS', () => {
  it('should ...', () => {
    Platform.OS = 'ios'
    ...
  })
})

Answer 4

我实现模拟设置平台的方法只是直接在测试中进行设置：

it('should only run for Android', () => {
  Platform.OS = 'android'; // or 'ios'

  // For my use case this module was failing on iOS
  NativeModules.MyAndroidOnlyModule = {
    fetch: jest.fn(
      (url, event) => Promise.resolve(JSON.stringify(event.body))
    ),
  }; 
  return myParentFunction().then(() => {
    expect(NativeModules.MyAndroidOnlyModule.fetch.mock.calls.length).toBe(1);
    expect(fetch.mock.calls.length).toBe(0);
  });
});

这会将平台设置为仅在测试期间在Android上运行，以确保我的函数仅调用特定的函数。包装在依赖于平台的编译中的函数如下所示：

export default function myParentFunction() {
  if (Platform.OS === 'ios') {
    return fetch();
  }
  return NativeModules.MyAndroidOnlyModule.fetch();
}

我建议仅创建两个不同的测试，一个将平台设置为iOS，将另一个设置为Android，因为理想情况下，一个功能仅应负责。但是，我确定您可以使用它来运行第一个测试，动态设置平台并在一个函数中运行第二个测试。

Answer 5

React Native 0.61 更新

尽管公认的解决方案适用于 React Native 0.60 及以下版本，但 React Native 0.61 已经放弃了对 Haste 的支持，这会导致错误。

我能够按照这篇博客文章中描述的实现来模拟平台检测。

实际上，根据 React 团队的说法，我们现在必须模拟 react-native 接口。因此，您可以在react-native.js文件tests/__mocks__夹中创建一个文件并将此代码添加到模拟平台：

import * as ReactNative from "react-native";

export const Platform = {
  ...ReactNative.Platform,
  OS: "ios",
  Version: 123,
  isTesting: true,
  select: objs => objs["ios"]
};

export default Object.setPrototypeOf(
  {
    Platform
  },
  ReactNative
);

通过这个实现，我们现在可以在运行测试之前简单地覆盖操作系统，例如：

Platform.OS = 'android'

Answer 6

如果要在同一测试套件中并在一个测试运行中模拟不同的操作系统，则其他答案将不起作用，因此这是另一种方法。与其Platform.OS在代码中直接使用，不如在某个地方定义一个辅助函数，并使用该函数来获取对组件中操作系统的引用：

在“ helpers.js”中：

export function getOS() {
  return Platform.OS;
}

在您的组件中：

import * as helpers from './helpers';
render() {
    if (helpers.getOS() === 'android') {// do something}
}

此功能可以再在你的测试，如被嘲笑它

import * as helpers from './helpers';

// ...

it('does something on Android', () => {
  jest.spyOn(helpers, 'getOS').mockImplementation(() => 'android');
  // ...
}

it('does something else on iOS', () => {
  jest.spyOn(helpers, 'getOS').mockImplementation(() => 'ios');
  // ...
}

这个想法归功于GitHub问题评论。

Answer 7

这是你需要的模拟：

const mockPlatform = OS => {    
  jest.resetModules();  
  jest.doMock("Platform", () => ({ OS, select: objs => objs[OS] }));
};

有了它，您可以执行以下操作：

it("my test on Android", () => {
  mockPlatform("android");
});

it("my test on iOS", () => {
  mockPlatform("ios");
});

这样你就可以对两个平台进行测试

Answer 8

这对我有用...

jest.mock('react-native/Libraries/Utilities/Platform', () => {
  const Platform = require.requireActual(
    'react-native/Libraries/Utilities/Platform'
  )
  Platform.OS = 'android'
  return Platform
})