DevTools/Features/EasyAttributeEditing
Status
| Easy Attribute Editing | |
| Stage | On hold |
| Status | ` |
| Release target | ` |
| Health | OK |
| Status note | Putting on hold so that we can focus on making the HTML tree do what people need. |
Team
| Product manager | Kevin Dangoor |
| Directly Responsible Individual | Kevin Dangoor |
| Lead engineer | ` |
| Security lead | ` |
| Privacy lead | ` |
| Localization lead | ` |
| Accessibility lead | ` |
| QA lead | ` |
| UX lead | ` |
| Product marketing lead | ` |
| Operations lead | ` |
| Additional members | ` |
Open issues/risks
`
Stage 1: Definition
1. Feature overview
When working on a design (or JavaScript code, in some cases), there are a handful of common changes that people will want to make to the attributes of an DOM node.
2. Users & use cases
See the effect of a class
When tracking down styling issues, especially on elements with multiple classes applied to them, it can be useful to visually see the effect that a given class is having on an element. A convenient mechanism for toggling a class on an element is a good way to accomplish this.
Set an ID on an element
JavaScript developers often have collections of functions built up that are designed to take elements or element IDs. By being able to quickly set an ID on an element, these developers will have a handle they can pass into their functions.
3. Dependencies
`
4. Requirements
- Easily toggle classes or add classes to an element
- Add an ID to the element
Optional:
- Be able to change any attributes on the element
- Be able to change the text within the element
- Be able to change the element's tag
Non-goals
This feature is not concerned with making structural changes to the document.
Stage 2: Design
5. Functional specification
`
6. User experience design
Some discussion of putting this functionality in the Infobar occurred on dev-apps-firefox. DevTools/Features/RichInfobar was created along those lines, but broken up and replaced by this page and DevTools/Features/PseudoClassLock.
Stage 3: Planning
7. Implementation plan
`
8. Reviews
Security review
`
Privacy review
`
Localization review
`
Accessibility
`
Quality Assurance review
`
Operations review
`
Stage 4: Development
9. Implementation
`
Stage 5: Release
10. Landing criteria
`
Feature details
| Priority | P2 |
| Rank | 1 |
| Theme / Goal | ` |
| Roadmap | Developer Tools |
| Secondary roadmap | ` |
| Feature list | Desktop |
| Project | ` |
| Engineering team | DevTools |
Team status notes
| status | notes | |
| Products | ` | ` |
| Engineering | ` | ` |
| Security | ` | ` |
| Privacy | ` | ` |
| Localization | ` | ` |
| Accessibility | ` | ` |
| Quality assurance | ` | ` |
| User experience | ` | ` |
| Product marketing | ` | ` |
| Operations | ` | ` |
