blob: 15a35019ea3ba6e6ea395079af21f4332fae081e [file] [log] [blame]
<html>
<head>
<style>
/* An inline stylesheet */
body.mainpage {
text-decoration: none;
}
</style>
<link rel="stylesheet" href="resources/get-set-stylesheet-text.css">
<script src="../../http/tests/inspector/inspector-test.js"></script>
<script src="../../http/tests/inspector/elements-test.js"></script>
<script>
function test()
{
var foundStyleSheet;
CSSAgent.getAllStyleSheets(findStyleSheet);
function findStyleSheet(error, styleSheetInfos)
{
function callback(styleSheet)
{
foundStyleSheet = styleSheet;
InspectorTest.runTestSuite([ testSetText, testNewElementStyles ]);
}
for (var i = 0; i < styleSheetInfos.length; ++i) {
if (styleSheetInfos[i].sourceURL.indexOf("get-set-stylesheet-text.css") >= 0) {
foundStyleSheetInfo = styleSheetInfos[i];
WebInspector.CSSStyleSheet.createForId(foundStyleSheetInfo.styleSheetId, callback);
}
}
}
function testSetText(next)
{
function callback(error)
{
if (error) {
InspectorTest.addResult("Failed to set stylesheet text: " + error);
return;
}
InspectorTest.runAfterPendingDispatches(next);
}
InspectorTest.addResult("=== Original stylesheet text: ===");
InspectorTest.addResult(foundStyleSheet.getText());
foundStyleSheet.setText("h1 { COLOR: Red; }", true, callback);
}
function testNewElementStyles()
{
function callback(error, matchedCSSRules)
{
if (error) {
InspectorTest.addResult("error: " + error);
return;
}
InspectorTest.addResult("=== Matched rules for h1 after setText() ===");
dumpMatchesArray(matchedCSSRules);
InspectorTest.completeTest();
}
function nodeCallback(node)
{
CSSAgent.getMatchedStylesForNode(node.id, false, false, callback);
}
InspectorTest.selectNodeWithId("inspected", nodeCallback);
}
// Data dumping
function dumpMatchesArray(rules)
{
if (!rules)
return;
for (var i = 0; i < rules.length; ++i)
dumpRuleOrStyle(rules[i].rule);
}
function dumpRuleOrStyle(ruleOrStyle)
{
if (!ruleOrStyle)
return;
var isRule = !!(ruleOrStyle.style);
var style = isRule ? ruleOrStyle.style : ruleOrStyle;
InspectorTest.addResult("");
InspectorTest.addResult(isRule ? "rule" : "style");
InspectorTest.addResult((isRule ? (ruleOrStyle.selectorList.text + ": [" + ruleOrStyle.origin + "]") : "raw style"));
for (var i = 0; i < style.cssProperties.length; ++i) {
var property = style.cssProperties[i];
if (property.status !== "disabled")
InspectorTest.addResult("['" + property.name + "':'" + property.value + "'" + (property.priority === "important" ? " is-important" : "") + (("parsedOk" in property) ? " non-parsed" : "") +"] @" + InspectorTest.rangeText(property.range) + " " + (property.status || "style"));
else
InspectorTest.addResult("[text='" + property.text + "'] " + property.status);
}
}
}
</script>
</head>
<body onload="runTest()">
<p>
Tests that WebInspector.CSSStyleSheet methods work as expected.
</p>
<h1 id="inspected">Inspect Me</h1>
</body>
</html>