Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(116)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/components/ObjectPropertiesSection.js

Issue 2629073004: ac (Closed)
Patch Set: Created 3 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2008 Apple Inc. All Rights Reserved. 2 * Copyright (C) 2008 Apple Inc. All Rights Reserved.
3 * Copyright (C) 2009 Joseph Pecoraro 3 * Copyright (C) 2009 Joseph Pecoraro
4 * 4 *
5 * Redistribution and use in source and binary forms, with or without 5 * Redistribution and use in source and binary forms, with or without
6 * modification, are permitted provided that the following conditions 6 * modification, are permitted provided that the following conditions
7 * are met: 7 * are met:
8 * 1. Redistributions of source code must retain the above copyright 8 * 1. 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 * 2. Redistributions in binary form must reproduce the above copyright 10 * 2. Redistributions in binary form must reproduce the above copyright
(...skipping 163 matching lines...) Expand 10 before | Expand all | Expand 10 after
174 const maxArrowFunctionCharacterLength = 60; 174 const maxArrowFunctionCharacterLength = 60;
175 var abbreviation = text; 175 var abbreviation = text;
176 if (defaultName) 176 if (defaultName)
177 abbreviation = defaultName + '()'; 177 abbreviation = defaultName + '()';
178 else if (text.length > maxArrowFunctionCharacterLength) 178 else if (text.length > maxArrowFunctionCharacterLength)
179 abbreviation = text.substring(0, firstArrowIndex + 2) + ' {\u2026}'; 179 abbreviation = text.substring(0, firstArrowIndex + 2) + ' {\u2026}';
180 addElements('', text, abbreviation); 180 addElements('', text, abbreviation);
181 } else { 181 } else {
182 addElements('function', text, nameAndArguments(text)); 182 addElements('function', text, nameAndArguments(text));
183 } 183 }
184 valueElement.title = description || '';
184 return valueElement; 185 return valueElement;
185 186
186 /** 187 /**
187 * @param {string} contents 188 * @param {string} contents
188 * @return {string} 189 * @return {string}
189 */ 190 */
190 function nameAndArguments(contents) { 191 function nameAndArguments(contents) {
191 var startOfArgumentsIndex = contents.indexOf('('); 192 var startOfArgumentsIndex = contents.indexOf('(');
192 var endOfArgumentsMatch = contents.match(/\)\s*{/); 193 var endOfArgumentsMatch = contents.match(/\)\s*{/);
193 if (startOfArgumentsIndex !== -1 && endOfArgumentsMatch && endOfArgumentsM atch.index > startOfArgumentsIndex) { 194 if (startOfArgumentsIndex !== -1 && endOfArgumentsMatch && endOfArgumentsM atch.index > startOfArgumentsIndex) {
(...skipping 18 matching lines...) Expand all
212 else 213 else
213 valueElement.createTextChild(abbreviation.replace(/\n/g, ' ')); 214 valueElement.createTextChild(abbreviation.replace(/\n/g, ' '));
214 } 215 }
215 } 216 }
216 217
217 /** 218 /**
218 * @param {!SDK.RemoteObject} value 219 * @param {!SDK.RemoteObject} value
219 * @param {boolean} wasThrown 220 * @param {boolean} wasThrown
220 * @param {!Element=} parentElement 221 * @param {!Element=} parentElement
221 * @param {!Components.Linkifier=} linkifier 222 * @param {!Components.Linkifier=} linkifier
223 * @param {boolean=} hidePreview
222 * @return {!Element} 224 * @return {!Element}
223 */ 225 */
224 static createValueElementWithCustomSupport(value, wasThrown, parentElement, li nkifier) { 226 static createValueElementWithCustomSupport(value, wasThrown, parentElement, li nkifier, hidePreview) {
225 if (value.customPreview()) { 227 if (value.customPreview()) {
226 var result = (new Components.CustomPreviewComponent(value)).element; 228 var result = (new Components.CustomPreviewComponent(value)).element;
227 result.classList.add('object-properties-section-custom-section'); 229 result.classList.add('object-properties-section-custom-section');
228 return result; 230 return result;
229 } 231 }
230 return Components.ObjectPropertiesSection.createValueElement(value, wasThrow n, parentElement, linkifier); 232 return Components.ObjectPropertiesSection.createValueElement(
233 value, wasThrown, parentElement, linkifier, hidePreview);
231 } 234 }
232 235
233 /** 236 /**
234 * @param {!SDK.RemoteObject} value 237 * @param {!SDK.RemoteObject} value
235 * @param {boolean} wasThrown 238 * @param {boolean} wasThrown
236 * @param {!Element=} parentElement 239 * @param {!Element=} parentElement
237 * @param {!Components.Linkifier=} linkifier 240 * @param {!Components.Linkifier=} linkifier
241 * @param {boolean=} hidePreview
238 * @return {!Element} 242 * @return {!Element}
239 */ 243 */
240 static createValueElement(value, wasThrown, parentElement, linkifier) { 244 static createValueElement(value, wasThrown, parentElement, linkifier, hidePrev iew) {
241 var valueElement; 245 var valueElement;
242 var type = value.type; 246 var type = value.type;
243 var subtype = value.subtype; 247 var subtype = value.subtype;
244 var description = value.description; 248 var description = value.description;
245 if (type === 'object' && subtype === 'internal#location') { 249 if (type === 'object' && subtype === 'internal#location') {
246 var rawLocation = value.debuggerModel().createRawLocationByScriptId( 250 var rawLocation = value.debuggerModel().createRawLocationByScriptId(
247 value.value.scriptId, value.value.lineNumber, value.value.columnNumber ); 251 value.value.scriptId, value.value.lineNumber, value.value.columnNumber );
248 if (rawLocation && linkifier) 252 if (rawLocation && linkifier)
249 return linkifier.linkifyRawLocation(rawLocation, ''); 253 return linkifier.linkifyRawLocation(rawLocation, '');
250 valueElement = createUnknownInternalLocationElement(); 254 valueElement = createUnknownInternalLocationElement();
251 valueElement.title = description;
252 } else if (type === 'string' && typeof description === 'string') { 255 } else if (type === 'string' && typeof description === 'string') {
253 valueElement = createStringElement(); 256 valueElement = createStringElement();
254 valueElement.title = description;
255 } else if (type === 'function') { 257 } else if (type === 'function') {
256 valueElement = Components.ObjectPropertiesSection.valueElementForFunctionD escription(description); 258 valueElement = Components.ObjectPropertiesSection.valueElementForFunctionD escription(description);
257 valueElement.title = description;
258 } else if (type === 'object' && subtype === 'node' && description) { 259 } else if (type === 'object' && subtype === 'node' && description) {
259 valueElement = createNodeElement(); 260 valueElement = createNodeElement();
260 } else if (type === 'number' && description && description.indexOf('e') !== -1) { 261 } else if (type === 'number' && description && description.indexOf('e') !== -1) {
261 valueElement = createNumberWithExponentElement(); 262 valueElement = createNumberWithExponentElement();
262 valueElement.title = description;
263 if (parentElement) // FIXME: do it in the caller. 263 if (parentElement) // FIXME: do it in the caller.
264 parentElement.classList.add('hbox'); 264 parentElement.classList.add('hbox');
265 } else { 265 } else {
266 valueElement = createElementWithClass('span', 'object-value-' + (subtype | | type)); 266 valueElement = createElementWithClass('span', 'object-value-' + (subtype | | type));
267 valueElement.setTextContentTruncatedIfNeeded(description); 267 valueElement.title = description || '';
268 valueElement.title = description; 268 if (Runtime.experiments.isEnabled('objectPreviews') && value.preview && !h idePreview) {
269 var previewFormatter = new Components.RemoteObjectPreviewFormatter();
270 previewFormatter.appendObjectPreview(valueElement, value.preview);
271 } else {
272 valueElement.setTextContentTruncatedIfNeeded(description);
273 }
269 } 274 }
270 275
271 if (wasThrown) { 276 if (wasThrown) {
272 var wrapperElement = createElementWithClass('span', 'error value'); 277 var wrapperElement = createElementWithClass('span', 'error value');
273 wrapperElement.createTextChild('[' + Common.UIString('Exception') + ': '); 278 wrapperElement.createTextChild('[' + Common.UIString('Exception') + ': ');
274 wrapperElement.appendChild(valueElement); 279 wrapperElement.appendChild(valueElement);
275 wrapperElement.createTextChild(']'); 280 wrapperElement.createTextChild(']');
276 return wrapperElement; 281 return wrapperElement;
277 } 282 }
278 valueElement.classList.add('value'); 283 valueElement.classList.add('value');
279 return valueElement; 284 return valueElement;
280 285
281 /** 286 /**
282 * @return {!Element} 287 * @return {!Element}
283 */ 288 */
284 function createUnknownInternalLocationElement() { 289 function createUnknownInternalLocationElement() {
285 var valueElement = createElementWithClass('span'); 290 var valueElement = createElementWithClass('span');
286 valueElement.textContent = '<' + Common.UIString('unknown') + '>'; 291 valueElement.textContent = '<' + Common.UIString('unknown') + '>';
292 valueElement.title = description || '';
287 return valueElement; 293 return valueElement;
288 } 294 }
289 295
290 /** 296 /**
291 * @return {!Element} 297 * @return {!Element}
292 */ 298 */
293 function createStringElement() { 299 function createStringElement() {
294 var valueElement = createElementWithClass('span', 'object-value-string'); 300 var valueElement = createElementWithClass('span', 'object-value-string');
295 valueElement.createChild('span', 'object-value-string-quote').textContent = '"'; 301 valueElement.createChild('span', 'object-value-string-quote').textContent = '"';
296 valueElement.createTextChild('').setTextContentTruncatedIfNeeded(descripti on.replace(/\n/g, '\u21B5')); 302 valueElement.createTextChild('').setTextContentTruncatedIfNeeded(descripti on.replace(/\n/g, '\u21B5'));
297 valueElement.createChild('span', 'object-value-string-quote').textContent = '"'; 303 valueElement.createChild('span', 'object-value-string-quote').textContent = '"';
304 valueElement.title = description || '';
298 return valueElement; 305 return valueElement;
299 } 306 }
300 307
301 /** 308 /**
302 * @return {!Element} 309 * @return {!Element}
303 */ 310 */
304 function createNodeElement() { 311 function createNodeElement() {
305 var valueElement = createElementWithClass('span', 'object-value-node'); 312 var valueElement = createElementWithClass('span', 'object-value-node');
306 Components.DOMPresentationUtils.createSpansForNodeTitle(valueElement, /** @type {string} */ (description)); 313 Components.DOMPresentationUtils.createSpansForNodeTitle(valueElement, /** @type {string} */ (description));
307 valueElement.addEventListener('click', event => { 314 valueElement.addEventListener('click', event => {
308 Common.Revealer.reveal(value); 315 Common.Revealer.reveal(value);
309 event.consume(true); 316 event.consume(true);
310 }, false); 317 }, false);
311 valueElement.addEventListener('mousemove', () => SDK.DOMModel.highlightObj ectAsDOMNode(value), false); 318 valueElement.addEventListener('mousemove', () => SDK.DOMModel.highlightObj ectAsDOMNode(value), false);
312 valueElement.addEventListener('mouseleave', SDK.DOMModel.hideDOMNodeHighli ght, false); 319 valueElement.addEventListener('mouseleave', () => SDK.DOMModel.hideDOMNode Highlight(), false);
313 return valueElement; 320 return valueElement;
314 } 321 }
315 322
316 /** 323 /**
317 * @return {!Element} 324 * @return {!Element}
318 */ 325 */
319 function createNumberWithExponentElement() { 326 function createNumberWithExponentElement() {
320 var valueElement = createElementWithClass('span', 'object-value-number'); 327 var valueElement = createElementWithClass('span', 'object-value-number');
321 var numberParts = description.split('e'); 328 var numberParts = description.split('e');
322 valueElement.createChild('span', 'object-value-scientific-notation-mantiss a').textContent = numberParts[0]; 329 valueElement.createChild('span', 'object-value-scientific-notation-mantiss a').textContent = numberParts[0];
323 valueElement.createChild('span', 'object-value-scientific-notation-exponen t').textContent = 'e' + numberParts[1]; 330 valueElement.createChild('span', 'object-value-scientific-notation-exponen t').textContent = 'e' + numberParts[1];
324 valueElement.classList.add('object-value-scientific-notation-number'); 331 valueElement.classList.add('object-value-scientific-notation-number');
332 valueElement.title = description || '';
325 return valueElement; 333 return valueElement;
326 } 334 }
327 } 335 }
328 336
329 /** 337 /**
330 * @param {!SDK.RemoteObject} object 338 * @param {!SDK.RemoteObject} object
331 * @return {boolean} 339 * @return {boolean}
332 */ 340 */
333 static _needsAlternateTitle(object) { 341 static _needsAlternateTitle(object) {
334 return object && object.hasChildren && !object.customPreview() && object.sub type !== 'node' && 342 return object && object.hasChildren && !object.customPreview() && object.sub type !== 'node' &&
(...skipping 204 matching lines...) Expand 10 before | Expand all | Expand 10 after
539 return; 547 return;
540 548
541 extraProperties = extraProperties || []; 549 extraProperties = extraProperties || [];
542 for (var i = 0; i < extraProperties.length; ++i) 550 for (var i = 0; i < extraProperties.length; ++i)
543 properties.push(extraProperties[i]); 551 properties.push(extraProperties[i]);
544 552
545 Components.ObjectPropertyTreeElement.populateWithProperties( 553 Components.ObjectPropertyTreeElement.populateWithProperties(
546 treeElement, properties, internalProperties, skipProto, targetValue || value, linkifier, emptyPlaceholder); 554 treeElement, properties, internalProperties, skipProto, targetValue || value, linkifier, emptyPlaceholder);
547 } 555 }
548 556
557 var generatePreview = Runtime.experiments.isEnabled('objectPreviews');
549 if (flattenProtoChain) 558 if (flattenProtoChain)
550 value.getAllProperties(false, callback); 559 value.getAllProperties(false, generatePreview, callback);
551 else 560 else
552 SDK.RemoteObject.loadFromObjectPerProto(value, callback); 561 SDK.RemoteObject.loadFromObjectPerProto(value, generatePreview, callback);
553 } 562 }
554 563
555 /** 564 /**
556 * @param {!UI.TreeElement} treeNode 565 * @param {!UI.TreeElement} treeNode
557 * @param {!Array.<!SDK.RemoteObjectProperty>} properties 566 * @param {!Array.<!SDK.RemoteObjectProperty>} properties
558 * @param {?Array.<!SDK.RemoteObjectProperty>} internalProperties 567 * @param {?Array.<!SDK.RemoteObjectProperty>} internalProperties
559 * @param {boolean} skipProto 568 * @param {boolean} skipProto
560 * @param {?SDK.RemoteObject} value 569 * @param {?SDK.RemoteObject} value
561 * @param {!Components.Linkifier=} linkifier 570 * @param {!Components.Linkifier=} linkifier
562 * @param {?string=} emptyPlaceholder 571 * @param {?string=} emptyPlaceholder
(...skipping 211 matching lines...) Expand 10 before | Expand all | Expand 10 after
774 if (this.property.synthetic) 783 if (this.property.synthetic)
775 this.nameElement.classList.add('synthetic-property'); 784 this.nameElement.classList.add('synthetic-property');
776 785
777 this._updatePropertyPath(); 786 this._updatePropertyPath();
778 this.nameElement.addEventListener('contextmenu', this._contextMenuFired.bind (this, this.property), false); 787 this.nameElement.addEventListener('contextmenu', this._contextMenuFired.bind (this, this.property), false);
779 788
780 var separatorElement = createElementWithClass('span', 'object-properties-sec tion-separator'); 789 var separatorElement = createElementWithClass('span', 'object-properties-sec tion-separator');
781 separatorElement.textContent = ': '; 790 separatorElement.textContent = ': ';
782 791
783 if (this.property.value) { 792 if (this.property.value) {
793 var hidePreview = this.property.name === '__proto__';
784 this.valueElement = Components.ObjectPropertiesSection.createValueElementW ithCustomSupport( 794 this.valueElement = Components.ObjectPropertiesSection.createValueElementW ithCustomSupport(
785 this.property.value, this.property.wasThrown, this.listItemElement, th is._linkifier); 795 this.property.value, this.property.wasThrown, this.listItemElement, th is._linkifier, hidePreview);
786 this.valueElement.addEventListener('contextmenu', this._contextMenuFired.b ind(this, this.property), false); 796 this.valueElement.addEventListener('contextmenu', this._contextMenuFired.b ind(this, this.property), false);
787 } else if (this.property.getter) { 797 } else if (this.property.getter) {
788 this.valueElement = Components.ObjectPropertyTreeElement.createRemoteObjec tAccessorPropertySpan( 798 this.valueElement = Components.ObjectPropertyTreeElement.createRemoteObjec tAccessorPropertySpan(
789 this.property.parentObject, [this.property.name], this._onInvokeGetter Click.bind(this)); 799 this.property.parentObject, [this.property.name], this._onInvokeGetter Click.bind(this));
790 } else { 800 } else {
791 this.valueElement = createElementWithClass('span', 'object-value-undefined '); 801 this.valueElement = createElementWithClass('span', 'object-value-undefined ');
792 this.valueElement.textContent = Common.UIString('<unreadable>'); 802 this.valueElement.textContent = Common.UIString('<unreadable>');
793 this.valueElement.title = Common.UIString('No property getter'); 803 this.valueElement.title = Common.UIString('No property getter');
794 } 804 }
795 805
(...skipping 363 matching lines...) Expand 10 before | Expand all | Expand 10 after
1159 } 1169 }
1160 1170
1161 /** 1171 /**
1162 * @param {?SDK.RemoteObject} arrayFragment 1172 * @param {?SDK.RemoteObject} arrayFragment
1163 * @param {boolean=} wasThrown 1173 * @param {boolean=} wasThrown
1164 * @this {Components.ArrayGroupingTreeElement} 1174 * @this {Components.ArrayGroupingTreeElement}
1165 */ 1175 */
1166 function processArrayFragment(arrayFragment, wasThrown) { 1176 function processArrayFragment(arrayFragment, wasThrown) {
1167 if (!arrayFragment || wasThrown) 1177 if (!arrayFragment || wasThrown)
1168 return; 1178 return;
1169 arrayFragment.getAllProperties(false, processProperties.bind(this)); 1179 arrayFragment.getAllProperties(
1180 false, Runtime.experiments.isEnabled('objectPreviews'), processPropert ies.bind(this));
1170 } 1181 }
1171 1182
1172 /** @this {Components.ArrayGroupingTreeElement} */ 1183 /** @this {Components.ArrayGroupingTreeElement} */
1173 function processProperties(properties, internalProperties) { 1184 function processProperties(properties, internalProperties) {
1174 if (!properties) 1185 if (!properties)
1175 return; 1186 return;
1176 1187
1177 properties.sort(Components.ObjectPropertiesSection.CompareProperties); 1188 properties.sort(Components.ObjectPropertiesSection.CompareProperties);
1178 for (var i = 0; i < properties.length; ++i) { 1189 for (var i = 0; i < properties.length; ++i) {
1179 properties[i].parentObject = this._object; 1190 properties[i].parentObject = this._object;
(...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after
1217 } 1228 }
1218 1229
1219 /** 1230 /**
1220 * @param {?SDK.RemoteObject} arrayFragment 1231 * @param {?SDK.RemoteObject} arrayFragment
1221 * @param {boolean=} wasThrown 1232 * @param {boolean=} wasThrown
1222 * @this {Components.ArrayGroupingTreeElement} 1233 * @this {Components.ArrayGroupingTreeElement}
1223 */ 1234 */
1224 function processObjectFragment(arrayFragment, wasThrown) { 1235 function processObjectFragment(arrayFragment, wasThrown) {
1225 if (!arrayFragment || wasThrown) 1236 if (!arrayFragment || wasThrown)
1226 return; 1237 return;
1227 arrayFragment.getOwnProperties(processProperties.bind(this)); 1238 arrayFragment.getOwnProperties(Runtime.experiments.isEnabled('objectPrevie ws'), processProperties.bind(this));
1228 } 1239 }
1229 1240
1230 /** 1241 /**
1231 * @param {?Array.<!SDK.RemoteObjectProperty>} properties 1242 * @param {?Array.<!SDK.RemoteObjectProperty>} properties
1232 * @param {?Array.<!SDK.RemoteObjectProperty>=} internalProperties 1243 * @param {?Array.<!SDK.RemoteObjectProperty>=} internalProperties
1233 * @this {Components.ArrayGroupingTreeElement} 1244 * @this {Components.ArrayGroupingTreeElement}
1234 */ 1245 */
1235 function processProperties(properties, internalProperties) { 1246 function processProperties(properties, internalProperties) {
1236 if (!properties) 1247 if (!properties)
1237 return; 1248 return;
(...skipping 127 matching lines...) Expand 10 before | Expand all | Expand 10 after
1365 } 1376 }
1366 var treeOutlineId = treeElement.treeOutline[Components.ObjectPropertiesSecti onExpandController._treeOutlineId]; 1377 var treeOutlineId = treeElement.treeOutline[Components.ObjectPropertiesSecti onExpandController._treeOutlineId];
1367 result = treeOutlineId + (result ? ':' + result : ''); 1378 result = treeOutlineId + (result ? ':' + result : '');
1368 treeElement[Components.ObjectPropertiesSectionExpandController._cachedPathSy mbol] = result; 1379 treeElement[Components.ObjectPropertiesSectionExpandController._cachedPathSy mbol] = result;
1369 return result; 1380 return result;
1370 } 1381 }
1371 }; 1382 };
1372 1383
1373 Components.ObjectPropertiesSectionExpandController._cachedPathSymbol = Symbol('c achedPath'); 1384 Components.ObjectPropertiesSectionExpandController._cachedPathSymbol = Symbol('c achedPath');
1374 Components.ObjectPropertiesSectionExpandController._treeOutlineId = Symbol('tree OutlineId'); 1385 Components.ObjectPropertiesSectionExpandController._treeOutlineId = Symbol('tree OutlineId');
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698