microsoft / microsoft/vscode-css-languageservice
Add Baseline status to CSS hovercards
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 384
- Forks
- 217
- Avg merge
- 3d 16h
- Merged PRs (30d)
- 14
Description
Baseline is an initiative by the W3C WebDX Community Group that aims to improve how we communicate the level of browser compatibility of web platform features.
In VS Code today, CSS properties have a hovercard that shows supported browser versions:
Just by looking at this information, it's not immediately clear if this feature is ready to use in production. This could be improved by adopting a similar treatment as the one used by MDN:
Here, the Baseline "widely available" logo and text are used to more clearly communicate that the feature has been available across the core browser set for a substantial amount of time (2.5 years).
To see how this might look, I prototyped a VS Code extension that displays a hovercard with a similar treatment.
After a quick chat with @aeschli, it sounds like this could be a useful addition. Filing this issue to continue the discussion.
Some open questions to consider:
- A feature's Baseline status can change over time as browsers add support. Is there already a process to keep BCD info reasonably up to date?
- Computing a feature's Baseline status may not be as straightforward as looking at the browser versions alone. We'd also need to consider mobile support and the amount of time that a feature has been available across the core browser set. Does this justify adding compute-baseline as a dependency to help with the status assessment?
- Right now it appears that hovercards are only supported for CSS properties. Should we also look to expand support to other CSS features like property values, functions, etc?
- As far as I can tell, HTML hovercards don't currently include any browser version data. Should we also look to expand support to HTML features?
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 with the linked baseline-vscode prototype and the existing CSS hovercard behavior described in the issue. Resolve the open questions about Baseline computation, data freshness, dependency use, and whether CSS and HTML coverage should expand. Done means an agreed scope and implementation plan for presenting current Baseline status.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, typescript
- Domain
- developer-experience, frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100