firebase / firebase/firebase-js-sdk
[Electron] Firebase v9 Electron setPersistence `LOCAL` and signInWithPopup & signInWithRedirect React-firebaseui
- Dominant language
- TypeScript
- Stars
- 5.1k
- Forks
- 1k
- Avg merge
- 2d 21h
- Merged PRs (30d)
- 37
Description
### [REQUIRED] Describe your environment
* Operating System version: Windows 11
* Browser version: Chromium 102
* Electron version: 18.3.0
* Firebase SDK version: 9.9.0
* React Firebaseui: 6.0.0
* Firebase Product: auth(setPersistence)
### [REQUIRED] Describe the problem
StyledFirebaseAuth from `react-firebaseui@6.0.0` complains with electron renderer at signing pop with provider.
The warnings id:
1. `unsupported-persistence-type`


https://github.com/firebase/firebase-js-sdk/blob/4983f4d5a0dc385c5b3e042ace44c8204d3cce81/packages/auth-compat/src/persistence.ts#L55-L63
Going after the reasons, Firebase JS SDK detects that Electron renderer is on a nodeJS environment so that `signInWithPopup` and `signInWithRedirect` aren't available. These functions assert if they are supported by the platform through `_isPopupRedirectSupported()` function.
https://github.com/firebase/firebase-js-sdk/blob/e3a5248fc8536fe2ca6d97483aa7e1b3f737dd17/packages/auth-compat/src/auth.ts#L294-L301
Which is:
https://github.com/firebase/firebase-js-sdk/blob/e3a5248fc8536fe2ca6d97483aa7e1b3f737dd17/packages/auth-compat/src/platform.ts#L136-L150
I found that electron renderer fails at `_isNativeEnvironment()` because is unable to prove it isn't `isNode()`
Correct me if I wrong, shouldn't it validate isElectron() to support for electron renderer environment? see that Electron renderer has `Object.prototype.toString.call(global.process) === '[object process]' ` true.
https://github.com/firebase/firebase-js-sdk/blob/e3a5248fc8536fe2ca6d97483aa7e1b3f737dd17/packages/auth-compat/src/platform.ts#L63-L65
https://github.com/firebase/firebase-js-sdk/blob/b835b4cbabc4b7b180ae38b908c49205ce31a422/packages/util/src/environment.ts#L58-L66
My workaround was to deceive Firebase with something like`global.process[Symbol.toStringTag] = 'electron'` so that `Object.prototype.toString.call(global.process) === '[object process]' ` isn't true;
Once the change is made, I was able to open up the popup.

I found other resources which suggested fixing the bug with the Bundler. For me, it didn't work out.
- https://github.com/firebase/firebase-js-sdk/issues/6066#issuecomment-1074422838
- https://medium.com/firebase-developers/using-firebase-in-electron-tips-and-tricks-24ac5b44bf5a
**My Webpack for renderer**
```js
{
mode: process.env.NODE_ENV,
target: 'electron-renderer',
devtool: 'source-map',
resolve:{
mainFields:{'browser', 'module'}
}
}
```
I searched the `esm` module or browser-ready module for `firebase/auth` however it used the `isNode()` implementation as well.
Contributor guide
Assessment
This issue has not been assessed yet.