summaryrefslogtreecommitdiffstats
path: root/devtools/client/sourceeditor/test/browser_css_statemachine.js
blob: f69d6027864c990494362cc1237b4cf0dba5468a (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
/* vim: set ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
   http://creativecommons.org/publicdomain/zero/1.0/ */

"use strict";

const CSSCompleter = require("devtools/client/sourceeditor/css-autocompleter");

const CSS_URI = "http://mochi.test:8888/browser/devtools/client/sourceeditor" +
                "/test/css_statemachine_testcases.css";
const TESTS_URI = "http://mochi.test:8888/browser/devtools/client" +
                  "/sourceeditor/test/css_statemachine_tests.json";

const source = read(CSS_URI);
const tests = eval(read(TESTS_URI));

const TEST_URI = "data:text/html;charset=UTF-8," + encodeURIComponent(
  ["<!DOCTYPE html>",
   "<html>",
   " <head>",
   "  <title>CSS State machine tests.</title>",
   "  <style type='text/css'>",
   "#progress {",
   "  width: 500px; height: 30px;",
   "  border: 1px solid black;",
   "  position: relative",
   "}",
   "#progress div {",
   "  width: 0%; height: 100%;",
   "  background: green;",
   "  position: absolute;",
   "  z-index: -1; top: 0",
   "}",
   "#progress.failed div {",
   "  background: red !important;",
   "}",
   "#progress.failed:after {",
   "  content: 'Some tests failed';",
   "  color: white",
   "}",
   "#progress:before {",
   "  content: 'Running test ' attr(data-progress) ' of " + tests.length + "';",
   "  color: white;",
   "  text-shadow: 0 0 2px darkgreen;",
   "}",
   "  </style>",
   " </head>",
   " <body>",
   "  <h2>State machine tests for CSS autocompleter.</h2><br>",
   "  <div id='progress' data-progress='0'>",
   "   <div></div>",
   "  </div>",
   " </body>",
   " </html>"
  ].join("\n"));

var doc = null;
function test() {
  waitForExplicitFinish();
  gBrowser.selectedTab = gBrowser.addTab(TEST_URI);
  BrowserTestUtils.browserLoaded(gBrowser.selectedBrowser).then(() => {
    doc = content.document;
    runTests();
  });
}

function runTests() {
  let completer = new CSSCompleter({cssProperties: getClientCssProperties()});
  let checkState = state => {
    if (state[0] == "null" && (!completer.state || completer.state == "null")) {
      return true;
    } else if (state[0] == completer.state && state[0] == "selector" &&
               state[1] == completer.selectorState &&
               state[2] == completer.completing &&
               state[3] == completer.selector) {
      return true;
    } else if (state[0] == completer.state && state[0] == "value" &&
               state[2] == completer.completing &&
               state[3] == completer.propertyName) {
      return true;
    } else if (state[0] == completer.state &&
               state[2] == completer.completing &&
               state[0] != "selector" && state[0] != "value") {
      return true;
    }
    return false;
  };

  let progress = doc.getElementById("progress");
  let progressDiv = doc.querySelector("#progress > div");
  let i = 0;
  for (let test of tests) {
    progress.dataset.progress = ++i;
    progressDiv.style.width = 100 * i / tests.length + "%";
    completer.resolveState(limit(source, test[0]),
                           {line: test[0][0], ch: test[0][1]});
    if (checkState(test[1])) {
      ok(true, "Test " + i + " passed. ");
    } else {
      ok(false, "Test " + i + " failed. Expected state : [" + test[1] + "] " +
         "but found [" + completer.state + ", " + completer.selectorState +
         ", " + completer.completing + ", " +
         (completer.propertyName || completer.selector) + "].");
      progress.classList.add("failed");
    }
  }
  gBrowser.removeCurrentTab();
  finish();
}