FileSystem downloadAsync appearing to download image but the root folder of URI returned is empty

Environment

Environment: OS: macOS Sierra 10.12.6 Node: 8.9.4 Yarn: 1.3.2 npm: 5.6.0 Watchman: 4.9.0 Xcode: Xcode 9.2 Build version 9C40b Android Studio: Not Found

Packages: (wanted => installed) expo: Not Found react: Not Found react-native: ^0.52.0 => 0.52.0

Diagnostics report: https://exp-xde-diagnostics.s3.amazonaws.com/prodigynelson-a7f3cb6e-a870-4487-aae4-0cbee1eba463.tar.gz

Steps to Reproduce

Snack: https://snack.expo.io/rypVQTp_z

Expected Behavior

I am trying to display an image that I downloaded to the cache, but using the URI that is returned by downloadAsync makes the image blank (I am passing it style props).

Actual Behavior

Even though it says that the image was downloaded, I console log the contents of the folder that contains all my caches and it says it’s empty: screenshot 1, screenshot 2, screenshots side by side and the image component returns empty.

Reproducible Demo

See snack link

[machester4]

I had the same problem and the only temporary solution I found is to move the image to the gallery

let { uri } = await FileSystem.downloadAsync(this.props.item.imgUrl, FileSystem.cacheDirectory + ${this.props.item}.jpg); // here github does not correctly represent the concatenation using ``

const { status } = await Permissions.askAsync(Permissions.CAMERA_ROLL);

if (status === 'granted') {

  CameraRoll.saveToCameraRoll(uri).then((uriGallery) => {
      //here you have the url of the gallery to be able to use it
  });

}

[dereknelson]

@joshsiegl1 sorry I missed this, was combing through old issues and found it. IIRC it was an issue with using sagas, I’m not sure if you’re using it for image caching like I am but if you are I have public gists of my caching component which has worked fine for me