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

browser/devtools/styleinspector/test/browser_ruleview_inherit.js@6474c204b198 (annotated)

browser/devtools/styleinspector/test/browser_ruleview_inherit.js

Wed, 31 Dec 2014 06:09:35 +0100

author

Michael Schloh von Bennewitz <michael@schloh.com>

date

Wed, 31 Dec 2014 06:09:35 +0100

changeset 0

6474c204b198

permissions

-rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

michael@0	1	/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
michael@0	2	/* Any copyright is dedicated to the Public Domain.
michael@0	3	http://creativecommons.org/publicdomain/zero/1.0/ */
michael@0	4
michael@0	5	"use strict";
michael@0	6
michael@0	7	// Check that inherited properties appear as such in the rule-view
michael@0	8
michael@0	9	let {ELEMENT_STYLE} = devtools.require("devtools/server/actors/styles");
michael@0	10
michael@0	11	let test = asyncTest(function*() {
michael@0	12	yield addTab("data:text/html;charset=utf-8,browser_inspector_changes.js");
michael@0	13	let {toolbox, inspector, view} = yield openRuleView();
michael@0	14
michael@0	15	yield simpleInherit(inspector, view);
michael@0	16	yield emptyInherit(inspector, view);
michael@0	17	yield elementStyleInherit(inspector, view);
michael@0	18	});
michael@0	19
michael@0	20	function* simpleInherit(inspector, view) {
michael@0	21	let style = '' +
michael@0	22	'#test2 {' +
michael@0	23	' background-color: green;' +
michael@0	24	' color: purple;' +
michael@0	25	'}';
michael@0	26
michael@0	27	let styleNode = addStyle(content.document, style);
michael@0	28	content.document.body.innerHTML = '<div id="test2"><div id="test1">Styled Node</div></div>';
michael@0	29
michael@0	30	yield selectNode("#test1", inspector);
michael@0	31
michael@0	32	let elementStyle = view._elementStyle;
michael@0	33	is(elementStyle.rules.length, 2, "Should have 2 rules.");
michael@0	34
michael@0	35	let elementRule = elementStyle.rules[0];
michael@0	36	ok(!elementRule.inherited, "Element style attribute should not consider itself inherited.");
michael@0	37
michael@0	38	let inheritRule = elementStyle.rules[1];
michael@0	39	is(inheritRule.selectorText, "#test2", "Inherited rule should be the one that includes inheritable properties.");
michael@0	40	ok(!!inheritRule.inherited, "Rule should consider itself inherited.");
michael@0	41	is(inheritRule.textProps.length, 1, "Should only display one inherited style");
michael@0	42	let inheritProp = inheritRule.textProps[0];
michael@0	43	is(inheritProp.name, "color", "color should have been inherited.");
michael@0	44
michael@0	45	styleNode.remove();
michael@0	46	}
michael@0	47
michael@0	48	function* emptyInherit(inspector, view) {
michael@0	49	// No inheritable styles, this rule shouldn't show up.
michael@0	50	let style = '' +
michael@0	51	'#test2 {' +
michael@0	52	' background-color: green;' +
michael@0	53	'}';
michael@0	54
michael@0	55	let styleNode = addStyle(content.document, style);
michael@0	56	content.document.body.innerHTML = '<div id="test2"><div id="test1">Styled Node</div></div>';
michael@0	57
michael@0	58	yield selectNode("#test1", inspector);
michael@0	59
michael@0	60	let elementStyle = view._elementStyle;
michael@0	61	is(elementStyle.rules.length, 1, "Should have 1 rule.");
michael@0	62
michael@0	63	let elementRule = elementStyle.rules[0];
michael@0	64	ok(!elementRule.inherited, "Element style attribute should not consider itself inherited.");
michael@0	65
michael@0	66	styleNode.parentNode.removeChild(styleNode);
michael@0	67	}
michael@0	68
michael@0	69	function* elementStyleInherit(inspector, view) {
michael@0	70	content.document.body.innerHTML = '<div id="test2" style="color: red"><div id="test1">Styled Node</div></div>';
michael@0	71
michael@0	72	yield selectNode("#test1", inspector);
michael@0	73
michael@0	74	let elementStyle = view._elementStyle;
michael@0	75	is(elementStyle.rules.length, 2, "Should have 2 rules.");
michael@0	76
michael@0	77	let elementRule = elementStyle.rules[0];
michael@0	78	ok(!elementRule.inherited, "Element style attribute should not consider itself inherited.");
michael@0	79
michael@0	80	let inheritRule = elementStyle.rules[1];
michael@0	81	is(inheritRule.domRule.type, ELEMENT_STYLE, "Inherited rule should be an element style, not a rule.");
michael@0	82	ok(!!inheritRule.inherited, "Rule should consider itself inherited.");
michael@0	83	is(inheritRule.textProps.length, 1, "Should only display one inherited style");
michael@0	84	let inheritProp = inheritRule.textProps[0];
michael@0	85	is(inheritProp.name, "color", "color should have been inherited.");
michael@0	86	}