[change] introduce Jest preset

A simple Jest preset that configures module mapping and produces
human-readable styles (i.e., not converted to numeric form).

Fix #928
Fix #963

packages/react-native-web/jest-preset.json

@@ -0,0 +1,9 @@
+{
+  "moduleNameMapper": {
+    "^react-native$": "<rootDir>/node_modules/react-native-web/dist/cjs"
+  },
+  "setupFiles": [
+    "<rootDir>/node_modules/react-native-web/jest/setup.js"
+  ],
+  "testEnvironment": "jsdom"
+}

packages/react-native-web/jest/setup.js

@@ -0,0 +1,18 @@
+/* eslint-env jasmine, jest */
+
+'use strict';
+
+global.__DEV__ = true;
+
+const mockEmptyObject = {};
+
+// Make sure snapshots contain the original style objects
+jest.mock('../dist/cjs/modules/ReactNativePropRegistry', () => ({
+  register: id => id,
+  getByID: () => mockEmptyObject
+}));
+
+jest.mock('../dist/modules/ReactNativePropRegistry', () => ({
+  register: id => id,
+  getByID: () => mockEmptyObject
+}));

packages/react-native-web/jest/createSerializer.js → scripts/jest/serializer.js

@@ -1,4 +1,5 @@
-const React = require('react');
+import React from 'react';
+import { StyleSheet } from '../../packages/react-native-web/src';
 
 function createSerializer(styleSheet) {
   function flattenNodeStyles(node) {
@@ -53,4 +54,6 @@ function createSerializer(styleSheet) {
   return { test, print };
 }
 
-module.exports = createSerializer;
+const serializer = createSerializer(StyleSheet);
+
+export default serializer;

scripts/jest/setupFramework.js

@@ -2,10 +2,9 @@
 
 import Adapter from 'enzyme-adapter-react-16';
 import Enzyme from 'enzyme';
-import createSerializer from '../../packages/react-native-web/jest/createSerializer';
-import { StyleSheet } from '../../packages/react-native-web/src';
-
-const serializer = createSerializer(StyleSheet);
+import serializer from './serializer';
 
 Enzyme.configure({ adapter: new Adapter() });
+
+// TODO: move off legacy serializer
 expect.addSnapshotSerializer(serializer);