OLD | NEW |
---|---|
1 /* | 1 /* |
2 * Copyright (C) 2010 Google Inc. All rights reserved. | 2 * Copyright (C) 2010 Google Inc. All rights reserved. |
3 * | 3 * |
4 * Redistribution and use in source and binary forms, with or without | 4 * Redistribution and use in source and binary forms, with or without |
5 * modification, are permitted provided that the following conditions are | 5 * modification, are permitted provided that the following conditions are |
6 * met: | 6 * met: |
7 * | 7 * |
8 * * Redistributions of source code must retain the above copyright | 8 * * Redistributions of source code must retain the above copyright |
9 * notice, this list of conditions and the following disclaimer. | 9 * notice, this list of conditions and the following disclaimer. |
10 * * Redistributions in binary form must reproduce the above | 10 * * Redistributions in binary form must reproduce the above |
(...skipping 122 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
133 * @param {!Array.<!CSSAgent.PseudoElementMatches>=} pseudoPayload | 133 * @param {!Array.<!CSSAgent.PseudoElementMatches>=} pseudoPayload |
134 * @param {!Array.<!CSSAgent.InheritedStyleEntry>=} inheritedPayload | 134 * @param {!Array.<!CSSAgent.InheritedStyleEntry>=} inheritedPayload |
135 * @return {?WebInspector.CSSStyleModel.MatchedStyleResult} | 135 * @return {?WebInspector.CSSStyleModel.MatchedStyleResult} |
136 * @this {WebInspector.CSSStyleModel} | 136 * @this {WebInspector.CSSStyleModel} |
137 */ | 137 */ |
138 function callback(error, inlinePayload, attributesPayload, matchedPayloa d, pseudoPayload, inheritedPayload) | 138 function callback(error, inlinePayload, attributesPayload, matchedPayloa d, pseudoPayload, inheritedPayload) |
139 { | 139 { |
140 if (error) | 140 if (error) |
141 return null; | 141 return null; |
142 | 142 |
143 return new WebInspector.CSSStyleModel.MatchedStyleResult(this, nodeI d, inlinePayload, attributesPayload, matchedPayload, pseudoPayload, inheritedPay load); | 143 var node = this._domModel.nodeForId(nodeId); |
144 if (!node) | |
145 return null; | |
146 | |
147 return new WebInspector.CSSStyleModel.MatchedStyleResult(this, node, inlinePayload, attributesPayload, matchedPayload, pseudoPayload, inheritedPaylo ad); | |
144 } | 148 } |
145 | 149 |
146 return this._agent.getMatchedStylesForNode(nodeId, callback.bind(this)); | 150 return this._agent.getMatchedStylesForNode(nodeId, callback.bind(this)); |
147 }, | 151 }, |
148 | 152 |
149 /** | 153 /** |
150 * @param {!DOMAgent.NodeId} nodeId | 154 * @param {!DOMAgent.NodeId} nodeId |
151 * @return {!Promise.<?Map.<string, string>>} | 155 * @return {!Promise.<?Map.<string, string>>} |
152 */ | 156 */ |
153 computedStylePromise: function(nodeId) | 157 computedStylePromise: function(nodeId) |
(...skipping 1885 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
2039 * @return {!WebInspector.CSSStyleModel} | 2043 * @return {!WebInspector.CSSStyleModel} |
2040 */ | 2044 */ |
2041 WebInspector.CSSStyleModel.fromNode = function(node) | 2045 WebInspector.CSSStyleModel.fromNode = function(node) |
2042 { | 2046 { |
2043 return /** @type {!WebInspector.CSSStyleModel} */ (WebInspector.CSSStyleMode l.fromTarget(node.target())); | 2047 return /** @type {!WebInspector.CSSStyleModel} */ (WebInspector.CSSStyleMode l.fromTarget(node.target())); |
2044 } | 2048 } |
2045 | 2049 |
2046 /** | 2050 /** |
2047 * @constructor | 2051 * @constructor |
2048 * @param {!WebInspector.CSSStyleModel} cssModel | 2052 * @param {!WebInspector.CSSStyleModel} cssModel |
2049 * @param {!DOMAgent.NodeId} nodeId | 2053 * @param {!WebInspector.DOMNode} node |
2050 * @param {?CSSAgent.CSSStyle=} inlinePayload | 2054 * @param {?CSSAgent.CSSStyle=} inlinePayload |
2051 * @param {?CSSAgent.CSSStyle=} attributesPayload | 2055 * @param {?CSSAgent.CSSStyle=} attributesPayload |
2052 * @param {!Array.<!CSSAgent.RuleMatch>=} matchedPayload | 2056 * @param {!Array.<!CSSAgent.RuleMatch>=} matchedPayload |
2053 * @param {!Array.<!CSSAgent.PseudoElementMatches>=} pseudoPayload | 2057 * @param {!Array.<!CSSAgent.PseudoElementMatches>=} pseudoPayload |
2054 * @param {!Array.<!CSSAgent.InheritedStyleEntry>=} inheritedPayload | 2058 * @param {!Array.<!CSSAgent.InheritedStyleEntry>=} inheritedPayload |
2055 */ | 2059 */ |
2056 WebInspector.CSSStyleModel.MatchedStyleResult = function(cssModel, nodeId, inlin ePayload, attributesPayload, matchedPayload, pseudoPayload, inheritedPayload) | 2060 WebInspector.CSSStyleModel.MatchedStyleResult = function(cssModel, node, inlineP ayload, attributesPayload, matchedPayload, pseudoPayload, inheritedPayload) |
2057 { | 2061 { |
2058 this._cssModel = cssModel; | 2062 this._cssModel = cssModel; |
2059 this._node = this._cssModel._domModel.nodeForId(nodeId); | 2063 this._node = node; |
2060 | |
2061 this._nodeStyles = []; | 2064 this._nodeStyles = []; |
2062 this._nodeForStyle = new Map(); | 2065 this._nodeForStyle = new Map(); |
2063 this._inheritedStyles = new Set(); | 2066 this._inheritedStyles = new Set(); |
2064 | 2067 |
2065 /** | 2068 /** |
2066 * @this {WebInspector.CSSStyleModel.MatchedStyleResult} | 2069 * @this {WebInspector.CSSStyleModel.MatchedStyleResult} |
2067 */ | 2070 */ |
2068 function addAttributesStyle() | 2071 function addAttributesStyle() |
2069 { | 2072 { |
2070 if (!attributesPayload) | 2073 if (!attributesPayload) |
(...skipping 59 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
2130 var pseudoStyles = []; | 2133 var pseudoStyles = []; |
2131 var rules = WebInspector.CSSStyleModel.parseRuleMatchArrayPayload(cs sModel, entryPayload.matches); | 2134 var rules = WebInspector.CSSStyleModel.parseRuleMatchArrayPayload(cs sModel, entryPayload.matches); |
2132 for (var j = rules.length - 1; j >= 0; --j) { | 2135 for (var j = rules.length - 1; j >= 0; --j) { |
2133 var pseudoRule = rules[j]; | 2136 var pseudoRule = rules[j]; |
2134 pseudoStyles.push(pseudoRule.style); | 2137 pseudoStyles.push(pseudoRule.style); |
2135 this._nodeForStyle.set(pseudoRule.style, pseudoElement); | 2138 this._nodeForStyle.set(pseudoRule.style, pseudoElement); |
2136 } | 2139 } |
2137 this._pseudoStyles.set(entryPayload.pseudoType, pseudoStyles); | 2140 this._pseudoStyles.set(entryPayload.pseudoType, pseudoStyles); |
2138 } | 2141 } |
2139 } | 2142 } |
2143 | |
2144 this.resetActiveProperties(); | |
2140 } | 2145 } |
2141 | 2146 |
2142 WebInspector.CSSStyleModel.MatchedStyleResult.prototype = { | 2147 WebInspector.CSSStyleModel.MatchedStyleResult.prototype = { |
2143 /** | 2148 /** |
2149 * @return {!WebInspector.DOMNode} | |
2150 */ | |
2151 node: function() | |
2152 { | |
2153 return this._node; | |
2154 }, | |
2155 | |
2156 /** | |
2157 * @param {!WebInspector.CSSStyleDeclaration} style | |
2158 * @return {boolean} | |
2159 */ | |
2160 hasMatchingSelectors: function(style) | |
2161 { | |
2162 return style.parentRule ? style.parentRule.matchingSelectors && style.pa rentRule.matchingSelectors.length > 0 && this.mediaMatches(style) : true; | |
dgozman
2015/11/09 20:36:42
I'm surprised that CSSRule has matchingSelectors p
lushnikov
2015/11/09 21:42:57
Yes, I'm on my way there.
| |
2163 }, | |
2164 | |
2165 /** | |
2166 * @param {!WebInspector.CSSStyleDeclaration} style | |
2167 * @return {boolean} | |
2168 */ | |
2169 mediaMatches: function(style) | |
dgozman
2015/11/09 20:36:42
This method should be a part of CSSRule.
lushnikov
2015/11/09 21:42:57
Rule does not have any medias, MatchedStyles objec
dgozman
2015/11/09 21:48:29
But you get media from parentRule. Isn't that a CS
lushnikov
2015/11/09 21:54:01
This is a CSSRule, but it will not contain medias
dgozman
2015/11/09 22:03:36
Thanks for explanation.
lushnikov
2015/11/09 22:11:12
Well, it is used for both rendering in SSP and com
| |
2170 { | |
2171 var media = style.parentRule ? style.parentRule.media : []; | |
2172 for (var i = 0; media && i < media.length; ++i) { | |
2173 if (!media[i].active()) | |
2174 return false; | |
2175 } | |
2176 return true; | |
2177 }, | |
2178 | |
2179 /** | |
2144 * @return {!Array<!WebInspector.CSSStyleDeclaration>} | 2180 * @return {!Array<!WebInspector.CSSStyleDeclaration>} |
2145 */ | 2181 */ |
2146 nodeStyles: function() | 2182 nodeStyles: function() |
2147 { | 2183 { |
2148 return this._nodeStyles; | 2184 return this._nodeStyles; |
2149 }, | 2185 }, |
2150 | 2186 |
2151 /** | 2187 /** |
2152 * @return {!Map.<!DOMAgent.PseudoType, !Array<!WebInspector.CSSStyleDeclara tion>>} | 2188 * @return {!Map.<!DOMAgent.PseudoType, !Array<!WebInspector.CSSStyleDeclara tion>>} |
2153 */ | 2189 */ |
(...skipping 27 matching lines...) Expand all Loading... | |
2181 return this._nodeForStyle.get(style) || null; | 2217 return this._nodeForStyle.get(style) || null; |
2182 }, | 2218 }, |
2183 | 2219 |
2184 /** | 2220 /** |
2185 * @param {!WebInspector.CSSStyleDeclaration} style | 2221 * @param {!WebInspector.CSSStyleDeclaration} style |
2186 * @return {boolean} | 2222 * @return {boolean} |
2187 */ | 2223 */ |
2188 isInherited: function(style) | 2224 isInherited: function(style) |
2189 { | 2225 { |
2190 return this._inheritedStyles.has(style); | 2226 return this._inheritedStyles.has(style); |
2227 }, | |
2228 | |
2229 /** | |
2230 * @param {!WebInspector.CSSProperty} property | |
2231 * @return {?WebInspector.CSSStyleModel.MatchedStyleResult.PropertyState} | |
2232 */ | |
2233 propertyState: function(property) | |
2234 { | |
2235 if (this._propertiesState.size === 0) { | |
dgozman
2015/11/09 20:36:42
Could it be that size is zero even after calculati
lushnikov
2015/11/09 21:42:57
You might recreate this situation if you'd like: y
| |
2236 this._computeActiveProperties(this._nodeStyles, this._propertiesStat e); | |
2237 for (var pseudoElementStyles of this._pseudoStyles.valuesArray()) | |
2238 this._computeActiveProperties(pseudoElementStyles, this._propert iesState); | |
2239 } | |
2240 return this._propertiesState.get(property) || null; | |
2241 }, | |
2242 | |
2243 resetActiveProperties: function() | |
2244 { | |
2245 /** @type {!Map<!WebInspector.CSSProperty, !WebInspector.CSSStyleModel.M atchedStyleResult.PropertyState>} */ | |
2246 this._propertiesState = new Map(); | |
dgozman
2015/11/09 20:36:42
.clear()
lushnikov
2015/11/09 21:42:57
The resetActiveProperties() is used in the constru
| |
2247 }, | |
2248 | |
2249 /** | |
2250 * @param {!Array<!WebInspector.CSSStyleDeclaration>} styles | |
2251 * @param {!Map<!WebInspector.CSSProperty, !WebInspector.CSSStyleModel.Match edStyleResult.PropertyState>} result | |
2252 */ | |
2253 _computeActiveProperties: function(styles, result) | |
2254 { | |
2255 /** @type {!Set.<string>} */ | |
2256 var foundImportantProperties = new Set(); | |
2257 /** @type {!Map.<string, !Map<string, !WebInspector.CSSProperty>>} */ | |
2258 var propertyToEffectiveRule = new Map(); | |
2259 /** @type {!Map.<string, !WebInspector.DOMNode>} */ | |
2260 var inheritedPropertyToNode = new Map(); | |
2261 /** @type {!Set<string>} */ | |
2262 var allUsedProperties = new Set(); | |
2263 for (var i = 0; i < styles.length; ++i) { | |
2264 var style = styles[i]; | |
2265 if (!this.hasMatchingSelectors(style)) | |
2266 continue; | |
2267 | |
2268 /** @type {!Map<string, !WebInspector.CSSProperty>} */ | |
2269 var styleActiveProperties = new Map(); | |
2270 var allProperties = style.allProperties; | |
2271 for (var j = 0; j < allProperties.length; ++j) { | |
2272 var property = allProperties[j]; | |
2273 | |
2274 // Do not pick non-inherited properties from inherited styles. | |
2275 var inherited = this.isInherited(style); | |
2276 if (inherited && !WebInspector.CSSMetadata.isPropertyInherited(p roperty.name)) | |
2277 continue; | |
2278 | |
2279 if (!property.activeInStyle()) { | |
2280 result.set(property, WebInspector.CSSStyleModel.MatchedStyle Result.PropertyState.Overloaded); | |
2281 continue; | |
2282 } | |
2283 | |
2284 var canonicalName = WebInspector.CSSMetadata.canonicalPropertyNa me(property.name); | |
2285 if (foundImportantProperties.has(canonicalName)) { | |
2286 result.set(property, WebInspector.CSSStyleModel.MatchedStyle Result.PropertyState.Overloaded); | |
2287 continue; | |
2288 } | |
2289 | |
2290 if (!property.important && allUsedProperties.has(canonicalName)) { | |
2291 result.set(property, WebInspector.CSSStyleModel.MatchedStyle Result.PropertyState.Overloaded); | |
2292 continue; | |
2293 } | |
2294 | |
2295 var isKnownProperty = propertyToEffectiveRule.has(canonicalName) ; | |
2296 var inheritedFromNode = inherited ? this.nodeForStyle(style) : n ull; | |
2297 if (!isKnownProperty && inheritedFromNode && !inheritedPropertyT oNode.has(canonicalName)) | |
2298 inheritedPropertyToNode.set(canonicalName, inheritedFromNode ); | |
2299 | |
2300 if (property.important) { | |
2301 if (inherited && isKnownProperty && inheritedFromNode !== in heritedPropertyToNode.get(canonicalName)) { | |
2302 result.set(property, WebInspector.CSSStyleModel.MatchedS tyleResult.PropertyState.Overloaded); | |
2303 continue; | |
2304 } | |
2305 | |
2306 foundImportantProperties.add(canonicalName); | |
2307 if (isKnownProperty) { | |
2308 var overloaded = /** @type {!WebInspector.CSSProperty} * /(propertyToEffectiveRule.get(canonicalName).get(canonicalName)); | |
2309 result.set(overloaded, WebInspector.CSSStyleModel.Matche dStyleResult.PropertyState.Overloaded); | |
2310 propertyToEffectiveRule.get(canonicalName).delete(canoni calName); | |
2311 } | |
2312 } | |
2313 | |
2314 styleActiveProperties.set(canonicalName, property); | |
2315 allUsedProperties.add(canonicalName); | |
2316 propertyToEffectiveRule.set(canonicalName, styleActiveProperties ); | |
2317 result.set(property, WebInspector.CSSStyleModel.MatchedStyleResu lt.PropertyState.Active); | |
2318 } | |
2319 | |
2320 // If every longhand of the shorthand is not active, then the shorth and is not active too. | |
2321 for (var property of style.leadingProperties()) { | |
2322 var canonicalName = WebInspector.CSSMetadata.canonicalPropertyNa me(property.name); | |
2323 if (!styleActiveProperties.has(canonicalName)) | |
2324 continue; | |
2325 var longhands = style.longhandProperties(property.name); | |
2326 if (!longhands.length) | |
2327 continue; | |
2328 var notUsed = true; | |
2329 for (var longhand of longhands) { | |
2330 var longhandCanonicalName = WebInspector.CSSMetadata.canonic alPropertyName(longhand.name); | |
2331 notUsed = notUsed && !styleActiveProperties.has(longhandCano nicalName); | |
2332 } | |
2333 if (!notUsed) | |
2334 continue; | |
2335 styleActiveProperties.delete(canonicalName); | |
2336 allUsedProperties.delete(canonicalName); | |
2337 result.set(property, WebInspector.CSSStyleModel.MatchedStyleResu lt.PropertyState.Overloaded); | |
2338 } | |
2339 } | |
2191 } | 2340 } |
2192 } | 2341 } |
2193 | 2342 |
2343 /** @enum {string} */ | |
2344 WebInspector.CSSStyleModel.MatchedStyleResult.PropertyState = { | |
2345 Active: "Active", | |
2346 Overloaded: "Overloaded" | |
2347 } | |
2348 | |
2194 /** | 2349 /** |
2195 * @constructor | 2350 * @constructor |
2196 * @param {?WebInspector.CSSStyleDeclaration} inlineStyle | 2351 * @param {?WebInspector.CSSStyleDeclaration} inlineStyle |
2197 * @param {?WebInspector.CSSStyleDeclaration} attributesStyle | 2352 * @param {?WebInspector.CSSStyleDeclaration} attributesStyle |
2198 */ | 2353 */ |
2199 WebInspector.CSSStyleModel.InlineStyleResult = function(inlineStyle, attributesS tyle) | 2354 WebInspector.CSSStyleModel.InlineStyleResult = function(inlineStyle, attributesS tyle) |
2200 { | 2355 { |
2201 this.inlineStyle = inlineStyle; | 2356 this.inlineStyle = inlineStyle; |
2202 this.attributesStyle = attributesStyle; | 2357 this.attributesStyle = attributesStyle; |
2203 } | 2358 } |
2204 | 2359 |
OLD | NEW |