Please provide the following:
- SDK Version:
Expo SDK 46 - Platforms(Android/iOS/web/all):
iOS simulator 15.5 - Add the appropriate “Tag” based on what Expo library you have a question on.
Summary
Expected Behavior:
I should be able to select multiple images with allowsMultipleSelection: true just fine ( no problem selecting one image at a time with allowsMultipleSelection: false )
Note: I do have allowsEditing: false.
What is actually happening:
I get this error: "code":"ERR_INVALID_MEDIA_TYPE","message":"Cannot handle 'public.jpeg' media type"
Not sure where ‘public.jpeg’ comes from as I am selecting, from my IPhone enumator (iOS 15.5), different types of pictures from different albums, and the error is the same for any picture I select.
I do not have this error when allowsMultipleSelection: false.
Context:
React 18
Expo SDK 46
Expo-image-picker": “~13.3.1”,
iOS 15.5 Iphone Simulator
Error Screenshot
Things I’ve tried
- I ran
expo doctorto check if dependencies problems but there are none. - Tried adding other options such as
base64: true, different qualities, etc - Note: when I opened the
node_modulesfolder, atexpo-image-picker/plugin/tsconfig.json, this line was erroring:"extends": "expo-module-scripts/tsconfig.base"as the file was not found. So I manually installedexpo-module-scriptsand now the error is gone, with the line"extends": "expo-module-scripts/tsconfig.plugin"generated instead.
The above did not change anything though - I get the same error on selecting multiple images (ERR_INVALID_MEDIA_TYPE).
Packages:
React 18
Expo SDK 46
Expo-image-picker": “~13.3.1”,
Typescript: 4.8.2
"dependencies": {
"@apollo/client": "^3.6.9",
"@expo-google-fonts/lato": "^0.2.2",
"@expo/config-plugins": "^5.0.0",
"@expo/vector-icons": "13.0.0",
"@react-native-async-storage/async-storage": "~1.17.3",
"@react-native-community/datetimepicker": "6.2.0",
"@react-navigation/bottom-tabs": "6.0.5",
"@react-navigation/drawer": "6.4.3",
"@react-navigation/material-top-tabs": "6.2.2",
"@react-navigation/native": "6.0.2",
"@react-navigation/native-stack": "6.1.0",
"@reduxjs/toolkit": "1.8.5",
"apollo-link-prismic": "^1.1.1",
"array-move": "^4.0.0",
"axios": "^0.27.2",
"expo": "~46.0.13",
"expo-asset": "~8.6.1",
"expo-constants": "~13.2.3",
"expo-font": "~10.2.0",
"expo-image-loader": "^3.2.0",
"expo-image-manipulator": "~10.4.0",
"expo-image-picker": "~13.3.1",
"expo-linear-gradient": "~11.4.0",
"expo-linking": "~3.2.2",
"expo-media-library": "~14.2.0",
"expo-module-scripts": "^2.1.1",
"expo-splash-screen": "~0.16.1",
"expo-status-bar": "~1.4.0",
"expo-system-ui": "~1.3.0",
"expo-web-browser": "~11.0.0",
"formik": "^2.2.9",
"fuse.js": "^6.6.2",
"lodash.debounce": "^4.0.8",
"moment": "^2.29.4",
"native-base": "^3.4.16",
"react": "18.0.0",
"react-devtools": "4.25.0",
"react-devtools-core": "4.25.0",
"react-dom": "18.0.0",
"react-native": "0.69.6",
"react-native-collapsible": "^1.6.0",
"react-native-image-zoom-viewer": "^3.0.1",
"react-native-pager-view": "5.4.24",
"react-native-reanimated": "~2.9.1",
"react-native-render-html": "^6.3.4",
"react-native-safe-area-context": "4.3.1",
"react-native-screens": "~3.15.0",
"react-native-svg": "12.3.0",
"react-native-tab-view": "3.1.1",
"react-native-webview": "11.23.0",
"react-redux": "8.0.2",
"redux-devtools-extension": "2.13.9",
"redux-saga": "1.1.3",
"remote-redux-devtools": "0.5.16",
"typesafe-actions": "5.1.0"
},
"devDependencies": {
"@babel/core": "7.19.3",
"@types/react": "~18.0.21",
"@types/react-native": "^0.70.4",
"react-test-renderer": "18.0.0",
"typescript": "4.8.2"
},
Environment
expo-env-info 1.0.5 environment info:
System:
OS: macOS 12.6
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 18.7.0 - ~/.nvm/versions/node/v18.7.0/bin/node
Yarn: 1.22.19 - ~/.nvm/versions/node/v18.7.0/bin/yarn
npm: 8.15.0 - ~/.nvm/versions/node/v18.7.0/bin/npm
Watchman: 2022.07.04.00 - /opt/homebrew/bin/watchman
SDKs:
iOS SDK:
Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
IDEs:
Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
npmPackages:
expo: ~46.0.13 => 46.0.13
react: 18.0.0 => 18.0.0
react-dom: 18.0.0 => 18.0.0
react-native: 0.69.6 => 0.69.6
npmGlobalPackages:
expo-cli: 6.0.6
Expo Workflow: managed
Minimal reproducible example
import React from 'react'
import { launchImageLibraryAsync, MediaTypeOptions } from 'expo-image-picker'
import { View, Button } from 'react-native'
function GalleryImagesForm(props) {
const pickImages = async () => {
// No permissions request is necessary for launching the image library
try {
let result = await launchImageLibraryAsync({
mediaTypes: MediaTypeOptions.All,
allowsMultipleSelection: true,
})
console.log(result)
} catch (error) {
console.log(error)
}
}
return (
<View>
<Button title="Pick an image from camera roll" onPress={pickImages} />
</View>
)
}