web-platform-tests / web-platform-tests/interop
Improve UX of interop diagram
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 524
- Forks
- 35
- Avg merge
- 1d 4h
- Merged PRs (30d)
- 10
Description
The diagram at the Interop Dashboard is currently a little hard to use. To improve its UX I suggest to
- make it bigger (or add an option to do so like a zoom feature), as it is sometimes hard to see the chart lines.
- allow to toggle individual chart lines on and off to make it easier (or even just possible) to distinguish the individual lines as they often overlap.
- Show the date of the test run and/or the exact version number of the browser in the tooltip to make it easier to distinguish individual builds.
- link to the related test run ‒ and the individual branch of tests if a specific feature is selected ‒ from within the tooltip, if possible, allowing to compare specific test runs.
- add (optional) markers or add different types of lines in addition to the colors to improve the graph's accessibility.
- show a vertical line when hovering the graph and show the different progresses of the browsers at that specific date, making it easy to see the status at a specific point in time.
- add an option to display both chart lines for the stable and experimental implementations to allow to compare them.
Please let me know if I should file individual issues for each of the features!
Sebastian
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the Interop Dashboard and inspect how its chart and tooltips are currently presented. First separate the proposed UX changes into a focused scope, then identify the relevant chart entry points and agree on which behavior to implement. Done means the selected interaction is usable, distinguishable, and validated in the dashboard.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- accessibility, data-visualization, frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100