Mutation causes :ERROR Error: Network error: global is not defined

[fkolar]

Currently using Angular 7, apollo-rest link 0.7.3

I finally get the mutation working partially and there is a one problem where global is not intialized and it causes this error:

core.js:15724 ERROR Error: Network error: global is not defined
    at new ApolloError (bundle.esm.js:60)
    at Object.error (bundle.esm.js:1032)
    at notifySubscription (Observable.js:134)
    at onNotify (Observable.js:165)
    at SubscriptionObserver.error (Observable.js:224)
    at Object.error (Observable.js:463)
    at notifySubscription (Observable.js:134)
    at onNotify (Observable.js:165)
    at SubscriptionObserver.error (Observable.js:224)
    at bundle.umd.js:807

I initialize client

const restLink = new RestLink({
    uri: 'http://localhost:5000/api',
    credentials: 'same-origin',
    headers: {
      Accept: 'application/json',
      'Content-Type': 'application/json'
    }
  });
  return {
    link: restLink,
    cache
  };

I have this mutation:

export const addTodo = gql`
    mutation addTodo($input: Todo!){
      addTodo(input: $input) @rest( type: "Todo", method: "POST", path: "/todos" ) {
       ...todoFragment
      }
  }
  ${todoFragment}
`;

I execute it like this:

 add(text: string): void {

    this.apollo.mutate({
      mutation: addTodo,
      variables: {
        input: {
          description: text,
          completed: false
        }
      }
    }).subscribe(({data}) => {
      console.log('got data', data);
    }, (error) => {
      console.log('there was an error sending the query', error);
    });

The line that causes the error is bellow on the picture

Any idea why this global.FileList global object is undefined?

// FileList/File are only available in some browser contexts
        // Notably: *not available* in react-native.
        if ((global.FileList && object instanceof FileList) ||
            (global.File && object instanceof File)) {
            // Object is a FileList or File object => no keys to convert!
            return object;
        }

[fkolar]

this seems like initially angular-cli issue as I had to add line to the polyfills.ts

angular/angular-cli#8160
But the response for this is like: globals does not exists in browser and should not be in the client-side code?

Should it be in there in the REST LINK?

[fbartho]

That's news to me, in React-Native and other environments, global does exist? In browser, the global object is the window, so you could do something like: window.global = window to guarantee that it would exist?

[fkolar]

The thing I did was as suggested on the Angular but they consider this as a heck. this is what I did at the bottom:

https://github.com/fkolar/todo-rest/blob/master/src/polyfills.ts

https://github.com/fkolar/todo-rest

[fbartho]

I agree this is a hack, but only you know if your code is supposed to run in a browser, or on react-native. If you know of/can link to a better way to write Apollo-link-rest, I would support a change! Unfortunately window does not exist on mobile, so we're a bit stuck here!

[mluis]

I just hit on this issue.. is there a solution already?

[fbartho]

@mluis I assume you saw my recommendation (just include in your global scope, window.global = window;)

But also #293 will be shipping in v0.9.0 so that will also mitigate/resolve this issue. Closing for now.