graphql-playground
graphql-playground copied to clipboard
graphql
Feature Request: FilePicker on Upload scalar
This issue pertains to the following package(s):
- [X] GraphQL Playground - Electron App
- [X] GraphQL Playground HTML
- [X] GraphQL Playground
Feature Request
Now, where apollo-upload-server seems to be established as the de-facto standard when it comes to handling file uploads, it would be awesome to bring up a file picker dialog on Upload scalars. Something like:
With something like that in place, it wouldn't be necessary to build a client application for testing file uploads anymore.
Would really love to see this!
In the mean time, for those not aware, you can test mutations or queries with Upload scalars without a full blown application using https://insomnia.rest. You have manually construct a GraphQL multipart request for your mutation though, which is pretty fiddly:
Another way is to use cURL.
While it is a nice UX to have the file picker appear for Upload scalar arguments, perhaps it's desirable to allow any argument to be a window.File (or window.FileList?) instance for purposes of testing bad input.
Maybe there could be a panel tab next to "Query variables" and "HTTP headers" called "Uploads" with an appendable list of file inputs. Each file input has a drag and drop placeholder representing the value that can be placed in one or multiple locations in the query/mutation.
@jaydenseric So if we provide some design would you be up for implementation? :)
Heads-up that Altair has supported file uploads for a while now, so if you are desperate for a nice GUI give it a go. It might be a source of inspiration for the implementation here…
@jaydenseric, thanks for mentioning Altair. It works quite nice with the option to "add query" and "add fragments" directly from the docs.
I'm only missing the Tracing view from graphql-playground.
It's painful 😩 to debug the File upload.
Follow 4 steps to test out Single/Multiple File Upload in GraphQL
1️⃣ Construct the mutation
2️⃣ Drop the file
3️⃣ Assign the file-variable value
4️⃣ Hit the play button
https://twitter.com/shreya_gr/status/1278669430579515403
2018 and we are in 2022, this feature is important for test applications, why take a long time ?
