summaryrefslogtreecommitdiffstats
path: root/browser/components/extensions/test/browser/browser_ext_devtools_panels_elements.js
blob: 37aa44cfc11165eb189f93a21d4f19fe5fc3de0a (plain)
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
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
/* -*- Mode: indent-tabs-mode: nil; js-indent-level: 2 -*- */
/* vim: set sts=2 sw=2 et tw=80: */
"use strict";

loadTestSubscript("head_devtools.js");

add_task(async function test_devtools_panels_elements_onSelectionChanged() {
  let tab = await BrowserTestUtils.openNewForegroundTab(
    gBrowser,
    "http://mochi.test:8888/"
  );

  function devtools_page() {
    browser.devtools.panels.elements.onSelectionChanged.addListener(
      async () => {
        const [evalResult, exceptionInfo] =
          await browser.devtools.inspectedWindow.eval("$0 && $0.tagName");

        if (exceptionInfo) {
          browser.test.fail(
            "Unexpected exceptionInfo on inspectedWindow.eval: " +
              JSON.stringify(exceptionInfo)
          );
        }

        browser.test.sendMessage("devtools_eval_result", evalResult);
      }
    );

    browser.test.onMessage.addListener(msg => {
      switch (msg) {
        case "inspectedWindow_reload": {
          // Force a reload to test that the expected onSelectionChanged events are sent
          // while the page is navigating and once it has been fully reloaded.
          browser.devtools.inspectedWindow.eval("window.location.reload();");
          break;
        }

        default: {
          browser.test.fail(`Received unexpected test.onMesssage: ${msg}`);
        }
      }
    });

    browser.test.sendMessage("devtools_page_loaded");
  }

  let extension = ExtensionTestUtils.loadExtension({
    manifest: {
      devtools_page: "devtools_page.html",
    },
    files: {
      "devtools_page.html": `<!DOCTYPE html>
      <html>
       <head>
         <meta charset="utf-8">
       </head>
       <body>
         <script src="devtools_page.js"></script>
       </body>
      </html>`,
      "devtools_page.js": devtools_page,
    },
  });

  await extension.startup();

  const toolbox = await openToolboxForTab(tab);

  await extension.awaitMessage("devtools_page_loaded");

  await toolbox.selectTool("inspector");

  const inspector = toolbox.getPanel("inspector");

  info(
    "Waiting for the first onSelectionChanged event to be fired once the inspector is open"
  );

  const evalResult = await extension.awaitMessage("devtools_eval_result");
  is(
    evalResult,
    "BODY",
    "Got the expected onSelectionChanged once the inspector is selected"
  );

  // Reload the inspected tab and wait for the inspector markup view to have been
  // fully reloaded.
  const onceMarkupReloaded = inspector.once("markuploaded");
  extension.sendMessage("inspectedWindow_reload");
  await onceMarkupReloaded;

  info(
    "Waiting for the two onSelectionChanged events fired before and after the navigation"
  );

  // Expect the eval result to be undefined on the first onSelectionChanged event
  // (fired when the page is navigating away, and so the current selection is undefined).
  const evalResultNavigating = await extension.awaitMessage(
    "devtools_eval_result"
  );
  is(
    evalResultNavigating,
    undefined,
    "Got the expected onSelectionChanged once the tab is navigating"
  );

  // Expect the eval result to be related to the body element on the second onSelectionChanged
  // event (fired when the page have been navigated to the new page).
  const evalResultOnceMarkupReloaded = await extension.awaitMessage(
    "devtools_eval_result"
  );
  is(
    evalResultOnceMarkupReloaded,
    "BODY",
    "Got the expected onSelectionChanged once the tab has been completely reloaded"
  );

  await closeToolboxForTab(tab);

  await extension.unload();

  BrowserTestUtils.removeTab(tab);
});