Open dinonuggies1 opened 1 year ago
I would also be happy if the current version is revised and improved again. In the current state, it is simply only aggravated and the simple / fast usability is no longer given.
see too:
@dinonuggies1 thank you for this! are you able to do a similar audit of graphiql@2? unfortunately we aren't able to backport these fixes to 1.x because it was a substantial rewrite, and we haven't had a 1.x release in a few years. most of this still applies where the third party explorer is concerned. I have a PR open (#3374) to adopt the explorer into our repo so we can make many of these improvements!
@acao I believe the GitHub Accessibility team uses https://www.deque.com/axe/devtools/chrome-browser-extension/ to identify accessibility issues.
So, we will be rebuilding the explorer components and plugin in the coming months. We did not get permission to inherit the project from the current IP owner, and the original authors are suggesting a rewrite anyways.
A GraphQL Foundation grant came through for someone to work on this explorer rebuild, and we will know if they still can work on it soon.
Until then, I hope to take care of these items this month myself:
If you would like to help with the explorer rewrite, join us on the discord in the readme!
Are there any news on this? At the moment the current "explorer" is basically useless to build up queries. What is the alternative I'm supposed to use at the moment?
Hello,
graphiql
maintainers!GitHub's API team provides an integrated client within GitHub's public web documentation for GraphQL. We're big fans of the tool, and use it as a means for integrators to become more familiar with our GraphQL schema. We've recently upgraded to the latest version of the
graphiql
package (3.0.5
as of September 18, 2023), and thereby many built in features of the client. This client is one of the most utilized aspects of the GraphQL doc set, so it's highly visible for visitors with GraphQL in mind.Recently, we've placed a stronger focus on making our web experience more accessible as we strive to become the home for all developers. With that in mind, we believe there are a few improvements that would greatly enhance the experience of developers/users with varying disabilities. π
Here are a few accessibility concerns identified by an internal audit here at GitHub:
In other words, when a user tabs through the explorer pane, each schema component/form element should be focusable
In this instance, the user tabs to the "History", hits enter, and instead of the next tab sequence stepping into the History view, the user is directed to the next button (The
Explorer
button).Providing the right
aria-label
helps people who utilize screen readers.role
attribute for the GraphiQL Explorer:** screen reader concern
** screen reader concern
** Update - September 27th, 2023
4.5:1
for the default light mode or dark mode (Although, Dark mode is closer ππ½). I've taken a dive into each element of the query editor in hopes that it'll help shed light on the selectors that require adjustments. ππ½With Default (Light) Theme
With Dark Mode Theme
As you can see, most of our accessibility findings stem from the GraphQL Explorer feature, or more specifically, the
@graphiql/explorer-plugin
package. It could be that these concerns have been addressed in more recent versions of the explorer, however, we encountered some issues upgrading to the latestgraphiql
package with the explorer package included. We did have success upgrading to version0.1.4
of the explorer plugin along with2.0.7
of thegraphiql
package, but noticed that the same issues remained. If it's confirmed that the above has been addressed in later versions of the explorer plugin, we'd be happy to invest more time into the upgrade, but for the moment, we've decided to omit the explorer feature from the client given the accessibility concerns above.Lastly, thanks for all the hard work you've put into making this a great tool! π