1

I have an app linked to firebase. When a user logs in, I assign his object firebase.auth().currentUser to a variable. Then, I add a property (username) to that variable . The thing is that when I console.log(currentUser) I get the object with the added property. But, when I try to JSON.stringify it then JSON.parse it again (i do this to store it on localStorage) I can't find my property username that I added. What's happening here ? 

var currentUser = firebase.auth().currentUser

currentUser.username = 'Foo';

console.log(currentUser) // => i get my prop username here

console.log(JSON.parse(JSON.stringify(currentUser))) // => i cant find my added prop here
user121548789
  • 189
  • 1
  • 9
  • what's the result of this : `console.log(localStorage.getItem('currentUser'))` – Abderrahim Soubai-Elidrisi Aug 02 '19 at 16:26
  • Objects in console are live (not snapshots) and will show modifictions made to them after they are logged. Try `console.log(JSON.stringify(currentUser))` will probably see it is empty object and you have a synchronicity issue – charlietfl Aug 02 '19 at 16:28
  • @AbderrahimSoubaiElidrissi same object on JSON format obviously – user121548789 Aug 02 '19 at 16:29
  • 1
    Please include a minimal repro so we can offer solid advice. See [how to ask](http://stackoverflow.com/help/how-to-ask) and [creating an mcve](http://stackoverflow.com/help/mcve) for some great tips on asking effective questions and getting superstar answers. Since you're taking an object Firebase manages and modifying it, it may be overwriting your changes. Copy out the data you need to your own object instead. Also, what's the point? Why are you storing ephemeral/changeable data provided by Firebase in localStorage? Hint: it's already stored there. Maybe just store username separately? – Kato Aug 02 '19 at 16:33
  • @charlietfl true , and how can i fix that? – user121548789 Aug 02 '19 at 16:39
  • https://stackoverflow.com/a/37901056/1175966 – charlietfl Aug 02 '19 at 16:41
  • @Kato i want to store it on localStorage because i don't wanna do much async requests in case the user refreshes the page ...and why i dont store the username seperately ? i know i can but i just wanna know why the `JSON.stringify(currentUser)` is mutating my object to its initial value – user121548789 Aug 02 '19 at 16:42
  • Guys if you can't answer please consider giving an upvote to the Question – user121548789 Aug 02 '19 at 17:07

1 Answers1

1

currentUser is not a plain object, it is an instance of the User class. As you can see, it implements a toJSON() method which is automatically detected and used by JSON.stringify as the canonical way to transform the object into JSON.

If you want to merge custom properties onto a Firebase user, you could just add toJSON() first:

var currentUser = firebase.auth().currentUser.toJSON();

this will translate the User object into a plain object which would then be able to have additional properties added and still serialize as expected. Note, however, that this obviously won't persist on the user either server-side or on firebase.auth().currentUser.

Michael Bleigh
  • 25,334
  • 2
  • 79
  • 85
  • Thank you SO MUCH, @Michael Bleigh! You can't iagine the HOURS I eas searching fr this answer! On Angular if you (user$ | async), the "plain" object gets printed on the HTML. But everytime I was trying to manipulate it on the TS... errors were thrown! With `toJSON()` you onle get the "good" porperties - easy to manipulate and no errors! TX! – Pedro Ferreira Mar 27 '20 at 00:08