summaryrefslogtreecommitdiffstats
path: root/toolkit/components/extensions/test/mochitest/test_ext_contentscript_canvas.html
blob: 8659d8c4095060b717dd3dd292c6ea0f498369e0 (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
125
126
127
128
129
130
131
132
133
134
<!doctype html>
<html>
<head>
  <title>Test content script access to canvas drawWindow()</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <script src="/tests/SimpleTest/ExtensionTestUtils.js"></script>
  <script src="head.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>
<script>
"use strict";

add_task(async function test_drawWindow() {
  const permissions = [
    "<all_urls>",
  ];

  const content_scripts = [{
    matches: ["https://example.org/*"],
    js: ["content_script.js"],
  }];

  const files = {
    "content_script.js": () => {
      const canvas = document.createElement("canvas");
      const ctx = canvas.getContext("2d");
      try {
        ctx.drawWindow(window, 0, 0, 10, 10, "red");
        const {data} = ctx.getImageData(0, 0, 10, 10);
        browser.test.sendMessage("success", data.slice(0, 3).join());
      } catch (e) {
        browser.test.sendMessage("error", e.message);
      }
    },
  };

  const first = ExtensionTestUtils.loadExtension({
    manifest: {
      permissions,
      content_scripts
    },
    files
  });
  const second = ExtensionTestUtils.loadExtension({
    manifest: {
      content_scripts
    },
    files
  });

  consoleMonitor.start([{ message: /Use of drawWindow [\w\s]+ is deprecated. Use tabs.captureTab/ }]);

  await first.startup();
  await second.startup();

  const win = window.open("https://example.org/tests/toolkit/components/extensions/test/mochitest/file_to_drawWindow.html");

  const colour = await first.awaitMessage("success");
  is(colour, "255,255,153", "drawWindow() call was successful: #ff9 == rgb(255,255,153)");

  const error = await second.awaitMessage("error");
  is(error, "ctx.drawWindow is not a function", "drawWindow() method not awailable without permission");

  win.close();
  await first.unload();
  await second.unload();
  await consoleMonitor.finished();
});

add_task(async function test_tainted_canvas() {
  const permissions = [
    "<all_urls>",
  ];

  const content_scripts = [{
    matches: ["https://example.org/*"],
    js: ["content_script.js"],
  }];

  const files = {
    "content_script.js": () => {
      const canvas = document.createElement("canvas");
      const ctx = canvas.getContext("2d");
      const img = new Image();

      img.onload = function() {
        ctx.drawImage(img, 0, 0);
        try {
          const png = canvas.toDataURL();
          const {data} = ctx.getImageData(0, 0, 10, 10);
          browser.test.sendMessage("success", {png, colour: data.slice(0, 4).join()});
        } catch (e) {
          browser.test.log(`Exception: ${e.message}`);
          browser.test.sendMessage("error", e.message);
        }
      };

      // Cross-origin image from example.com.
      img.src = "https://example.com/tests/toolkit/components/extensions/test/mochitest/file_image_good.png";
    },
  };

  const first = ExtensionTestUtils.loadExtension({
    manifest: {
      permissions,
      content_scripts
    },
    files
  });
  const second = ExtensionTestUtils.loadExtension({
    manifest: {
      content_scripts
    },
    files
  });

  await first.startup();
  await second.startup();

  const win = window.open("https://example.org/tests/toolkit/components/extensions/test/mochitest/file_to_drawWindow.html");

  const {png, colour} = await first.awaitMessage("success");
  ok(png.startsWith("data:image/png;base64,"), "toDataURL() call was successful.");
  is(colour, "0,0,0,0", "getImageData() returned the correct colour (transparent).");

  const error = await second.awaitMessage("error");
  is(error, "The operation is insecure.", "toDataURL() throws without permission.");

  win.close();
  await first.unload();
  await second.unload();
});

</script>