| // Copyright 2017 The Chromium Authors. All rights reserved. |
| // Use of this source code is governed by a BSD-style license that can be |
| // found in the LICENSE file. |
| |
| (async function() { |
| TestRunner.addResult( |
| `Tests that proper data and start/end offset positions are reported for CSS style declarations and properties.\n`); |
| await TestRunner.loadModule('elements_test_runner'); |
| await TestRunner.showPanel('elements'); |
| await TestRunner.loadHTML(` |
| <head> |
| <link rel="stylesheet" href="../styles/resources/styles-source-offsets.css"> |
| <style> |
| |
| body.mainpage { |
| text-decoration: none; /* at least one valid property is necessary for WebCore to match a rule */ |
| badproperty: 1badvalue1; |
| } |
| |
| </style> |
| </head> |
| <body id="mainBody" class="main1 main2 mainpage" style="font-weight: normal; width: 80%"> |
| </body> |
| `); |
| |
| function dumpStyleData(ruleOrStyle) { |
| var isRule = !!(ruleOrStyle.style); |
| var style; |
| var header = ''; |
| if (isRule) { |
| if (ruleOrStyle.origin !== 'regular') |
| return; |
| style = ruleOrStyle.style; |
| var selectorRanges = []; |
| var selectors = ruleOrStyle.selectorList.selectors; |
| var firstRange = selectors[0].range; |
| var lastRange = selectors[selectors.length - 1].range; |
| var range = { |
| startLine: firstRange.startLine, |
| startColumn: firstRange.startColumn, |
| endLine: lastRange.endLine, |
| endColumn: lastRange.endColumn |
| }; |
| header = ruleOrStyle.selectorList.text + ': ' + (range ? ElementsTestRunner.rangeText(range) : ''); |
| } else { |
| style = ruleOrStyle; |
| header = 'element.style:'; |
| } |
| TestRunner.addResult(header + ' ' + ElementsTestRunner.rangeText(style.range)); |
| var allProperties = style.cssProperties; |
| for (var i = 0; i < allProperties.length; ++i) { |
| var property = allProperties[i]; |
| if (!property.range) |
| continue; |
| TestRunner.addResult( |
| '[\'' + property.name + '\':\'' + property.value + '\'' + (property.important ? ' !important' : '') + |
| (('parsedOk' in property) ? ' non-parsed' : '') + '] @' + ElementsTestRunner.rangeText(property.range)); |
| } |
| } |
| |
| await (() => { |
| // TODO(crbug.com/1046354): This is a workaround for loadHTML() resolving |
| // before parsing is finished. In this case the stylesheet is blocking html |
| // parsing with BlockHTMLParsingOnStyleSheets enabled and mainBody is not |
| // found by selectNodeWithId below. |
| let resolve; |
| const promise = new Promise(r => resolve = r); |
| TestRunner.waitForPageLoad(() => resolve()); |
| return promise; |
| })(); |
| |
| ElementsTestRunner.selectNodeWithId('mainBody', step1); |
| |
| async function step1(node) { |
| var response = await TestRunner.CSSAgent.invoke_getMatchedStylesForNode({nodeId: node.id}); |
| |
| for (var rule of response.matchedCSSRules) |
| dumpStyleData(rule.rule); |
| dumpStyleData(response.inlineStyle); |
| TestRunner.completeTest(); |
| } |
| })(); |