DevTools/Features/HTMLTreeEditor

Please use "Edit with form" above to edit this page.

Status

HTML Tree Editor
Stage	Design
Status	`
Release target	`
Health	OK
Status note	Rebooting

{{#set:Feature name=HTML Tree Editor

|Feature stage=Design |Feature status=` |Feature version=` |Feature health=OK |Feature status note=Rebooting }}

Team

Product manager	Kevin Dangoor
Directly Responsible Individual	Kevin Dangoor
Lead engineer	Cedric Vivier
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=Cedric Vivier |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

`

Stage 1: Definition

1. Feature overview

Firefox 10 added the Page Inspector feature with an HTML panel to view and navigate the HTML. The HTML panel provided is useful for navigation but not much else.

In competing tools, developers use the HTML panel to manipulate the DOM, especially when working on styling.

2. Users & use cases

Web developers.

3. Dependencies

`

4. Requirements

Be able to:

1. add or remove a class (adding the class attribute if there isn't one)
2. bug 705323 change text
3. add/edit other attributes
4. bug 705847 copy innerHTML/outerHTML for an element

Optional for the first round:

1. be able to add/remote nodes
2. be able to move nodes
3. bug 703383 ability to get a CSS selector for an element

Non-goals

`

Stage 2: Design

5. Functional specification

`

6. User experience design

`

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

` {{#set:Feature open issues and risks=` |Feature overview=Firefox 10 added the Page Inspector feature with an HTML panel to view and navigate the HTML. The HTML panel provided is useful for navigation but not much else.

In competing tools, developers use the HTML panel to manipulate the DOM, especially when working on styling. |Feature users and use cases=Web developers. |Feature dependencies=` |Feature requirements=Be able to:

1. add or remove a class (adding the class attribute if there isn't one)
2. bug 705323 change text
3. add/edit other attributes
4. bug 705847 copy innerHTML/outerHTML for an element

Optional for the first round:

1. be able to add/remote nodes
2. be able to move nodes
3. bug 703383 ability to get a CSS selector for an element

|Feature non-goals=` |Feature functional spec=` |Feature ux design=` |Feature implementation plan=` |Feature security review=` |Feature privacy review=` |Feature localization review=` |Feature accessibility review=` |Feature qa review=` |Feature operations review=` |Feature implementation notes=` |Feature landing criteria=` }}

Feature details

Priority	P1
Rank	4
Theme / Goal	`
Roadmap	Developer Tools
Secondary roadmap	`
Feature list	Desktop
Project	`
Engineering team	DevTools

{{#set:Feature priority=P1

|Feature rank=4 |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	sec-review-needed	`
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=sec-review-needed |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=` }}

Designs

• Initial UX prototype
• Screencast walk-thru of prototype
• Updated screencast showing additional UX around delete-attribute