diff --git a/Libraries/Image/__tests__/__snapshots__/assetRelativePathInSnapshot.js.snap b/Libraries/Image/__tests__/__snapshots__/assetRelativePathInSnapshot.js.snap new file mode 100644 index 000000000..3ce7e1922 --- /dev/null +++ b/Libraries/Image/__tests__/__snapshots__/assetRelativePathInSnapshot.js.snap @@ -0,0 +1,20 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`renders assets based on relative path 1`] = ` + + + + +`; diff --git a/Libraries/Image/__tests__/assetRelativePathInSnapshot.js b/Libraries/Image/__tests__/assetRelativePathInSnapshot.js new file mode 100644 index 000000000..e23bd1a75 --- /dev/null +++ b/Libraries/Image/__tests__/assetRelativePathInSnapshot.js @@ -0,0 +1,25 @@ +/** + * Copyright (c) 2017-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + */ +'use strict'; + +jest.disableAutomock(); + +const React = require('React'); +const ReactTestRenderer = require('react-test-renderer'); +const Image = require('Image'); +const View = require('View'); + +it('renders assets based on relative path', () => { + expect(ReactTestRenderer.create( + + + + + )).toMatchSnapshot(); +}); diff --git a/Libraries/Image/__tests__/img/img1.png b/Libraries/Image/__tests__/img/img1.png new file mode 100644 index 000000000..1914264c0 Binary files /dev/null and b/Libraries/Image/__tests__/img/img1.png differ diff --git a/Libraries/Image/__tests__/img/img2.png b/Libraries/Image/__tests__/img/img2.png new file mode 100644 index 000000000..1914264c0 Binary files /dev/null and b/Libraries/Image/__tests__/img/img2.png differ diff --git a/jest-preset.json b/jest-preset.json index d765ffc93..ccffab34a 100644 --- a/jest-preset.json +++ b/jest-preset.json @@ -7,12 +7,15 @@ ] }, "moduleNameMapper": { - "^[./a-zA-Z0-9$_-]+\\.(bmp|gif|jpg|jpeg|png|psd|svg|webp)$": "RelativeImageStub", "^React$": "/node_modules/react" }, "modulePathIgnorePatterns": [ "/node_modules/react-native/Libraries/react-native/" ], + "transform": { + "^.+\\.js$": "babel-jest", + "^[./a-zA-Z0-9$_-]+\\.(bmp|gif|jpg|jpeg|png|psd|svg|webp)$": "/node_modules/react-native/jest/assetFileTransformer.js" + }, "transformIgnorePatterns": [ "node_modules/(?!(jest-)?react-native|react-clone-referenced-element)" ], diff --git a/jest/assetFileTransformer.js b/jest/assetFileTransformer.js new file mode 100644 index 000000000..c533ec446 --- /dev/null +++ b/jest/assetFileTransformer.js @@ -0,0 +1,26 @@ +/** + * Copyright (c) 2017-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + */ +'use strict'; + +/* eslint-env node */ + +const path = require('path'); +const createCacheKeyFunction = require('fbjs-scripts/jest/createCacheKeyFunction'); + +module.exports = { + // Mocks asset requires to return the filename. Makes it possible to test that + // the correct images are loaded for components. Essentially + // require('img1.png') becomes `Object { "testUri": 'path/to/img1.png' }` in + // the Jest snapshot. + process: (_, filename) => + `module.exports = { + testUri: ${JSON.stringify(path.relative('.', filename))} + };`, + getCacheKey: createCacheKeyFunction([__filename]), +}; diff --git a/package.json b/package.json index 8ad958f1a..a0893ce70 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ }, "jest": { "transform": { + "^[./a-zA-Z0-9$_-]+\\.(bmp|gif|jpg|jpeg|png|psd|svg|webp)$": "/jest/assetFileTransformer.js", ".*": "./jest/preprocessor.js" }, "setupFiles": [ @@ -19,8 +20,7 @@ ], "timers": "fake", "moduleNameMapper": { - "^React$": "/Libraries/react-native/React.js", - "^[./a-zA-Z0-9$_-]+\\.png$": "RelativeImageStub" + "^React$": "/Libraries/react-native/React.js" }, "testPathIgnorePatterns": [ "Libraries/Renderer",