1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/browser/devtools/sourceeditor/test/browser_css_getInfo.js Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,177 @@
1.4 +/* vim: set ts=2 et sw=2 tw=80: */
1.5 +/* Any copyright is dedicated to the Public Domain.
1.6 + http://creativecommons.org/publicdomain/zero/1.0/ */
1.7 +
1.8 +"use strict";
1.9 +
1.10 +const cssAutoCompleter = require("devtools/sourceeditor/css-autocompleter");
1.11 +
1.12 +const source = [
1.13 +".devtools-toolbar {",
1.14 +" -moz-appearance: none;",
1.15 +" padding:4px 3px;border-bottom-width: 1px;",
1.16 +" border-bottom-style: solid;",
1.17 +"}",
1.18 +"",
1.19 +"#devtools-menu.devtools-menulist,",
1.20 +".devtools-toolbarbutton#devtools-menu {",
1.21 +" -moz-appearance: none;",
1.22 +" -moz-box-align: center;",
1.23 +" min-width: 78px;",
1.24 +" min-height: 22px;",
1.25 +" text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);",
1.26 +" border: 1px solid hsla(210,8%,5%,.45);",
1.27 +" border-radius: 3px;",
1.28 +" background: linear-gradient(hsla(212,7%,57%,.35),",
1.29 +" hsla(212,7%,57%,.1)) padding-box;",
1.30 +" margin: 0 3px;",
1.31 +" color: inherit;",
1.32 +"}",
1.33 +"",
1.34 +".devtools-toolbarbutton > hbox.toolbarbutton-menubutton-button {",
1.35 +" -moz-box-orient: horizontal;",
1.36 +"}",
1.37 +"",
1.38 +".devtools-menulist:active,",
1.39 +"#devtools-toolbarbutton:focus {",
1.40 +" outline: 1px dotted hsla(210,30%,85%,0.7);",
1.41 +" outline-offset : -4px;",
1.42 +"}",
1.43 +"",
1.44 +".devtools-toolbarbutton:not([label]) {",
1.45 +" min-width: 32px;",
1.46 +"}",
1.47 +"",
1.48 +".devtools-toolbarbutton:not([label]) > .toolbarbutton-text, .devtools-toolbar {",
1.49 +" display: none;",
1.50 +"}",
1.51 +].join("\n");
1.52 +
1.53 +// Format of test cases :
1.54 +// [
1.55 +// {line, ch}, - The caret position at which the getInfo call should be made
1.56 +// expectedState, - The expected state at the caret
1.57 +// expectedSelector, - The expected selector for the state
1.58 +// expectedProperty, - The expected property name for states value and property
1.59 +// expectedValue, - If state is value, then the expected value
1.60 +// ]
1.61 +const tests = [
1.62 + [{line: 0, ch: 13}, "selector", ".devtools-toolbar"],
1.63 + [{line: 8, ch: 13}, "property", ["#devtools-menu.devtools-menulist",
1.64 + ".devtools-toolbarbutton#devtools-menu "], "-moz-appearance"],
1.65 + [{line: 28, ch: 25}, "value", [".devtools-menulist:active",
1.66 + "#devtools-toolbarbutton:focus "], "outline-offset", "-4px"],
1.67 + [{line: 4, ch: 1}, "null"],
1.68 + [{line: 5, ch: 0}, "null"],
1.69 + [{line: 31, ch: 13}, "selector", ".devtools-toolbarbutton:not([label])"],
1.70 + [{line: 35, ch: 23}, "selector", ".devtools-toolbarbutton:not([label]) > .toolbarbutton-text"],
1.71 + [{line: 35, ch: 70}, "selector", ".devtools-toolbar"],
1.72 + [{line: 27, ch: 14}, "value", [".devtools-menulist:active",
1.73 + "#devtools-toolbarbutton:focus "], "outline", "1px dotted hsla(210,30%,85%,0.7)"],
1.74 + [{line: 16, ch: 16}, "value", ["#devtools-menu.devtools-menulist",
1.75 + ".devtools-toolbarbutton#devtools-menu "], "background",
1.76 + "linear-gradient(hsla(212,7%,57%,.35),\n hsla(212,7%,57%,.1)) padding-box"],
1.77 + [{line: 16, ch: 3}, "value", ["#devtools-menu.devtools-menulist",
1.78 + ".devtools-toolbarbutton#devtools-menu "], "background",
1.79 + "linear-gradient(hsla(212,7%,57%,.35),\n hsla(212,7%,57%,.1)) padding-box"],
1.80 + [{line: 15, ch: 25}, "value", ["#devtools-menu.devtools-menulist",
1.81 + ".devtools-toolbarbutton#devtools-menu "], "background",
1.82 + "linear-gradient(hsla(212,7%,57%,.35),\n hsla(212,7%,57%,.1)) padding-box"],
1.83 +];
1.84 +
1.85 +const TEST_URI = "data:text/html;charset=UTF-8," + encodeURIComponent(
1.86 + ["<!DOCTYPE html>",
1.87 + "<html>",
1.88 + " <head>",
1.89 + " <title>CSS contextual information tests.</title>",
1.90 + " <style type='text/css'>",
1.91 + "#progress {",
1.92 + " width: 500px; height: 30px;",
1.93 + " border: 1px solid black;",
1.94 + " position: relative",
1.95 + "}",
1.96 + "#progress div {",
1.97 + " width: 0%; height: 100%;",
1.98 + " background: green;",
1.99 + " position: absolute;",
1.100 + " z-index: -1; top: 0",
1.101 + "}",
1.102 + "#progress.failed div {",
1.103 + " background: red !important;",
1.104 + "}",
1.105 + "#progress.failed:after {",
1.106 + " content: 'Some tests failed';",
1.107 + " color: white",
1.108 + "}",
1.109 + "#progress:before {",
1.110 + " content: 'Running test ' attr(data-progress) ' of " + tests.length + "';",
1.111 + " color: white;",
1.112 + " text-shadow: 0 0 2px darkgreen;",
1.113 + "}",
1.114 + " </style>",
1.115 + " </head>",
1.116 + " <body>",
1.117 + " <h2>State machine tests for CSS autocompleter.</h2><br>",
1.118 + " <div id='progress' data-progress='0'>",
1.119 + " <div></div>",
1.120 + " </div>",
1.121 + " </body>",
1.122 + " </html>"
1.123 + ].join("\n"));
1.124 +
1.125 +let doc = null;
1.126 +function test() {
1.127 + waitForExplicitFinish();
1.128 + gBrowser.selectedTab = gBrowser.addTab();
1.129 + gBrowser.selectedBrowser.addEventListener("load", function onload() {
1.130 + gBrowser.selectedBrowser.removeEventListener("load", onload, true);
1.131 + doc = content.document;
1.132 + runTests();
1.133 + }, true);
1.134 + content.location = TEST_URI;
1.135 +}
1.136 +
1.137 +function runTests() {
1.138 + let completer = new cssAutoCompleter();
1.139 + let matches = (arr, toCheck) => !arr.some((x, i) => x != toCheck[i]);
1.140 + let checkState = (expected, actual) => {
1.141 + if (expected[0] == "null" && actual == null) {
1.142 + return true;
1.143 + } else if (expected[0] == actual.state && expected[0] == "selector" &&
1.144 + expected[1] == actual.selector) {
1.145 + return true;
1.146 + } else if (expected[0] == actual.state && expected[0] == "property" &&
1.147 + matches(expected[1], actual.selectors) &&
1.148 + expected[2] == actual.propertyName) {
1.149 + return true;
1.150 + } else if (expected[0] == actual.state && expected[0] == "value" &&
1.151 + matches(expected[1], actual.selectors) &&
1.152 + expected[2] == actual.propertyName &&
1.153 + expected[3] == actual.value) {
1.154 + return true;
1.155 + }
1.156 + return false;
1.157 + };
1.158 +
1.159 + let progress = doc.getElementById("progress");
1.160 + let progressDiv = doc.querySelector("#progress > div");
1.161 + let i = 0;
1.162 + for (let expected of tests) {
1.163 + let caret = expected.splice(0, 1)[0];
1.164 + progress.dataset.progress = ++i;
1.165 + progressDiv.style.width = 100*i/tests.length + "%";
1.166 + let actual = completer.getInfoAt(source, caret);
1.167 + if (checkState(expected, actual)) {
1.168 + ok(true, "Test " + i + " passed. ");
1.169 + }
1.170 + else {
1.171 + ok(false, "Test " + i + " failed. Expected state : [" + expected + "] " +
1.172 + "but found [" + actual.state + ", " +
1.173 + (actual.selector || actual.selectors) + ", " +
1.174 + actual.propertyName + ", " + actual.value + "].");
1.175 + progress.classList.add("failed");
1.176 + }
1.177 + }
1.178 + gBrowser.removeCurrentTab();
1.179 + finish();
1.180 +}
