反応ネイティブとWeb-reactjs、反応ネイティブ、jestjsのJestテストの実行方法

私は私のテストを実行したい Button.js、Button.ios.js、Button.androind.js さまざまなプラットフォーム用の個別のスナップショットを作成できます。これどうやってするの ？

import "react-native";
import React from "react";
import renderer from "react-test-renderer";
import Button from "..../Button";

test("Example of test", () => {
const c = renderer.create(
<Button text="asd" />
);
expect(c.toJSON()).toMatchSnapshot();
});

この例では、ネイティブButtonに対してのみスナップショットを作成し、通常のHTMLコンポーネントは無視します。

バージョン：

 "react-native": "^0.39.2",
"jest": "^18.0.0",

回答：

react-native-webを使ってHTML出力では、Jestが実際にwebpackを介してあなたの反応ネイティブコードを実行することはないので、反応ネイティブ→反応ネイティブWebエイリアスを処理しないので、実際のHTMLは表示されませんあなたのスナップショット。

それは、あなたのコードがあなたの選択したプラットフォームで期待どおりに動作します。私たちの場合、時にはアンドロイドやウェブのコードブランチが異なることがあります。私たちは、これを単純に助けて、異なるプラットフォームを簡単に模擬できるようにしました：

const withPlatform = (platform: string, testFunction: () => void) => {
const origOS = Platform.OS;
Platform.OS = platform;
try {
testFunction();
} finally { // eslint-disable-line  brace-style
Platform.OS = origOS;
}
};

テストにインポートしたら、次のようなクールなことをすることができます：

  describe("on the web", () => {
it("should render correctly", () => {
withPlatform("web", () => {
expect(renderer(<SomeComponent />)).toMatchSnapshot();
});
});
});