graphql-playground
graphql-playground copied to clipboard
Playground resets between sessions if you set tabs on the server
This issue pertains to the following package(s):
- [ ] GraphQL Playground - Electron App
- [x] GraphQL Playground HTML
- [x] GraphQL Playground
- [x] GraphQL Playground Express Middleware
- [ ] GraphQL Playground Hapi Middleware
- [ ] GraphQL Playground Koa Middleware
- [ ] GraphQL Playground Lambda Middleware
What version of graphql-playground(-electron/-middleware) are you experiencing the issue(s) on?
[email protected] [email protected]
Example
If I set tabs like this:
import playground from 'graphql-playground-middleware-express';
app.get(
'/playground',
auth.requireAuthentication(),
playground({
endpoint: GRAPHQL_PATH,
tabs: [
{
endpoint: GRAPHQL_PATH,
headers: { 'X-Custom-Header': 'value' }
}
]
})
);
Playground properly uses those tab settings. If I go through a session, change some settings, run some queries across multiple tabs and then refresh the page all the tabs and playground settings are reverted to the original view with the tabs set on the server and the default settings.
If I don't set any tabs from the server
import playground from 'graphql-playground-middleware-express';
app.get(
'/playground',
playground({
endpoint: '/graphql'
})
);
then everything works fine. The state is persisted across sessions.
I'm not sure if this is a bug or intended. But it would be ideal to be able to set default tabs with say a welcome message and some information from the server but allow users to update those from the client and have them persist across sessions.
Any news on this bug?
This does seem like intentional behaviour - it's documented in the README, although I'd say it's highly undesirable, as you're left with the choice of giving the user no starting template for queries, or having them lose their queries on every page refresh - neither of which is really what I want. It should be possible to set "default" tabs for first time users, which are ignored if the user has any tabs persisted in their browser.