react-linkedin-login-oauth2 icon indicating copy to clipboard operation
react-linkedin-login-oauth2 copied to clipboard

After Popup closes, my main app background image disappears (blank)

Open lynx-io opened this issue 4 years ago • 4 comments

As the title says, the problem comes after log in successfully, the popup window will close and successfully send me the code to my main reactjs application but at the same time, it also makes my background image and some icons disappear. Why is this? I simply implemented the code displayed in the description.

index.js

import { LinkedInPopUp } from 'react-linkedin-login-oauth2';
<Route exact path="/linkedin" component={LinkedInPopUp} /> 

oauth.js

import { LinkedIn } from "react-linkedin-login-oauth2";

handleLinkedInFailure = (response) => {
     console.log("linkedinfailure", response);
   };
   handleLinkedInSuccess = (response) => {
     console.log("linkedinsuccess", response);
   };

<LinkedIn
                 clientId="XXX"
                 onFailure={this.handleLinkedInFailure}
                 onSuccess={this.handleLinkedInSuccess}
                 redirectUri="http://localhost:3000/linkedin"
                 renderElement={({ onClick, disabled }) => (
                   <Button
                     icon={<IconFont type="icon-linkedin" />}
                     onClick={onClick}
                     disabled={disabled}
                   >
                     Log in with Linkedin
                   </Button>
                 )}
               />

lynx-io avatar Oct 26 '20 14:10 lynx-io

Hey @lynguistical, can you replicate your issue in a repository?

nvh95 avatar Oct 28 '20 07:10 nvh95

It's happening the same here: https://github.com/ItaloGoncales/react-linkedin-login-oauth2-demo

ItaloGoncales avatar Sep 07 '21 19:09 ItaloGoncales

@ItaloGoncales I cannot reproduce your issue. I clone your repository then run, but your linkedin app is disabled. I replaced it by my linkedin application's clientId and it work fine. Can you provide more information?

image

Also, react-linkedin-login-oauth2 is now at 2.0.0 . If possible, can you use that version? It come with breaking changes, please refer to Usage or Migration guide from 1 to 2. The example code is also updated, too https://github.com/nvh95/react-linkedin-login-oauth2-demo

nvh95 avatar Nov 21 '21 16:11 nvh95

I could fix that by removing the background definition from index.css and making it hardcoded into the body tag on my application.

Maybe it resets the CSS styles?

ItaloGoncales avatar Jan 28 '22 23:01 ItaloGoncales