Copy outerHTML of the currently selected node of the inspector.
Works for ELEMENT, DOCUMENT_TYPE and COMMENT node types.
- bound "copy" event in markup-view to copy outerHTML
- added doctypeString property to NodeFront in actors/inspector.js
- markup-view.js is also using this property now
- added mochitest with dedicated html
Adds a global .eslintrc file for all source files in /browser/devtools.
This file defines a set of global variables that are commonly used in
/browser/devtools code.
The files that import modules with Cu.import will need to define their
own globals as /* globals ... */ comments.
This file also defines the configuration for all the rules we want to
use.
This also adds a set of .eslintrc files, one per test directory in
/browser/devtools. Each of these files extend from one of 2 parent config
files: .eslintrc.xpcshell or .eslintrc.mochitest.
The parent config define the set of globals these types of tests have
access to (test runner functions, assertion functions, etc.).
Finally, this also adds .eslintrc files in /toolkit/devtools for code and
tests, which just extend from their counterparts in /browser/devtools.
The node-attribute-parser now marks uris to css and js files as cssresource and jsresource.
Thanks to this, the inspector can open the corresponding files in the style-editor and
debugger rather than just opening a new tab with the source.
This makes use of 2 new toolbox methods: viewSourceInStyleEditor and viewSourceInDebugger.
This part adds contextual menu items that become enabled when
the user right clicks on an attribute that has a link.
Depending on the nature of the link, a new tab will be opened or a node
selected.
The user can also choose to copy the link in the clipboard.
This first part adds a parser for node attributes which, given some node
information and an attribute name, generates a small AST-like array of
objects that tells which parts of the attribute (if any) are links, and
what they link to.
Using this, the markup-view generates the right HTML structure to display
these parts as links.
This part 1 doesn't yet allow users to follow these links.
This option helps avoiding blank inspector situations when trying to use the right-click ctx
menu in the browser to inspect an element *while* the page is reloading.
This prevents the WalkerActor from failing at handling various requests when
those requests are about DeaedNodes. Indeed, the async nature of the devtools
protocol means that the client could be asking for information about a node that
doesn't exist anymore because it was part of a page that was navigated away from.
The WalkerActor should know how to deal with such cases, so the patch adds a
number of early returns and a new test for them.
This helps avoiding the inspector-panel from going blank in some edge cases.
This fixes 2 problems related to the split console not opening when it should.
1 - After the inspector selection mode (pick mode) was canceled with ESC, pressing ESC once
again did not open the split console, because the toolbox did not have the focus.
2 - The markup-view tooltip (used to preview images) was eating the first ESC keypress when
the markup-view was focused, even though the tooltip was hidden. This was forcing users to
press ESC twice to open the split console.
Whenever something changed on the selected element (pseudo, attribute), the
breadcrumbs widget used to loop over all breadcrumbs buttons and re-create the
markup for each.
Now, we cache a string version of the text displayed in a button and compare
the new value to that in the loop, to skip DOM updates.
Additionally, the breadcrumbs widget used to update itself after all markup mutations
in the DOM tree displayed in the inspector. The update method now looks at the mutations
array and early return if none of them actually impact the displayed breadcrumbs.
helper_outerhtml_test_runner.js was accessing DOM nodes directly in content (via
CPOWs) to check their outerHTML.
This change adds outerHTML, innerHTML and textContent to the common
devtools:test:getDomElementInfo frame-script message listener so that the test
can get it there instead.
The common assertAttributes helper test function used to access DOM nodes in the
content page directly (CPOW). It now becomes an async function that goes through
a frame-script to retrieve the list of attributes for a node, given its selector.
All tests were passing with this change but one: browser_markupview_tag_edit_06.js
This one was checking camelcase attribute names while the actual names on the
node were lowercased by the browser. The way we were asserting attributes before
didn't care about the case. Now it does.
This change updates the browser_markupview_tag_edit_03.js test by making use of the
getDomElementInfo message listener to retrieve information about the tested nodes
without having to go through CPOWs.
This change loads the devtools common frame-script-utils.js frame-script in the browser message
manager when a new test tab is opened by a test, and it adds a new getDomElementInfo message
listener useful for many tests to retrieve data about a node without having to go through a
CPOW.