react-native/Libraries/Image/__tests__/resolveAssetSource-test.js
Geoffrey Goh e730a9fdd0 Load assets from same folder as JSbundle (Android)
Summary:
https://github.com/facebook/react-native/issues/3679 was only partially fixed as the behaviour only works on iOS. This implements the same behaviour for Android. If the JSBundle was loaded from the assets folder, this will load images from the built-in resources. Else, load the image from the same folder as the JS bundle.

EDIT: For added clarity:

On iOS,
Bundle Location: 'file:///Path/To/Sample.app/main.bundle'
httpServerLocation: '/assets/module/a/'
Name: 'logo'
type: 'png'
**Resolved Asset location: '/Path/To/Sample.app/assets/module/a/logo.png'**

On Android,
Bundle Location: 'file:///sdcard/Path/To/main.bundle'
httpServerLocation: '/assets/module/a/',
name: 'logo'
type: 'png'
**Resolved Asset location: 'file:///sdcard/Path/To/drawable_mdpi/module_a_logo.png'**
Closes https://github.com/facebook/react-native/pull/4527

Reviewed By: svcscm

Differential Revision: D2788005

Pulled By: mkonicek

fb-gh-sync-id: 3f6462a7ee6370a92dd6727ac422c5de346c3ff1
2016-01-06 08:46:35 -08:00

204 lines
5.6 KiB
JavaScript

/**
* Copyright (c) 2015-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
.dontMock('AssetRegistry')
.dontMock('../resolveAssetSource')
.dontMock('../../../local-cli/bundle/assetPathUtils');
var AssetRegistry = require('AssetRegistry');
var Platform = require('Platform');
var NativeModules = require('NativeModules');
var resolveAssetSource = require('../resolveAssetSource');
function expectResolvesAsset(input, expectedSource) {
var assetId = AssetRegistry.registerAsset(input);
expect(resolveAssetSource(assetId)).toEqual(expectedSource);
}
describe('resolveAssetSource', () => {
beforeEach(() => {
jest.resetModuleRegistry();
});
it('returns same source for simple static and network images', () => {
var source1 = {uri: 'https://www.facebook.com/logo'};
expect(resolveAssetSource(source1)).toBe(source1);
var source2 = {uri: 'logo'};
expect(resolveAssetSource(source2)).toBe(source2);
});
it('does not change deprecated assets', () => {
expect(resolveAssetSource({
deprecated: true,
width: 100,
height: 200,
uri: 'logo',
})).toEqual({
deprecated: true,
width: 100,
height: 200,
uri: 'logo',
});
});
it('ignores any weird data', () => {
expect(resolveAssetSource(null)).toBe(null);
expect(resolveAssetSource(42)).toBe(null);
expect(resolveAssetSource('nonsense')).toBe(null);
});
describe('bundle was loaded from network (DEV)', () => {
beforeEach(() => {
NativeModules.SourceCode.scriptURL =
'http://10.0.0.1:8081/main.bundle';
Platform.OS = 'ios';
});
it('uses network image', () => {
expectResolvesAsset({
__packager_asset: true,
fileSystemLocation: '/root/app/module/a',
httpServerLocation: '/assets/module/a',
width: 100,
height: 200,
scales: [1],
hash: '5b6f00f',
name: 'logo',
type: 'png',
}, {
__packager_asset: true,
width: 100,
height: 200,
uri: 'http://10.0.0.1:8081/assets/module/a/logo.png?platform=ios&hash=5b6f00f',
scale: 1,
});
});
it('picks matching scale', () => {
expectResolvesAsset({
__packager_asset: true,
fileSystemLocation: '/root/app/module/a',
httpServerLocation: '/assets/module/a',
width: 100,
height: 200,
scales: [1, 2, 3],
hash: '5b6f00f',
name: 'logo',
type: 'png',
}, {
__packager_asset: true,
width: 100,
height: 200,
uri: 'http://10.0.0.1:8081/assets/module/a/logo@2x.png?platform=ios&hash=5b6f00f',
scale: 2,
});
});
});
describe('bundle was loaded from file on iOS', () => {
beforeEach(() => {
NativeModules.SourceCode.scriptURL =
'file:///Path/To/Sample.app/main.bundle';
Platform.OS = 'ios';
});
it('uses pre-packed image', () => {
expectResolvesAsset({
__packager_asset: true,
fileSystemLocation: '/root/app/module/a',
httpServerLocation: '/assets/module/a',
width: 100,
height: 200,
scales: [1],
hash: '5b6f00f',
name: 'logo',
type: 'png',
}, {
__packager_asset: true,
width: 100,
height: 200,
uri: '/Path/To/Sample.app/assets/module/a/logo.png',
scale: 1,
});
});
});
describe('bundle was loaded from assets on Android', () => {
beforeEach(() => {
NativeModules.SourceCode.scriptURL =
'assets://Path/To/Simulator/main.bundle';
Platform.OS = 'android';
});
it('uses pre-packed image', () => {
expectResolvesAsset({
__packager_asset: true,
fileSystemLocation: '/root/app/module/a',
httpServerLocation: '/assets/AwesomeModule/Subdir',
width: 100,
height: 200,
scales: [1],
hash: '5b6f00f',
name: '!@Logo#1_€', // Invalid chars shouldn't get passed to native
type: 'png',
}, {
__packager_asset: true,
width: 100,
height: 200,
uri: 'awesomemodule_subdir_logo1_',
scale: 1,
});
});
});
describe('bundle was loaded from file on Android', () => {
beforeEach(() => {
NativeModules.SourceCode.scriptURL =
'file:///sdcard/Path/To/Simulator/main.bundle';
Platform.OS = 'android';
});
it('uses pre-packed image', () => {
expectResolvesAsset({
__packager_asset: true,
fileSystemLocation: '/root/app/module/a',
httpServerLocation: '/assets/AwesomeModule/Subdir',
width: 100,
height: 200,
scales: [1],
hash: '5b6f00f',
name: '!@Logo#1_€',
type: 'png',
}, {
__packager_asset: true,
width: 100,
height: 200,
uri: 'file:///sdcard/Path/To/Simulator/drawable-mdpi/awesomemodule_subdir_logo1_.png',
scale: 1,
});
});
});
});
describe('resolveAssetSource.pickScale', () => {
it('picks matching scale', () => {
expect(resolveAssetSource.pickScale([1], 2)).toBe(1);
expect(resolveAssetSource.pickScale([1, 2, 3], 2)).toBe(2);
expect(resolveAssetSource.pickScale([1, 2], 3)).toBe(2);
expect(resolveAssetSource.pickScale([1, 2, 3, 4], 3.5)).toBe(4);
expect(resolveAssetSource.pickScale([3, 4], 2)).toBe(3);
expect(resolveAssetSource.pickScale([], 2)).toBe(1);
});
});