Hides GraphQL Playground autocomplete suggestions after a short delay
Problem Solved: This user script addresses a common and frustrating UI bug in GraphQL Playground (and potentially some other CodeMirror-based editors) where the autocomplete suggestions or information/help boxes can get stuck on the screen, obscuring your query and making the interface difficult to use.
How it Works: The script uses a MutationObserver to actively monitor the DOM for the appearance of GraphQL Playground's autocomplete and hint boxes. Once detected, it starts a short timer (default: 1.5 seconds). After this delay, the script automatically hides these boxes, ensuring they appear briefly to provide assistance but then disappear to clear your workspace. This allows you to see the suggestions and then have a clean view of your query.
Features:
Configuration (Optional):
If you wish to adjust the display duration, you can easily modify the const delay variable within the script's code. Open the script in your Tampermonkey editor and change the value (in milliseconds). For example, 1000 for 1 second, 2000 for 2 seconds.
Troubleshooting:
delay variable.CodeMirror class names (.CodeMirror-hints, .CodeMirror-hints-wrapper, .CodeMirror-hint-information). If you're using a heavily customized GraphQL Playground, you might need to inspect the elements in your browser's developer tools and adjust the class names in the script's querySelectorAll line.Contribution/Feedback: If you encounter any issues or have suggestions, please feel free to leave a comment on this script's page.