Firebase auth properties are not updated on user profile change

[lpellegr]

Description

Firebase auth properties are not updated when user data are changed following a call to this.user.updateProfile, this.user.updateEmail, etc.

Expected outcome

Firebase auth properties value reflect the last changes.

Actual outcome

Firebase auth properties value remains the same as before an update. A full page reload is required to get fresh values.

Steps to reproduce

1. Make use of firebase-auth custom element:

<firebase-auth id="auth" user="{{user}}"></firebase-auth>

2. In your custom element template, include the user display name data binding:

Username: [[user.displayName]]

3. Create an action (triggered for instance upon a tap on a button) that changes the current user display name as follows:

this.user.updateProfile({displayName: 'What a fail!'});

When the button is tapped, your page should display Username: What a fail! but it does not. The old value remains.

I was thinking about something related to how dirty checking is working with Polymer. As a consequence, I tried to force the update manually:

this.set('user.displayName', newFullName);

Unfortunately, this fails with the following error:

Cannot assign to read only property 'displayName' of object...

Indeed, if I look at the implementation of firebase-auth.html, the property user is defined as readOnly.

I am still looking for a solution or a temporary workaround.

Browsers Affected

• [x] Chrome
• [x] Firefox
• [x] Safari 9
• [x] Safari 8
• [x] Safari 7
• [x] Edge
• [x] IE 11
• [x] IE 10

[lpellegr]

@e111077 @mbleigh Do you know if it is an expected behavior or a bug? do you know a workaround that does not require to reload the full page?

[tjmonsi]

Have you checked the new value of this.user.displayName. If it did changed then I guess you just need to propagate the change?

[lpellegr]

@tjmonsi If I look at the value after the change has been performed using the debug mode or by printing with console.log, I see the new content. However, the content is not updated where the data binding [[user.displayName]] is used. I tried to use notifyPath, etc. with no success.

[lpellegr]

@tjmonsi What is your suggestion to propagate the change?

[mbleigh]

This is expected. Firebase Auth data is not synced in real time. There may be a way to force it to fetch, but I'm not sure off of the top of my head.

On Sun, Jul 9, 2017, 5:20 AM Laurent Pellegrino notifications@github.com wrote:

@tjmonsi https://github.com/tjmonsi What is your suggestion to propagate the change?

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/firebase/polymerfire/issues/246#issuecomment-313916688, or mute the thread https://github.com/notifications/unsubscribe-auth/AAAD_mHt--CFuvS3JaFvDAXimmTQ4Gjoks5sMMWIgaJpZM4OOBI6 .

[tjmonsi]

@lpellegr would it be better to do this?

<firebase-auth id="auth" user="{{user}}"></firebase-auth>

this.$.auth.user.updateProfile({displayName: 'What a fail!'});

then see if this.$.auth.user changes

[lpellegr]

@tjmonsi I tried but I have the same issue as when I use this.user.

@mbleigh Do you know where I can find the information to force a fetch?

I have tried reload with no success.

[lpellegr]

@tjmonsi @mbleigh I have created a minimal example that reproduces the issue:

https://polymerfire-issue-246.firebaseapp.com/

You can try by using test@test.com as email and testing as password.

The source code is available below:

https://github.com/lpellegr/polymerfire-issue-246

[tjmonsi]

I'll try check this in a bit. Thanks for the repo.

[tjmonsi]

I have tried doing a notifyPath and it works. Please check my fork at https://github.com/tjmonsi/polymerfire-issue-246

[lpellegr]

@tjmonsi Thanks a lot, this is a solution.

However, it looks like against the encapsulation of web components. You need to bind the same property with all components that need the information for something that firebase-auth component has the hand on. Don't you think firebase-auth should trigger a notifyPath on its own?

In my real application, I use firebase-auth in several different nested components because in some I need access to signedIn and auth properties in addition to user property. If I need to pass all firebase-auth properties from a top component to all others in the tree (as for the current solution) it really become spaghetti code.

[tjmonsi]

Well that can be done, that is if firebase-auth has a method that allows updateProfile, then do a notifyPath to displayName and photoUrl. The only problem is when you have two firebase-auth elements. If you do an updateProfile on one element, the other will not be able to see that the displayName has been changed

[phidias51]

Since virtually every application has a user profile, wouldn't it make sense for a developer to be able to configure the database to point to a user profile? Imagine if you had a getProfile, and setProfile methods, and a way within the config to say "pathToUserProfile="/user/{{user.uid}}" is where the profile is located. This could give you a consistent approach to getting and setting user profile information, and would take care of automatically creating a profile, whenever the user logs in the first time. This would give developers the ability to focus more of their time on their app, and less on the "busy work" required for most user-centric apps.

[mbleigh]

@phidias51 I would encourage you to explore building your own elements to do something along those lines. For PolymerFire, the goal is to expose the primitives of the Firebase SDKs in a friendly-to-consume format for Polymer developers. Getting opinionated about app structure is beyond the scope of this library.

[exzizt]

I believe this is still an issue.

I have authenticated using Google Play Games. I have a message in my game that says, "Welcome !" (essentially that). When I change the name of this user in their Google Play Games profile, subsequent plays of the game (it has now been over a week) still display the user's old display name.

I have tried using "FirebaseAuth.CurrentUser.ReloadAsync()" and that doesn't seem to have "refreshed" the user's details as it is documented to do.

I will try some more playing around and edit my post here if I find anything.

Edit: Using "Social.localUser.userName" displays the new username. 👍

[diego-lipinski-de-castro]

This is happening when you use Firebase with Flutter, im having this problema right now. I update the user number profile, and I need a full reload to get it into the app, THIS IS REALLY ANNOYING. Its over ONE year and nothing yet?????

[tomCarnevale]

I'm having this issue using firebase authentication in unity as well. My email at my new job spelled my name wrong, so i fixed it. But when i authenticate with firebase using my work email, and I check my name via FirebaseAuth.CurrentUser.DisplayName, the name appears as the misspelled version. Checking my google account, everything is using my correctly spelled name. Is there perhaps a separate account I need to update that firebase is using?

This persists across multiple sessions, and even happens if I uninstall the app and reinstall it.

[GuilhermeLeivas]

Is there a final solution for this issue ?

[ChARCOOL]

Holy moly dude, this bug still exists in Jan 19, 2021, unbelievable.

[ashcrok]

Indeed, can confirm. On Jan 21, 2021, still an issue. Wowza!

[samtstern]

@ChARCOOL @ashcrok unfortunately this will be an issue in 2022 as well ... to quote the README

This library is no longer actively maintained. We do not recommend using this library in production.

If you maintain a fork of this library that you believe is healthier than the official version, we may consider recommending your fork. Please open a Pull Request if you believe that is the case.

I don't mean to come off as harsh but I want to set your expectations properly. You should not use polymerfire and you should not expect it to improve. There are likely other good Firebase+Polymer libraries out there but this isn't one of them.

[ashcrok]

@ChARCOOL @ashcrok unfortunately this will be an issue in 2022 as well ... to quote the README

This library is no longer actively maintained. We do not recommend using this library in production. If you maintain a fork of this library that you believe is healthier than the official version, we may consider recommending your fork. Please open a Pull Request if you believe that is the case.

I don't mean to come off as harsh but I want to set your expectations properly. You should not use polymerfire and you should not expect it to improve. There are likely other good Firebase+Polymer libraries out there but this isn't one of them.

You are completely right. I missed that info in the README. Thanks for the prompt response.