apollo: Uncaught (in promise) undefined

Hi there!

I’m authenticating requests via cookies. If a user is not logged in, the server responds with this error message: response

Now, of course I want to catch this error in my Vue-Component:

methods: {
    tryNow() {
      this.$apollo.addSmartQuery('user', {
        query: gql `
          {
              me {
                  username
              }
          }`,
        error(e) {
          console.log(e.message)
          return true;
        },
      })
    }
  }
}

But for some reason this error always shows up in my console, saying that there is an uncatched Promise: console

I already had a look around here at related issues, especially #519 and #265. Sadly, I can’t really pinpoint where this error even comes from, because Chrome and Firefox show me completely different stacktraces, not even pointing to the error. At least Chrome said the error is from somewhere inside vue-apollo.esm.js, so here I am now.

I created the project with the Vue-Cli and didn’t change much of the original config, so I’m thinking this might be a bug?

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 7
Comments: 18 (1 by maintainers)

Most upvoted comments

So I had a look at the code, and this promise seems to cause the error:

https://github.com/Akryum/vue-apollo/blob/131a8821d64f29ee100621e0f457f32c052ce6c3/src/smart-query.js#L27-L30

When my auth-error occurs, firstRunReject() first gets called in Line 175, where _firstRunReject is set to null, then firstRunReject() is called a second time in Line 140, which causes the eventual promise rejection.

https://github.com/Akryum/vue-apollo/blob/131a8821d64f29ee100621e0f457f32c052ce6c3/src/smart-query.js#L292-L297

For testing purposes I just replaced resolve and reject with () => {}, which fixed the error while the rest still worked fine.

I’m still not quite sure where this rejection error is coming from, but I also don’t know what this promise is supposed to do in the first place. Git-blame suggests it’s SSR related (d88e6ace17dba94f84b3111d41894da5e19a240e by @Akryum).

JulianGaibler on Apr 29, 2019

Thanks a lot @Akryum ✌️

nether-cat on May 21, 2019

@Akryum for example, here is my constructor, all the unauthorized error gets caught and handled appropriately, but I always get this extra uncaught promise error- the error handler kicks in but it always results in a 2nd error and I can’t escape it:


  const apolloProvider = new VueApollo({
    defaultClient: apolloClient,
    defaultOptions: {
      $query: {
        fetchPolicy: 'cache-and-network',
      },
    },
    errorHandler(error) {
      if (isUnauthorizedError(error)) {
        if (router.currentRoute.name !== 'login') {
          router.replace({
            name: 'login',
            params: {
              wantedRoute: router.currentRoute.fullPath,
            },
          });
        }
      } else {
        console.log(
          '%cError',
          'background: red; color: white; padding: 2px 4px; border-radius: 3px; font-weight: bold;',
          error.message,
        );
      }
    },
  });

seandearnaley on Apr 22, 2019

@Akryum I believe we’re using the appropriate constructor, it seems any error thrown in the global error handler for errorHandler of the VueApollo will result in this uncaught promise, regardless of whether the error is captured or not.

seandearnaley on Apr 22, 2019

@firstaml-dima

Your first issue may be able to be solved by deconstructing the error: error ({ error }) { console.log(error) }.

Your second issue may be related to the scoping of the method. Try: error: ({ error }) => { console.log(this) }. That may preserve your context.

bswank on May 20, 2019

ya still no joy, curious if there is any official position on this issue

seandearnaley on May 20, 2019