profile
viewpoint

Ask questionsWebCompat Diagnosis Sidebar

Current design: image

First round of testing needs

  • Focus on this sidebar first, and adapt to the smaller UI of the toolbar tool later
  • Reconsider the "list of issues" UI. Maybe a caniuse-style support table or friendly suggestions (e.g. use feature query to support browser xyz)
  • Consider a browsing UI with search suggestions
  • Encourage cross-browser testing
  • Try to educate on how to use unsupported features in a safe way. How would the user go to MDN from here, to learn more about certain properties? would this show up on hover?
  • Use version names (e.g. stable, beta, canary) instead of numbers
  • Grouping for similar (or duplicate) warnings in the subtree [1]. (Should there be a way to expand the group? What would Learn More do?)
  • Config screen is postponed to next round

Initial description

  • Make it easier to discover and configure Open in Browser feature
  • Make the browser version links more obvious
  • Use MDN in the wording/visuals
  • Messaging to show that a perfect score does not mean a compatible website (e.g. Lighthouse includes disclaimers like, "Only a subset of accessibility issues can be automatically detected so manual testing is also encouraged.")
  • Integration with Unified Layout

image

firefox-devtools/ux

Answer questions violasong

An early version of this is now available in Nightly by flipping devtools.inspector.compatibility.enabled!

Shows info for current element as well as all elements.

Will work on more testing and polish. Also, need to try coloring the icons.

image

useful!

Related questions

No questions were found.
Github User Rank List