Motion sensor permissions on iOS always return 'blocked'

[ThorstenBux]

Bug summary

Hi, I'm trying to get this library to request motion sensor permissions on iOS. I'm doing this using the following code:

    Platform.OS === "ios"
      ? PERMISSIONS.IOS.MOTION
      : PERMISSIONS.ANDROID.BODY_SENSORS
  )
    .then((resp) => console.log("motion", resp))
    .catch((e) => console.error("e motion", e));

However, this request always returns: 2023-04-25 21:49:01.025224+1200 AwesomeProject[61100:4985684] [javascript] 'motion', 'blocked' and no system permissions are shown. I've added the permission key/value into the .plist like this:

    <key>NSMotionUsageDescription</key>
    <string>To Play AR experiences</string>

I'm running my App on a real device (Iphone 14 iOS 16.1.2), not an emulator.

Any pointers are highly appreciated.

Full App code:

import { StatusBar } from "expo-status-bar";
import { useState } from "react";
import { StyleSheet, Button, View, SafeAreaView, Platform } from "react-native";
import { WebView } from "react-native-webview";
import {
  request,
  PERMISSIONS,
  RESULTS,
  check,
  checkMultiple,
  requestMultiple,
} from "react-native-permissions";
import Constants from "expo-constants";
import { DeviceMotion } from "expo-sensors";

export default function App() {
  const [close, setClose] = useState(false);

  if (close) {
    return (
      <SafeAreaView>
        <Button title="Press me" onPress={() => setClose(false)} />
      </SafeAreaView>
    );
  }
  console.log("OS", Platform.OS, Platform.Version);
  request(
    Platform.OS === "ios"
      ? PERMISSIONS.IOS.MOTION
      : PERMISSIONS.ANDROID.BODY_SENSORS
  )
    .then((resp) => console.log("motion", resp))
    .catch((e) => console.error("e motion", e));

  request(
    Platform.OS === "ios" ? PERMISSIONS.IOS.CAMERA : PERMISSIONS.ANDROID.CAMERA
  )
    .then((resp) => console.log("camera", resp))
    .catch((e) => console.error("e camera", e));

  return (
    <>
      <WebView
        source={{
          uri: "https://ffe2-103-235-92-17.ngrok-free.app",
        }}
        style={{ width: "100%", height: "100%" }}
        geolocationEnabled={true}
        mediaPlaybackRequiresUserAction={false}
        // onMessage={handleArMessage}
        mediaCapturePermissionGrantType={"grant"}
        allowsInlineMediaPlayback={true}
      />
      <Button
        title="Press me 1"
        onPress={() => {
          setClose(true);
        }}
      />
    </>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
});

Library version

3.8.0

Environment info

System:
    OS: macOS 13.2.1
    CPU: (10) arm64 Apple M1 Max
    Memory: 1.05 GB / 64.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 19.2.0 - /opt/homebrew/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 8.19.3 - /opt/homebrew/bin/npm
    Watchman: Not Found
  Managers:
    CocoaPods: 1.11.3 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 22.4, iOS 16.4, macOS 13.3, tvOS 16.4, watchOS 9.4
    Android SDK: Not Found
  IDEs:
    Android Studio: 2021.2 AI-212.5712.43.2112.8609683
    Xcode: 14.3/14E222b - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.15 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.2.0 => 18.2.0 
    react-native: 0.71.6 => 0.71.6 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Steps to reproduce

1. Create React native app
2. Add demo code shared below
3. add ` NSMotionUsageDescription To Play AR experiences` to Info.plist
4. Run App on a actual iPhone
5. Error will be shown in the console log.
6. I'm running my App on a real device (Iphone 14 iOS 16.1.2), not an emulator.

Reproducible sample code

import { StatusBar } from "expo-status-bar";
import { useState } from "react";
import { StyleSheet, Button, View, SafeAreaView, Platform } from "react-native";
import { WebView } from "react-native-webview";
import {
  request,
  PERMISSIONS,
  RESULTS,
  check,
  checkMultiple,
  requestMultiple,
} from "react-native-permissions";
import Constants from "expo-constants";
import { DeviceMotion } from "expo-sensors";

export default function App() {
  const [close, setClose] = useState(false);

  if (close) {
    return (
      <SafeAreaView>
        <Button title="Press me" onPress={() => setClose(false)} />
      </SafeAreaView>
    );
  }
  console.log("OS", Platform.OS, Platform.Version);
  request(
    Platform.OS === "ios"
      ? PERMISSIONS.IOS.MOTION
      : PERMISSIONS.ANDROID.BODY_SENSORS
  )
    .then((resp) => console.log("motion", resp))
    .catch((e) => console.error("e motion", e));

  request(
    Platform.OS === "ios" ? PERMISSIONS.IOS.CAMERA : PERMISSIONS.ANDROID.CAMERA
  )
    .then((resp) => console.log("camera", resp))
    .catch((e) => console.error("e camera", e));

  return (
    <>
      <WebView
        source={{
          uri: "https://ffe2-103-235-92-17.ngrok-free.app",
        }}
        style={{ width: "100%", height: "100%" }}
        geolocationEnabled={true}
        mediaPlaybackRequiresUserAction={false}
        // onMessage={handleArMessage}
        mediaCapturePermissionGrantType={"grant"}
        allowsInlineMediaPlayback={true}
      />
      <Button
        title="Press me 1"
        onPress={() => {
          setClose(true);
        }}
      />
    </>
  );
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
});

[zoontek]

@ThorstenBux Does the issue happen using this repository example app? https://github.com/zoontek/react-native-permissions/tree/master/example

EDIT: Don't request permissions inside component render, use useEffect for that.

[ThorstenBux]

@zoontek I'll check that and let you know. Thanks

[ThorstenBux]

Hi @zoontek , I got the example to work and yes the example reports the same. Please see attached screenshots: This was taken of a fresh install and the system motion permission popup never cam up

[ThorstenBux]

Sorry my bad, I had Motion & Fitness off in Settings/Privacy. Turns out that blocks all the Motion permissions. Thank you for your support.