Reload RCTImageView when it's displaying the default image

Summary: public

If the frame is set, or the image view moves to a window, we should attempt to load the "real" image. The sizing logic shouldn't kick in if we're only displaying the default image.

Resolves https://github.com/facebook/react-native/issues/3460.

Reviewed By: tadeuzagallo

Differential Revision: D2555316

fb-gh-sync-id: c0c13070ee080bad2b30ca01d9d5173bead406e3

Examples/UIExplorer/UIExplorer/Images.xcassets/blue_square.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x",
+      "filename" : "blue_square.png"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

Examples/UIExplorer/UIExplorer/Images.xcassets/red_square.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x",
+      "filename" : "red_square.png"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

Examples/UIExplorer/UIExplorerIntegrationTests/UIExplorerIntegrationTests.m

@@ -63,6 +63,7 @@ RCT_TEST(IntegrationTestHarnessTest)
 RCT_TEST(TimersTest)
 RCT_TEST(AsyncStorageTest)
 RCT_TEST(AppEventsTest)
+RCT_TEST(ImageSnapshotTest)
 RCT_TEST(SimpleSnapshotTest)
 
 // Disable due to flakiness: #8686784

Examples/UIExplorer/UIExplorerIntegrationTests/js/ImageSnapshotTest.js

@@ -0,0 +1,42 @@
+/**
+ * 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';
+
+var React = require('react-native');
+var {
+  Image,
+  View,
+} = React;
+
+var { TestModule } = React.addons;
+
+var ImageSnapshotTest = React.createClass({
+  componentDidMount() {
+    if (!TestModule.verifySnapshot) {
+      throw new Error('TestModule.verifySnapshot not defined.');
+    }
+  },
+
+  done(success) {
+    TestModule.markTestPassed(success);
+  },
+
+  render() {
+    return (
+      <Image
+        source={require('image!blue_square')}
+        defaultSource={require('image!red_square')}
+        onLoad={() => TestModule.verifySnapshot(this.done)} />
+    );
+  }
+});
+
+ImageSnapshotTest.displayName = 'ImageSnapshotTest';
+
+module.exports = ImageSnapshotTest;

Examples/UIExplorer/UIExplorerIntegrationTests/js/IntegrationTestsApp.js

@@ -31,6 +31,7 @@ var TESTS = [
   require('./LayoutEventsTest'),
   require('./AppEventsTest'),
   require('./SimpleSnapshotTest'),
+  require('./ImageSnapshotTest'),
   require('./PromiseTest'),
 ];
 

Libraries/Image/RCTImageView.m

@@ -210,7 +210,8 @@ RCT_NOT_IMPLEMENTED(- (instancetype)init)
 - (void)reactSetFrame:(CGRect)frame
 {
   [super reactSetFrame:frame];
-  if (self.image == nil) {
+
+  if (!self.image || self.image == _defaultImage) {
     _targetSize = frame.size;
     [self reloadImage];
   } else if ([RCTImageView srcNeedsReload:_src]) {
@@ -254,7 +255,7 @@ RCT_NOT_IMPLEMENTED(- (instancetype)init)
         [strongSelf clearImage];
       }
     });
-  } else if (!self.image && self.src) {
+  } else if (!self.image || self.image == _defaultImage) {
     [self reloadImage];
   }
 }