• file
• revisions
• annotate
• diff
• comparison
• raw

layout/style/test/test_variables.html@7e26c7da4463 (annotated)

layout/style/test/test_variables.html

Wed, 31 Dec 2014 06:55:50 +0100

author

Michael Schloh von Bennewitz <michael@schloh.com>

date

Wed, 31 Dec 2014 06:55:50 +0100

changeset 2

7e26c7da4463

permissions

-rw-r--r--

Added tag UPSTREAM_283F7C6 for changeset ca08bd8f51b2

michael@0	1	<!DOCTYPE type>
michael@0	2	<title>Assorted CSS variable tests</title>
michael@0	3	<script src="/MochiKit/MochiKit.js"></script>
michael@0	4	<script src="/tests/SimpleTest/SimpleTest.js"></script>
michael@0	5	<link rel="stylesheet" href="/tests/SimpleTest/test.css" type="text/css">
michael@0	6
michael@0	7	<style id="test1">
michael@0	8	</style>
michael@0	9
michael@0	10	<style id="test2">
michael@0	11	</style>
michael@0	12
michael@0	13	<style id="test3">
michael@0	14	</style>
michael@0	15
michael@0	16	<style id="test4">
michael@0	17	</style>
michael@0	18
michael@0	19	<div id="t4"></div>
michael@0	20
michael@0	21	<script>
michael@0	22	var tests = [
michael@0	23	function() {
michael@0	24	// https://bugzilla.mozilla.org/show_bug.cgi?id=773296#c121
michael@0	25	var test1 = document.getElementById("test1");
michael@0	26	test1.textContent = "p { --a:123!important; }";
michael@0	27	var declaration = test1.sheet.cssRules[0].style;
michael@0	28	declaration.cssText;
michael@0	29	declaration.setProperty("color", "black");
michael@0	30	is(declaration.getPropertyValue("--a"), "123");
michael@0	31	},
michael@0	32
michael@0	33	function() {
michael@0	34	// https://bugzilla.mozilla.org/show_bug.cgi?id=773296#c121
michael@0	35	var test2 = document.getElementById("test2");
michael@0	36	test2.textContent = "p { --a: a !important; }";
michael@0	37	var declaration = test2.sheet.cssRules[0].style;
michael@0	38	is(declaration.getPropertyPriority("--a"), "important");
michael@0	39	},
michael@0	40
michael@0	41	function() {
michael@0	42	// https://bugzilla.mozilla.org/show_bug.cgi?id=955913
michael@0	43	var test3 = document.getElementById("test3");
michael@0	44	test3.textContent = "p { border-left-style: inset; padding: 1px; --decoration: line-through; }";
michael@0	45	var declaration = test3.sheet.cssRules[0].style;
michael@0	46	is(declaration[declaration.length - 1], "--decoration");
michael@0	47	},
michael@0	48
michael@0	49	function() {
michael@0	50	// https://bugzilla.mozilla.org/show_bug.cgi?id=959973
michael@0	51	var test4 = document.getElementById("test4");
michael@0	52	test4.textContent = "#t4 { background-image: var(--a); }";
michael@0	53
michael@0	54	var element = document.getElementById("t4");
michael@0	55	var path = window.location.pathname;
michael@0	56	var currentDir = path.substring(0, path.lastIndexOf('/'));
michael@0	57	var imageURL = "http://mochi.test:8888" + currentDir + "/image.png";
michael@0	58
michael@0	59	is(window.getComputedStyle(element).getPropertyValue("background-image"), "url(\"" + imageURL +"\")");
michael@0	60	},
michael@0	61	];
michael@0	62
michael@0	63	function prepareTest() {
michael@0	64	// Load an external style sheet for test 4.
michael@0	65	var e = document.createElement("link");
michael@0	66	e.addEventListener("load", runTest);
michael@0	67	e.setAttribute("rel", "stylesheet");
michael@0	68	e.setAttribute("href", "support/external-variable-url.css");
michael@0	69	document.head.appendChild(e);
michael@0	70	}
michael@0	71
michael@0	72	function runTest() {
michael@0	73	tests.forEach(function(fn) { fn(); });
michael@0	74	SimpleTest.finish();
michael@0	75	}
michael@0	76
michael@0	77	SimpleTest.waitForExplicitFinish();
michael@0	78	SpecialPowers.pushPrefEnv({ set: [["layout.css.variables.enabled", true ]] },
michael@0	79	prepareTest);
michael@0	80	</script>