search

GoogleChrome / devtools-docs

The legacy documentation for Chrome DevTools.
https://developer.chrome.com/devtools
691 stars 179 forks source link

Large CSS selector grouping (8+) throws an exception. #294

Closed jakubstrama closed 9 years ago

jakubstrama commented 9 years ago

Following selector grouping causes devttools Elements to show no style while analysing the selected element. (Chrome Version 44.0.2403.125 m)

CSS

.remove-link, .edit-link, .done-link, .cancel-link, .remove-link > i, .edit-link > i, .done-link > i, .cancel-link > i {
  color: #c4c4c4;
  transition: all 0.2s;
}

Markup

<a  href="#" ... class="ui-commandlink ui-widget remove-link pull-right">
    <i class="fa fa-times"></i>
</a>

emptyselection

While analyzing devtools with ctrl + shift + i inspector, following exception is thrown after clicking on <i> tag:

TypeError: Cannot read property 'range' of undefined
    at Function.WebInspector.StylePropertiesSection.createRuleOriginNode (chrome-devtools://devtools/bundled/elements_module.js:1477:183)
    at Object.WebInspector.StylePropertiesSection._updateRuleOrigin (chrome-devtools://devtools/bundled/elements_module.js:1472:117)
    at Object.WebInspector.StylePropertiesSection (chrome-devtools://devtools/bundled/elements_module.js:1363:198)
    at Object.WebInspector.StylesSidebarPane._rebuildSectionsForMatchedStyleRules (chrome-devtools://devtools/bundled/elements_module.js:1300:13)
    at Object.WebInspector.StylesSidebarPane._innerRebuildUpdate (chrome-devtools://devtools/bundled/elements_module.js:1274:33)

It looks like the method rule.matchingSelectors returns an index that is out of bounds of rule.selectors[firstMatchingIndex]

Garbee commented 9 years ago

Please file a bug in the chromium issue tracker. This repo is for the documentation only.