HTML Tree Editor

Summary

This feature is an improvement for the Page Inspector Tool, which allows to view and navigate the HTML. So far, the HTML panel provided was useful for navigation but not much else. Now, developers can use the HTML panel to manipulate the DOM and styling for their pages.

References

• Wiki page

Use Cases

• add or remove a class (adding the class attribute if there isn't one)
• change text
• add/edit other attributes
• copy innerHTML/outerHTML for an element
• remove nodes

Not available for the first round:

• • be able to add nodes
  • be able to move nodes
  • ability to get a CSS selector for an element
  • handle elements like script and link appropriately
  • style tag editing in-place
  • validation of attributes
  • autocompletion
  • focus on an element

Test Cases

• The test cases for this feature can be viewed [ here]. (tests are still under development, will be updated)

Important Bugs

• Implementation bugs

2 Total; 0 Open (0%); 2 Resolved (100%); 0 Verified (0%);

Other Bugs

3 Total; 0 Open (0%); 3 Resolved (100%); 0 Verified (0%);

bugzilla query

Not Tested

• TBD

Sign off Criteria

• All the test cases were executed.
• All the major bugs have been fixed.