DevTools/Features/CSSDoctor
Status
Style Doctor | |
Stage | Development |
Status | ` |
Release target | ` |
Health | OK |
Status note | need a test page to try out the rules+results |
{{#set:Feature name=Style Doctor
|Feature stage=Development |Feature status=` |Feature version=` |Feature health=OK |Feature status note=need a test page to try out the rules+results }}
Team
Product manager | Kevin Dangoor |
Directly Responsible Individual | Kevin Dangoor |
Lead engineer | Joe Walker |
Security lead | ` |
Privacy lead | ` |
Localization lead | ` |
Accessibility lead | ` |
QA lead | ` |
UX lead | ` |
Product marketing lead | ` |
Operations lead | ` |
Additional members | ` |
{{#set:Feature product manager=Kevin Dangoor
|Feature feature manager=Kevin Dangoor |Feature lead engineer=Joe Walker |Feature security lead=` |Feature privacy lead=` |Feature localization lead=` |Feature accessibility lead=` |Feature qa lead=` |Feature ux lead=` |Feature product marketing lead=` |Feature operations lead=` |Feature additional members=` }}
Open issues/risks
- can this work with multiple selected nodes?
Stage 1: Definition
1. Feature overview
The goal of the Style Doctor is to answer the question "why doesn't this look the way I expected it to?" as quickly as possible.
CSS rule precedence is complex and little understood and the Style Doctor will help users get their layouts working 'and' help them learn precedence at the same time.
2. Users & use cases
Some relevant discussion in "CSS developer tools" thread on dev-apps-firefox
3. Dependencies
`
4. Requirements
- integrates with nodes selected via the Highlighter, GCLI or other means
- can provide answers for a "substantial" set of node/rule combos. Problems of the sort:
- selector didn't match or was overridden
- error in CSS (some errors require the context of a node)
- layout problems (Shaver's list: too indented, not indented enough, too narrow, too wide, not aligned with something else, etc.)
Non-goals
`
Stage 2: Design
5. Functional specification
`
6. User experience design
`
Stage 3: Planning
7. Implementation plan
- test page with examples that test each rule
- need the same thing working as a traditional addon
- enough rules to produce interesting results (perhaps ~15)
- click around and get a sensible answer for many cases
- those selectors don't match
- everything is actually fine, the rule did apply
8. Reviews
Security review
`
Privacy review
`
Localization review
`
Accessibility
`
Quality Assurance review
`
Operations review
`
Stage 4: Development
9. Implementation
- Source at Github. At some stage we should move this back into Moz/HG.
- Demo video, and pages used in the video: demo and test
- Documentation
- Status
Stage 5: Release
10. Landing criteria
` {{#set:Feature open issues and risks=* can this work with multiple selected nodes? |Feature overview=The goal of the Style Doctor is to answer the question "why doesn't this look the way I expected it to?" as quickly as possible.
CSS rule precedence is complex and little understood and the Style Doctor will help users get their layouts working 'and' help them learn precedence at the same time. |Feature users and use cases=Some relevant discussion in "CSS developer tools" thread on dev-apps-firefox |Feature dependencies=` |Feature requirements=* integrates with nodes selected via the Highlighter, GCLI or other means
- can provide answers for a "substantial" set of node/rule combos. Problems of the sort:
- selector didn't match or was overridden
- error in CSS (some errors require the context of a node)
- layout problems (Shaver's list: too indented, not indented enough, too narrow, too wide, not aligned with something else, etc.)
|Feature non-goals=` |Feature functional spec=` |Feature ux design=` |Feature implementation plan=* test page with examples that test each rule
- need the same thing working as a traditional addon
- enough rules to produce interesting results (perhaps ~15)
- click around and get a sensible answer for many cases
- those selectors don't match
- everything is actually fine, the rule did apply
|Feature security review=` |Feature privacy review=` |Feature localization review=` |Feature accessibility review=` |Feature qa review=` |Feature operations review=` |Feature implementation notes=* Source at Github. At some stage we should move this back into Moz/HG.
- Demo video, and pages used in the video: demo and test
- Documentation
- Status
|Feature landing criteria=` }}
Feature details
Priority | P3 |
Rank | 6 |
Theme / Goal | ` |
Roadmap | Developer Tools |
Secondary roadmap | ` |
Feature list | Desktop |
Project | ` |
Engineering team | DevTools |
{{#set:Feature priority=P3
|Feature rank=6 |Feature theme=` |Feature roadmap=Developer Tools |Feature secondary roadmap=` |Feature list=Desktop |Feature project=` |Feature engineering team=DevTools }}
Team status notes
status | notes | |
Products | ` | ` |
Engineering | ` | ` |
Security | ` | ` |
Privacy | ` | ` |
Localization | ` | ` |
Accessibility | ` | ` |
Quality assurance | ` | ` |
User experience | ` | ` |
Product marketing | ` | ` |
Operations | ` | ` |
{{#set:Feature products status=`
|Feature products notes=` |Feature engineering status=` |Feature engineering notes=` |Feature security status=` |Feature security health=` |Feature security notes=` |Feature privacy status=` |Feature privacy notes=` |Feature localization status=` |Feature localization notes=` |Feature accessibility status=` |Feature accessibility notes=` |Feature qa status=` |Feature qa notes=` |Feature ux status=` |Feature ux notes=` |Feature product marketing status=` |Feature product marketing notes=` |Feature operations status=` |Feature operations notes=` }}