File: browser_console_variables_view_highlighter.js

package info (click to toggle)
iceweasel 31.6.0esr-1
  • links: PTS, VCS
  • area: main
  • in suites: jessie-kfreebsd
  • size: 1,368,576 kB
  • sloc: cpp: 3,692,968; ansic: 1,797,194; python: 193,401; java: 180,622; asm: 133,557; xml: 89,288; sh: 71,748; perl: 22,087; makefile: 21,687; objc: 4,014; yacc: 1,995; pascal: 1,292; lex: 950; exp: 449; lisp: 228; awk: 211; php: 113; sed: 43; csh: 31; ada: 16; ruby: 3
file content (97 lines) | stat: -rw-r--r-- 2,961 bytes parent folder | download | duplicates (5)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
/*
 * Any copyright is dedicated to the Public Domain.
 * http://creativecommons.org/publicdomain/zero/1.0/
 */

// Check that variables view is linked to the inspector for highlighting and
// selecting DOM nodes

const TEST_URI = "http://example.com/browser/browser/devtools/webconsole/test/test-bug-952277-highlight-nodes-in-vview.html";

let gWebConsole, gJSTerm, gVariablesView, gToolbox;

function test()
{
  addTab(TEST_URI);
  browser.addEventListener("load", function onLoad() {
    browser.removeEventListener("load", onLoad, true);
    openConsole(null, consoleOpened);
  }, true);
}

function consoleOpened(hud)
{
  gWebConsole = hud;
  gJSTerm = hud.jsterm;
  gToolbox = gDevTools.getToolbox(hud.target);
  gJSTerm.execute("document.querySelectorAll('p')", onQSAexecuted);
}

function onQSAexecuted(msg)
{
  ok(msg, "output message found");
  let anchor = msg.querySelector("a");
  ok(anchor, "object link found");

  gJSTerm.once("variablesview-fetched", onNodeListVviewFetched);

  executeSoon(() =>
    EventUtils.synthesizeMouse(anchor, 2, 2, {}, gWebConsole.iframeWindow)
  );
}

function onNodeListVviewFetched(aEvent, aVar)
{
  gVariablesView = aVar._variablesView;
  ok(gVariablesView, "variables view object");

  // Transform the vview into an array we can filter properties from
  let props = [[id, prop] for([id, prop] of aVar)];
  // These properties are the DOM nodes ones
  props = props.filter(v => v[0].match(/[0-9]+/));

  function hoverOverDomNodeVariableAndAssertHighlighter(index) {
    if (props[index]) {
      let prop = props[index][1];
      let valueEl = prop._valueLabel;

      gToolbox.once("node-highlight", () => {
        ok(true, "The highlighter was shown on hover of the DOMNode");
        gToolbox.highlighterUtils.unhighlight().then(() => {
          clickOnDomNodeVariableAndAssertInspectorSelected(index);
        });
      });

      // Rather than trying to emulate a mouseenter event, let's call the
      // variable's highlightDomNode and see if it has the desired effect
      prop.highlightDomNode();
    } else {
      finishUp();
    }
  }

  function clickOnDomNodeVariableAndAssertInspectorSelected(index) {
    let prop = props[index][1];

    // Make sure the inspector is initialized so we can listen to its events
    gToolbox.initInspector().then(() => {
      // Rather than trying to click on the value here, let's just call the
      // variable's openNodeInInspector function and see if it has the
      // desired effect
      prop.openNodeInInspector().then(() => {
        is(gToolbox.currentToolId, "inspector", "The toolbox switched over the inspector on DOMNode click");
        gToolbox.selectTool("webconsole").then(() => {
          hoverOverDomNodeVariableAndAssertHighlighter(index + 1);
        });
      });
    });
  }

  hoverOverDomNodeVariableAndAssertHighlighter(0);
}

function finishUp() {
  gWebConsole = gJSTerm = gVariablesView = gToolbox = null;

  finishTest();
}