facebookarchive / react-native-fbsdk

A React Native wrapper around the Facebook SDKs for Android and iOS. Provides access to Facebook login, sharing, graph requests, app events etc.
https://developers.facebook.com/docs/react-native
Other
2.99k stars 910 forks source link

Requesting Page permissions displays blank screen rather than Permission Request Flow #723

Open jpcahoon opened 4 years ago

jpcahoon commented 4 years ago

🐛 Bug Report

When using LoginButton to request 'publish_pages' permission, the screen goes blank rather than starting the Permission Request Flow. The problem does not happen with 'publish_to_groups'. It also occurs with 'manage_pages'.

To Reproduce

Simply run the react-native-fbsdk example app with a request for 'publish_pages' permission when rendering the LoginButton. The app asks for a Facebook email and password. Provide them and hit "Log In". A blank screen appears.

With 'publish_to_groups', the next screen warns that the app needs Facebook Review and that some permissions have not been approved for use by Facebook. I hit "Continue" and the permissions are granted. (I am admin of both the group and the app).

The login I am using is the admin for the app and admin for the Page, so I am thinking that that is not the problem. Regardless, a blank screen does not seem right.

Expected Behavior

I would expect the Permission Request Flow to pop up so the user can approve giving the app the 'publish_pages' permission.

Screen Shot 2020-03-20 at 10 16 39 PM

Code Example

// The following code is identical to the example App.js, except the LoginButton has a permissions param // set to 'publish_pages'. Note that if the requested permission is 'publish_to_groups' there is no problem. import React, {Component} from 'react'; import {Alert, StyleSheet, Text, TouchableHighlight, View} from 'react-native'; import {LoginButton, ShareDialog} from 'react-native-fbsdk';

const SHARE_LINK_CONTENT = { contentType: 'link', contentUrl: 'https://www.facebook.com/', };

export default class App extends Component<{}> { _shareLinkWithShareDialog = async () => { const canShow = await ShareDialog.canShow(SHARE_LINK_CONTENT); if (canShow) { try { const {isCancelled, postId} = await ShareDialog.show( SHARE_LINK_CONTENT, ); if (isCancelled) { Alert.alert('Share cancelled'); } else { Alert.alert('Share success with postId: ' + postId); } } catch (error) { Alert.alert('Share fail with error: ' + error); } } };

render() { return (

{ Alert.alert(JSON.stringify(error || data, null, 2)); }} /> Share link with ShareDialog
);

} }

const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF', }, shareText: { fontSize: 20, margin: 10, }, });

module.exports = FBLoginButton;

Environment

info Fetching system and libraries information... System: OS: macOS 10.15.2 CPU: (8) x64 Intel(R) Core(TM) i7-6920HQ CPU @ 2.90GHz Memory: 218.90 MB / 16.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 13.5.0 - /usr/local/bin/node Yarn: 1.21.1 - /usr/local/bin/yarn npm: 6.13.4 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman SDKs: iOS SDK: Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1 IDEs: Android Studio: 3.5 AI-191.8026.42.35.6010548 Xcode: 11.2.1/11B500 - /usr/bin/xcodebuild npmPackages: react: 16.8.6 => 16.8.6 react-native: 0.60.0-rc.1 => 0.60.0-rc.1 npmGlobalPackages: create-react-native-app: 1.0.0 react-native-cli: 2.0.1 react-native-create-library: 3.1.2 react-native-git-upgrade: 0.2.7