tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

test_ext_tabs_insertCSS.html (3457B)

      1 <!DOCTYPE HTML>
      2 <html>
      3 <head>
      4  <meta charset="utf-8">
      5  <title>Tabs executeScript Test</title>
      6  <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
      7  <script type="text/javascript" src="/tests/SimpleTest/ExtensionTestUtils.js"></script>
      8  <script type="text/javascript" src="head.js"></script>
      9  <link rel="stylesheet" href="/tests/SimpleTest/test.css"/>
     10 </head>
     11 <body>
     12 
     13 <script type="text/javascript">
     14 "use strict";
     15 
     16 add_task(async function testExecuteScript() {
     17  const win = window.open("http://mochi.test:8888/");
     18 
     19  async function background() {
     20    const tasks = [
     21      {
     22        description: "CSS as moz-extension:// url",
     23        background: "rgba(0, 0, 0, 0)",
     24        foreground: "rgb(0, 113, 4)",
     25        promise: () => {
     26          return browser.tabs.insertCSS({
     27            file: "file2.css",
     28          });
     29        },
     30      },
     31      {
     32        description: "CSS as code snippet string",
     33        background: "rgb(42, 42, 42)",
     34        foreground: "rgb(0, 113, 4)",
     35        promise: () => {
     36          return browser.tabs.insertCSS({
     37            code: "* { background: rgb(42, 42, 42) }",
     38          });
     39        },
     40      },
     41      {
     42        description: "last of two author CSS wins",
     43        background: "rgb(42, 42, 42)",
     44        foreground: "rgb(0, 113, 4)",
     45        promise: async () => {
     46          await browser.tabs.insertCSS({
     47            code: "* { background: rgb(100, 100, 100) !important }",
     48            cssOrigin: "author",
     49          });
     50          await browser.tabs.insertCSS({
     51            code: "* { background: rgb(42, 42, 42) !important }",
     52            cssOrigin: "author",
     53          });
     54        },
     55      },
     56      {
     57        description: "user CSS has higher priority",
     58        background: "rgb(100, 100, 100)",
     59        foreground: "rgb(0, 113, 4)",
     60        promise: async () => {
     61          // User has higher importance
     62          await browser.tabs.insertCSS({
     63            code: "* { background: rgb(100, 100, 100) !important }",
     64            cssOrigin: "user",
     65          });
     66          await browser.tabs.insertCSS({
     67            code: "* { background: rgb(42, 42, 42) !important }",
     68            cssOrigin: "author",
     69          });
     70        },
     71      },
     72    ];
     73 
     74    function checkCSS() {
     75      const computedStyle = window.getComputedStyle(document.body);
     76      return [computedStyle.backgroundColor, computedStyle.color];
     77    }
     78 
     79    try {
     80      for (const {background, description, foreground, promise} of tasks) {
     81        browser.test.log(`Run test case: ${description}`);
     82        let result = await promise();
     83 
     84        browser.test.assertEq(undefined, result, "Expected callback result");
     85 
     86        [result] = await browser.tabs.executeScript({
     87          code: `(${checkCSS})()`,
     88        });
     89 
     90        browser.test.assertEq(background, result[0], "Expected background color");
     91        browser.test.assertEq(foreground, result[1], "Expected foreground color");
     92      }
     93 
     94      browser.test.notifyPass("insertCSS");
     95    } catch (e) {
     96      browser.test.fail(`Error: ${e} :: ${e.stack}`);
     97      browser.test.notifyFail("insertCSS");
     98    }
     99  }
    100 
    101  const extension = ExtensionTestUtils.loadExtension({
    102    manifest: {
    103      "permissions": ["http://mochi.test/"],
    104    },
    105 
    106    background,
    107 
    108    files: {
    109      "file2.css": "* { color: rgb(0, 113, 4) }",
    110    },
    111  });
    112 
    113  await extension.startup();
    114 
    115  await extension.awaitFinish("insertCSS");
    116 
    117  await extension.unload();
    118 
    119  win.close();
    120 });
    121 </script>
    122 
    123 </body>
    124 </html>