DevTools/Features/ViewSource: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
m (clearing in prep for migration to new feature page format)
Line 1: Line 1:
{| class="fullwidth-table"
|-
| style="font-weight: bold; background: #DDD;" | Feature
| style="font-weight: bold; background: #DDD;" | Status
| style="font-weight: bold; background: #DDD;" | ETA
| style="font-weight: bold; background: #DDD;" | Owner
|-
<section begin="status" />
| [[DevTools/Features/ViewSource|View Source Reboot]]
| {{StatusHealthy|status=Feedback and discussion on dev-apps-firefox}}
| 2011-05-30
| Kevin Dangoor
<section end="status" />
|-
|}


== Summary ==
View Source is one of the most used features by web developers of all levels, especially those getting started. For many people who focus on server-side development, View Source is their go-to tool, because it lets them easily see what the server sent their way.
We have an opportunity to:
# help users of View Source find their way into more powerful tools
# support workflows where the developer has their code (be it HTML, CSS or JS) on their mind first
# implement some long-standing feature requests for View Source
As imagined here, a developer can use View Source in Firefox as they always have. Using other developer tools features, they will be able to easily navigate from the original source to:
* the current DOM structure in the HTML Tree
* the Highlighter, if they want to switch to working on visual problems
* CSS files, including the ability to edit via the Style Editor
It's possible to imagine further tool integration with features like the Debugger as those come online.
== Release Requirements ==
* this feature should be behind a pref so that it can be turned on when it's ready
* Fast, even on large files
* Performs well for single line files
* syntax highlighting
** For just HTML and XML? Also for CSS and JS?
* Navigate to other files referenced in the source file
* Can view selection source
* Can do a find in the source text
* View "Original" (as downloaded) and "Current" markup (after JS manipulation). The "Current" view would be provided using the [[DevTools/Features/HTMLTreeEditor|HTML Tree]]
* Be able to view HTML/JS/CSS
* Display the image if pointed to an image
* navigate with keyboard and mouse
* be able to switch from viewing CSS to editing CSS using the [[DevTools/Features/CSSEditor|Style Editor]]
== Nice to Have ==
These features are desirable but do not absolutely need to be there for the first iteration.
* line numbering
* Open in tab rather than window (open in sidebar option?) <sup>1</sup>
* Ability to open source links in separate tabs in the view source window (for example, if you want to open the CSS in a separate tab while keeping the HTML source open in the first tab)
* Optionally beautify HTML/JS/CSS
* works without accessing network (a much requested feature for View Source)
** what's this about? it already does, unless the page uses cache-control:no-store.
* quick navigation to other files loaded in that tab
* Be able to view JSON/XML (for use as a view elsewhere)
* HTML/CSS/JS error reporting <sup>2</sup>
Footnotes:
# Opening in a separate window should be the default, with the ability to drag into a tab. If the user does drag to a tab, we should remember that and open in tabs by default.
# Henri Sivonen's redo of view source using the HTML5 parser can produce HTML error reports
== Next Steps ==
* Feedback from dev-apps-firefox
* Choose developers
* Performance evaluation of HTML5 view source and Orion
** Extreme case 1: 10MB HTML file on a single line
** Extreme case 2: 100000 line HTML file
* Determine security and QA contacts
== Related Bugs & Dependencies ==
[http://mozilla.github.com/devtools/2011/status.html#viewsource View Source Status]
Other notable bugs:
* {{bug|246620}} add line numbers to view source
== Team ==
Join in on #devtools on irc.mozilla.org or on the dev-apps-firefox newsgroup/mailing list if you'd like to discuss this feature or get involved!
* Kevin Dangoor (irc: kdangoor), PM
== Designs ==
[http://mozilla.github.com/devtools/2011/viewsource.html Rough wireframe]
== Goals/Use Cases ==
* remain simple for new developers
* lose no features from the current implementation
* potentially provide the basis for source views that will appear elsewhere
== Non-Goals ==
TBD
== Other Documentation ==
TBD
__NOTOC__
[[Category:Feature]]
[[Category:Firefox]]
[[Category:DevTools]]

Revision as of 11:49, 16 July 2011

Retrieved from "https://wiki.mozilla.org/index.php?title=DevTools/Features/ViewSource&oldid=330288"