Apollo-server: GraphQL Playground CDN URL is not valid

[gridviewdesign]

When starting a new project, and navigating to the endpoint, the following error is thrown in the console:

GET https://cdn.jsdelivr.net/npm/@apollographql/[email protected]/build/static/js/middleware.js net::ERR_ABORTED 404

GET https://cdn.jsdelivr.net/npm/@apollographql/[email protected]/build/static/css/index.css net::ERR_ABORTED 404

graphql:537 Uncaught ReferenceError: GraphQLPlayground is not definedat graphql:537

It appears that the url for the cdn is no longer valid, and needs to be updated to to

https://cdn.jsdelivr.net/npm/@apollographql/[email protected]/build/static/js/middleware.js

[gridviewdesign]

For anyone else struggling with this, I learned that you can override the version of graphql-playground-react in your ApolloServer configuration like so.

const server = new ApolloServer({
  typeDefs,
  resolvers,
  playground: { version: '1.7.25' }
});

I'm not sure why 1.7.10 is no longer available in the CDN.

[tripndots]

I got this too. Changing the playground confirmed to fix it for me as well.

[Tahir500]

i am also getting same issue when i was update the apollo-server from 2.1.0 to 2.5.0

[jesse-holden]

same issue, took me a while to find this thread with the fix

[abernix]

Taking a look at this now, thank you for reporting it. I think I can have this fixed in a backwards compatible way pretty soon.

[abernix]

We (@trevor-scheer and I) believe we've resolved this problem for anyone affected by publishing @apollographql/[email protected] and letting the jsDelivr CDN pick it up naturally.

Anyone who had applied the fix above should be able to remove the playground: { version: '1.7.25' } workaround (thank you @gridviewdesign for sharing that!). I expect to release the new version of Playground (which also brings in all the recent changes from the official GraphQL Playground plus some additional tweaks we're experimenting with ourselves ✨) in Apollo Server 2.6.0 (tracked in #2669).

_As to what happened, for anyone interested..._

We previously hadn't published that specific version of @apollographql/graphql-playground-react, instead only publishing a version of @apollographql/graphql-playground-html (previously @1.6.6) which still leveraged the upstream [email protected].

New changes, which were necessary to make to the graphql-playground-react sub-package which were previously not necessary, required that we publish the first version of @apollographql/graphql-playground-react (in our own scope) with @apollographql/graphql-playground-html depending on that.

That would have been okay, however, apollo-server itself depended on a caret range semver-version (e.g. ^1.5.5) of @apollographql/graphql-playground-html, thus causing new installs (and updates, or those without package-lock.json files) to pick up the latest version. That's an oversight on our part, partly in due to a desire to maintain parity between official versions of graphql-playground-* packages and our fork with our changes.

To mitigate against this happening again, we'll be pinning the exact version in future apollo-server releases.

[Siyfion]

@abernix I believe that this is still an issue in the currently available https://github.com/apollographql/fullstack-tutorial/ project.

As it's requesting: https://cdn.jsdelivr.net/npm/@apollographql/graphql[email protected]/build/static/css/index.css

See here for discussion: https://spectrum.chat/apollo/apollo-server/graphql-playground-does-not-work-on-localhost-4000~fd431b61-5051-42f8-8bf9-c12a3ac64e10

[ramtob]

For anyone else struggling with this, I learned that you can override the version of graphql-playground-react in your ApolloServer configuration like so.

const server = new ApolloServer({
  typeDefs,
  resolvers,
  playground: { version: '1.7.25' }
});

I'm not sure why 1.7.10 is no longer available in the CDN.

This workaround did eliminate the error. However I am now getting a clipped schema view:

Any Ideas? Thanks.

[abernix]

Some folks have continued to :+1: this even after we thought we resolved it, but I think I have an idea of why so I've gone ahead and back-published an @apollographql/[email protected].

I'd recommend anyone running into this — including those using the fullstack-tutorial — update their apollo-server to 2.6.0-alpha.6. If it still happens after that, please open a new issue so we can continue to track this. Unfortunately, it's hard to track whether emotions are still coming in on an issue that's already been "resolved". 😄

(And I'll probably lock this issue in a couple days to get an accurate read on this!)

Thanks for those who have continued to report problems! (And @ramtob, please open a new issue?)

[ramtob]

@abernix It would seem too awkward to open a new issue for a problem in a workaround for another problem..