onLoad, onError, onLoadStart and onLoadEnd do not fire for Image.

• I have reviewed the documentation
• I have searched existing issues
• I am using the latest React Native version

Environment

Environment:
  OS: macOS High Sierra 10.13.3
  Node: 8.9.4
  Yarn: 1.5.1
  npm: 5.5.1
  Watchman: 4.9.0
  Xcode: Xcode 9.2 Build version 9C40b
  Android Studio: 3.0 AI-171.4443003

Packages: (wanted => installed)
  react: 16.2.0 => 16.2.0
  react-native: 0.54.0 => 0.54.0

Steps to Reproduce

<Image
  sourse={{uri: this.props.uri}}
  onLoad={this.onLoad}
  onError={this.onError}
/>

Expected Behavior

Should work as described in documentation documentation

Actual Behavior

onLoad, onError, onLoadStart and onLoadEnd do not fire for Image, on both IOS and Android platforms

[iMerica]

Issue persists using latest and greatest as of today

[luisbraganca]

It does work, it just depends on the implementation.

For example, this code below works, it fires the console.log (this code is not useful or anything, I just created it so I could test if the events were properly being fired):

constructor(props) {
    super(props);
    this.state = { loaded: false };
}

_finishLoading = function () {
    console.log("Finished loading");
    this.setState({ loaded: true });
}

render = function () {
    return <Image onLoadEnd={this._finishLoading.bind(this)} {...this.props} />;
}

However, this code below does not work at all (it’s a non-working LazyImage implementation):

constructor(props) {
    super(props);
    this.state = { loaded: false };
}

_finishLoading = function () {
    console.log("Finished loading");
    this.setState({ loaded: true });
}

render = function () {
    var image = <Image onLoadEnd={this._finishLoading.bind(this)} {...this.props} />;
    return this.state.loaded ? image : <Image {...this.props} source={Loader} />;
}

I’m assuming it’s not firing the event because the Image has not been mounted so it will never initiate the loading. Is there any way to force its mount or to fake mount an element? I just want it to start loading so it can change the this.state.loading to true