Amplify-js: undefined is not an object (evaluating 'window.location.href')

[dimonchik-com]

Describe the bug
I updated react-native from 0.61.4 to 0.61.5 and I got warning

WARN  Possible Unhandled Promise Rejection (id: 0):
TypeError: undefined is not an object (evaluating 'window.location.href')
http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:167369:89
step@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:165674:25

It's warning arise when i run next code

import Amplify, { Auth } from 'aws-amplify';
import API, {graphqlOperation} from "@aws-amplify/api";
import awsconfig from './../aws-exports';
Amplify.configure(awsconfig); // when i disable this row, warning disappear

[dimonchik-com]

I don't know where the problem is and at the moment just changed this code

    static browserOrNode() {
        // function to check if the global scope is "window"
        const isBrowser =  false;

        // function to test if global scope is binded to "global"
        const isNode = new Function(
            'try {return this===global;}catch(e){return false;}'
        );

        return {
            isBrowser: isBrowser(),
            isNode: isNode(),
        };
    }

[manueliglesias]

Hi @dimonchik-com

Did changing the code help with the warning?

if so, the original code was

        // function to check if the global scope is "window"
        const isBrowser = new Function(
            'try {return this===window;}catch(e){ return false;}'
        );

Could it be possible you have another import that could be defining the global window object? (e.g. some polyfill or similar)

[sasitha]

Having the exact same issue. What would be the cause for this?.

[IronLuffy55]

@manueliglesias
I ran into the same warning on a bare bones (i.e. react-native init) project running v0.59.10.

It looks like react-native wants to setup some global variables on start up.

See https://stackoverflow.com/questions/49911424/what-does-the-variable-window-represent-in-react-native

List of globals provided by react-native: https://github.com/facebook/react-native/blob/master/Libraries/Core/setUpGlobals.js

The current implementation will always return Browser = true if thats the case.

I can confirm that dimonchik-com snippet removed the warning on my project.

Hope some of this helps

[dimonchik-com]

@manueliglesias
I ran into the same warning on a bare bones (i.e. react-native init) project running v0.59.10.

It looks like react-native wants to setup some global variables on start up.

See https://stackoverflow.com/questions/49911424/what-does-the-variable-window-represent-in-react-native

List of globals provided by react-native: https://github.com/facebook/react-native/blob/master/Libraries/Core/setUpGlobals.js

The current implementation will always return Browser = true if thats the case.

I can confirm that dimonchik-com snippet removed the warning on my project.

Hope some of this helps

Hi IronLuffy55 thanks for you comment I have new snippet

global.window = undefined;
Amplify.configure(awsconfig);

setTimeout(()=>{
    global.window = global;
}, 1e3);

Please someone who develop this library fix this warning. Or give possibility to set environment manually

[bitcrumb]

We're seeing the same issue pop up in the crash & error logs of our RN application. However, it is unclear which code is defining the window object.

edit
It seems idd that for React Native the global variable (= "this" in the isBrowserOrNode check) is set explicitly to equal the window object. Hence, isBrowser will always be true.

[anija]

Any news on this?

[bitcrumb]

@dimonchik-com This error doesn't only manifests itself when calling Amplify.configure.

We are mainly seeing this error when our app becomes active again (after the user navigated away to Safari for instance, to visit an external link and then comes back). This is due to isBrowserOrNode being called whenever app state changes (see urlListener.native.ts file) & it checks for a deeplink (our app support deep linking using a custom scheme).

Whenever you call Auth.configure(), an URL listener is registered which is triggered for each change in state of your app. So whenever the app comes to the foreground this error will be triggered, since our app is incorrectly seen as a browser.

I tried your suggestion, but that didn't fix it.

[ericclemmons]

@manueliglesias Do you believe https://github.com/aws-amplify/amplify-js/pull/4803 may address this? If so, we can queue it for release 🤞

[bitcrumb]

@ericclemmons I replaced the implementation of the browserOrNode method in my React Native project with the implementation from the PR & the warning was not shown anymore. So indeed, it seems to address this issue.

[ericclemmons]

@bitcrumb Awesome! We'll get this released!

(Closing since #4803 resolves this)

[lexwebb]

@ericclemmons Has this been released? I'm still experiencing the issue on @aws-amplify/[email protected]

It looks in the commit/release tree that 2.1.5 was released later then this was merged

[ericclemmons]

@lexwebb Hmm, this seems to be released.

– https://codesandbox.io/s/amplify-jsissues4708-m93x1

And the new code appears here:

https://unpkg.com/browse/@aws-amplify/core@2.2.4/lib-esm/index.js

Within your project, you can confirm what version of @aws-amplify/core you're running via:

$ node
> require('@aws-amplify/core/package.json').version
'2.2.4'

[anija]

Using v2.2.5 the problem seems to be solved.

[lexwebb]

Just incase it helps anyone else it turns out I had another dependency relying on the core package I forgot to update and webpack was rationalising down to the lower version without the fix.