React-redux-firebase: Error: "This operation is not supported in the environment this application is running on"

[banerjed]

Hi - getting this error when running on a Mac. Not sure if I am doing something incorrect (fairly new to this) - using the latest 1.2 version of the library.

Exact error message in the Simulator is
_This operation is not supported in the environment this application is running on. "location.protocol" must be http or https and web store must be enabled._

My store code looks like the following which is what causes the error to trigger (haven't even written any of the component code yet).

export default function configureStore(onCompletion:()=>void):any {
const enhancer = compose(
applyMiddleware(thunk.withExtraArgument(getFirebase), promise),
reactReduxFirebase(firebaseConfig, {userProfile: 'users', enableLogging: false}),
devTools({ name: 'groceries', realtime: true})
);

const store = createStore(reducer, enhancer);
persistStore(store, { storage: AsyncStorage }, onCompletion);

return store;
}

Code: https://github.com/banerjed/MobileStarter

thanks

[prescottprue]

Are you using react-native? This library is currently not supported with react-native due to firebase's JS library not being fully supported.

However, if you provide enabledRedirectHandling: false to your config, you should be able to use other parts of the library (redirect auth requires http/https, which react-native does not currently support).

Try this config:

const enhancer = compose(
  applyMiddleware(thunk.withExtraArgument(getFirebase), promise),
  reactReduxFirebase(
    firebaseConfig,
    { userProfile: 'users', enableRedirectHandling: false }
  ),
  devTools({ name: 'groceries', realtime: true})
);

You will need to use something like react-native-oauth to authenticate.

The hope is to make everything react-native compatible in the future (being added to roadmap). It will take either Firebase's JS library being fully react-native capable, or creating integrations for all of the missing pieces (like OAuth) to make that happen.

If you are sticking with react-native and don't want to wait for support, I would check out react-native-firestack. The author is a super cool guy, and is always available to answer questions/issues.

[banerjed]

Thanks for the pointer...

[Sigura]

got same (or not?) issue in safari under selenium tests (safari renew driver)

react-redux-firebase.js:7356:1963 Error: This operation is not supported in the environment this application is running on. "location.protocol" must be http or https and web storage must be enabled.

[prescottprue]

@Sigura A few things:

• Are you sure you followed the setup above including setting enabledRedirectHandling: false (seems to be the issue)?
• Did you include XMLHttpRequest as is done in the tests on the v1.4.0 branch:

// needed to fix "Error: The XMLHttpRequest compatibility library was not found." from Firebase auth
global.XMLHttpRequest = require('xmlhttprequest').XMLHttpRequest

Note: Needed since Firebase uses XMLHttpRequest internally (browsers have it by default). This has also been discussed in the ssr issue, and will be included in the docs before v1.4.0 is released.

[Sigura]

Are you sure you followed the setup above...

absolutely

I will try another suggestions.

and thank you for quick replay and your nice work!

[Sigura]

looks like it is for server side (

ERROR in ./~/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'child_process' in '.../node_modules/xmlhttprequest/lib'
resolve 'child_process' in '.../node_modules/xmlhttprequest/lib'
  Parsed request is a module

[prescottprue]

@Sigura Can you possible share a repo with me where I could reproduce what you are seeing. It will help speed up the debugging process if I can verify for sure.

[Sigura]

I see this issue in very-very specific environment: Safari 10.1 under selenium driver

other words hard to reproduce and without debug option.

and no, there is private repo (

found same report https://github.com/angular/angularfire2/issues/554

[prescottprue]

@Sigura There was a typo in my last post enabledRedirectHandling should be enableRedirectHandling as seen in the docs (notice that "enable" is not "enabled").

Try removing xmlhttprequest and changing to enableRedirectHandling: false in your config, then let me know.

[Sigura]

@prescottprue Thank you! It works perfectly now!

[prescottprue]

@Sigura Great to hear. As stated, this will be in the docs for v1.4.0