From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Fri, 2 Feb 2018 04:16:08 -0500 Subject: Add m-esr52 at 52.6.0 --- devtools/client/shared/test/browser_mdn-docs-03.js | 277 +++++++++++++++++++++ 1 file changed, 277 insertions(+) create mode 100644 devtools/client/shared/test/browser_mdn-docs-03.js (limited to 'devtools/client/shared/test/browser_mdn-docs-03.js') diff --git a/devtools/client/shared/test/browser_mdn-docs-03.js b/devtools/client/shared/test/browser_mdn-docs-03.js new file mode 100644 index 000000000..c686aa6a9 --- /dev/null +++ b/devtools/client/shared/test/browser_mdn-docs-03.js @@ -0,0 +1,277 @@ +/* vim: set ts=2 et sw=2 tw=80: */ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +/** + * This file tests the CSS syntax highlighter in the MdnDocsWidget object. + * + * The CSS syntax highlighter accepts: + * - a string containing CSS + * - a DOM node + * + * It parses the string and creates a collection of DOM nodes for different + * CSS token types. These DOM nodes have CSS classes applied to them, + * to apply the right style for that particular token type. The DOM nodes + * are returned as children of the node that was passed to the function. + * + * This test code defines a number of different strings containing valid and + * invalid CSS in various forms. For each string it defines the DOM nodes + * that it expects to get from the syntax highlighter. + * + * It then calls the syntax highlighter, and checks that the resulting + * collection of DOM nodes is what we expected. + */ + +"use strict"; + +const {appendSyntaxHighlightedCSS} = require("devtools/client/shared/widgets/MdnDocsWidget"); + +/** + * An array containing the actual test cases. + * + * The test code tests every case in the array. If you want to add more + * test cases, just add more items to the array. + * + * Each test case consists of: + * - description: string describing the salient features of this test case + * - example: the string to test + * - expected: an array of objects, one for each DOM node we expect, that + * captures the information about the node that we expect to test. + */ +const TEST_DATA = [{ + description: "Valid syntax, string value.", + example: "name: stringValue;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, numeric value.", + example: "name: 1;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "1"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, url value.", + example: "name: url(./name);", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "url(./name)"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, space before ':'.", + example: "name : stringValue;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: " "}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, space before ';'.", + example: "name: stringValue ;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: " "}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, trailing space.", + example: "name: stringValue; ", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"}, + {type: "text", text: " "} + ]}, { + description: "Valid syntax, leading space.", + example: " name: stringValue;", + expected: [{type: "text", text: " "}, + {type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, two spaces.", + example: "name: stringValue;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, no spaces.", + example: "name:stringValue;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, two-part value.", + example: "name: stringValue 1;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: " "}, + {type: "property-value", text: "1"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, two declarations.", + example: "name: stringValue;\n" + + "name: 1;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"}, + {type: "text", text: "\n"}, + {type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "1"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, commented, numeric value.", + example: "/* comment */\n" + + "name: 1;", + expected: [{type: "comment", text: "/* comment */"}, + {type: "text", text: "\n"}, + {type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "1"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, multiline commented, string value.", + example: "/* multiline \n" + + "comment */\n" + + "name: stringValue;", + expected: [{type: "comment", text: "/* multiline \ncomment */"}, + {type: "text", text: "\n"}, + {type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, commented, two declarations.", + example: "/* comment 1 */\n" + + "name: 1;\n" + + "/* comment 2 */\n" + + "name: stringValue;", + expected: [{type: "comment", text: "/* comment 1 */"}, + {type: "text", text: "\n"}, + {type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "1"}, + {type: "text", text: ";"}, + {type: "text", text: "\n"}, + {type: "comment", text: "/* comment 2 */"}, + {type: "text", text: "\n"}, + {type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, multiline.", + example: "name: \n" + + "stringValue;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " \n"}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Valid syntax, multiline, two declarations.", + example: "name: \n" + + "stringValue \n" + + "stringValue2;", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " \n"}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: " \n"}, + {type: "property-value", text: "stringValue2"}, + {type: "text", text: ";"} + ]}, { + description: "Invalid: not CSS at all.", + example: "not CSS at all", + expected: [{type: "property-name", text: "not"}, + {type: "text", text: " "}, + {type: "property-name", text: "CSS"}, + {type: "text", text: " "}, + {type: "property-name", text: "at"}, + {type: "text", text: " "}, + {type: "property-name", text: "all"} + ]}, { + description: "Invalid: switched ':' and ';'.", + example: "name; stringValue:", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ";"}, + {type: "text", text: " "}, + {type: "property-name", text: "stringValue"}, + {type: "text", text: ":"} + ]}, { + description: "Invalid: unterminated comment.", + example: "/* unterminated comment\n" + + "name: stringValue;", + expected: [{type: "comment", text: "/* unterminated comment\nname: stringValue;"} + ]}, { + description: "Invalid: bad comment syntax.", + example: "// invalid comment\n" + + "name: stringValue;", + expected: [{type: "text", text: "/"}, + {type: "text", text: "/"}, + {type: "text", text: " "}, + {type: "property-name", text: "invalid"}, + {type: "text", text: " "}, + {type: "property-name", text: "comment"}, + {type: "text", text: "\n"}, + {type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: ";"} + ]}, { + description: "Invalid: no trailing ';'.", + example: "name: stringValue\n" + + "name: stringValue2", + expected: [{type: "property-name", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue"}, + {type: "text", text: "\n"}, + {type: "property-value", text: "name"}, + {type: "text", text: ":"}, + {type: "text", text: " "}, + {type: "property-value", text: "stringValue2"}, + ]} +]; + +/** + * Iterate through every test case, calling the syntax highlighter, + * then calling a helper function to check the output. + */ +add_task(function* () { + let doc = gBrowser.selectedTab.ownerDocument; + let parent = doc.createElement("div"); + info("Testing all CSS syntax highlighter test cases"); + for (let {description, example, expected} of TEST_DATA) { + info("Testing: " + description); + appendSyntaxHighlightedCSS(example, parent); + checkCssSyntaxHighlighterOutput(expected, parent); + while (parent.firstChild) { + parent.firstChild.remove(); + } + } +}); -- cgit v1.2.3