_super.call is not a function, with fix

[jfrancos]

Bug Report

• Affected Package(s): offix-client
• Package version(s): 0.15.5
• Platform (e.g. Android/iOS): React
• Platform Version: 17.0.1
• Cordova Version:
• Node.js / npm versions: 14.15.3 / 6.14.9

Trying to use offix-client with snowpack 2.18.5, but calling new ApolloOfflineClient(config) results in getting Uncaught TypeError: _super.call is not a function

For a sanity check I tested it out with CRA, and this issue does not come up. On the other hand, I was previously using snowpack with @apollo/client, and likewise, this issue did not come up.

Googling the above error, the main thing I found was this apollo-client issue from 2017, where it seemed the problem had to do with rollup. I believe snowpack does use rollup.

Here's some minimal code to reproduce the issue:

$ npx create-snowpack-app superCall --template @snowpack/app-template-blank
$ cd superCall
$ npm install react graphql @apollo/client offix-client
$ npm install -D snowpack

// src/index.js

// same result whether getting InMemoryCache and HttpLink
// from @apollo/client, or apollo-cache-inmemory + apollo-link-http
// import { InMemoryCache } from 'apollo-cache-inmemory';
// import { HttpLink } from 'apollo-link-http';
import { InMemoryCache, HttpLink } from '@apollo/client';
import { ApolloOfflineClient } from 'offix-client';
import React from 'react';

const config = {
  link: new HttpLink({ uri: 'https://graphql.fauna.com/graphql' }),
  cache: new InMemoryCache(),
};

new ApolloOfflineClient(config);

It seems the error is due to some kind of module style incompatibility, and I was able to get the _super.call error to go away by adding the following two lines to offix/packages/offix/client/tsconfig.json:

{
  "compilerOptions:  {
    ...
    "module": "es6",
    "moduleResolution": "node",
    ...
  }
}

But now, there is a jest test failing with

    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){export * from "./ApolloOfflineClient";
                                                                                             ^^^^^^
    SyntaxError: Unexpected token 'export'

I can try to figure out how to get the tests to pass, but first I thought I'd pause and get some feedback:

1. Are the changes I'm making to tsconfig.json okay with you?
2. If no, can you point me in the right direction as far as some other solution? (perhaps the issue needs to be addressed in snowpack or rollup instead?)
3. If yes, can you point me in the right direction as far as helping the test pass?

[FredKSchott]

Maintainer of Snowpack here! Snowpack uses Rollup to install your dependencies, so I just wanted to highlight that this is most likely affecting all other Rollup projects as well.

[jfrancos]

Hi @FredKSchott,

What are your thoughts on next steps for getting offix to work with snowpack? I think your comment implies that rollup is the place where this needs to get fixed, rather than here (but I'm not 100% -- sorry if I'm being dense here)

If you think I ought to just repost this as a rollup issue (I am happy to do this), can you point me in the direction of your rollup.config.js file, and let me know any other helpful info I could include in the issue?

[wtrocki]

I would look to see if we can do something about it. We use browserify and webpack. There is issue we have to start publishing our packages in minified precompiled version ( we do not do that now)

[jfrancos]

Thanks @wtrocki. So I think you're saying this is an issue that would need to be addressed in offix, not snowpack or rollup. Or am I oversimplifying it? I do see (I think?) an analogous suggestion in the apollo issue mentioned in my initial post.

@FredKSchott, is there something I can do in Snowpack analogous to this workaround, from the same apollo issue?

@lukastaegert (rollup maintainer) -- do you have any thoughts on this, or suggestions for a work-around?

[wtrocki]

Offix exports modules using common.js format. https://github.com/aerogear/offix/blob/master/tsconfig.json#L16

Those cannot be used in the web directly and require users to use bundler. This is due to number of factors:

• If you care about bundle size using common.js format will allow us to minimalize bundle size
• Avoid problems with using specific bundlers (webpack, rollup issues people report).

@jfrancos Offix itself wasn't updated to latest Apollo version. If you require only read only access check apollo cache persist (which have been tested with Apollo 3.0 and has active rollup config)

I'm mantainer of both projects. In offix we currently building an datastore solution. For Apollo 3.0 offline support I would recommend to use https://github.com/apollographql/apollo-cache-persist that exports package in bundled and minified form.

As for issue this is due to using '@apollo/client' (3.0) with the packages that are coming from apollo 2.0

[kingsleyzissou]

Hi @jfrancos, we have made the decision to move away from the Apollo client and we have decided to deprecate our Offix packages and release our Datastore. I will be closing this issue, but if you have any questions, please feel free to let us know.

You can see the docs for the updated datastore here: https://offix.dev/docs/getting-started