http://crbug.com/166134 Steps to reproduce the problem: 1. Use console.log for logging an object. 2. Observe that the state of the object at the moment of logging is logged in italics. 3. Expand the object in the log with a mouse click. The state of the object is shown at the moment of expanding, not in italics. Become confused if you do not know about rationale behind the behavior. What is the expected behavior? Explain the meaning of italics and why is the state of the object shown at the moment of expanding and not at the moment of logging. Just a tiny informational icon with a hover popup would be enough. What went wrong? Developers without prior knowledge of the meaning of italics in console.log output, have a reason to believe that console.log shows the state at the time of logging and the expanding is only created to make the output manageble. Did this work before? Yes Before issue 50316 was fixed the situation was more confusing, but at least it was obviously confusing and wrong, so the developer would notice that. After issue 50316 has been fixed, it is now subtly confusing.
Created attachment 184419 [details] Patch
Created attachment 184420 [details] Screenshot of the feature
Comment on attachment 184419 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=184419&action=review > Source/WebCore/inspector/front-end/ConsoleMessage.js:308 > + var note = section.element.querySelector(".header > .title").createChild("span", "object-info-state-note"); You should not reach out for ObjectPropertiesSection internals from here - it is better to have this code in the object properties section itself. You can add ObjectPropertiesSection.prototype.showExpansionHint(enabled) to control it from here, default it to false. > Source/WebCore/inspector/front-end/inspector.css:1216 > + display: none; We try to be minimalistic wrt styles - sounds like alignment ones are not needed here. > Source/WebCore/inspector/front-end/inspector.css:1224 > + font-size: 10px; We typically inherit font proeprties.
Comment on attachment 184420 [details] Screenshot of the feature I'd move hint box one pixel up and two pixels to the left + bump "i" 1 pixel up. You might also want to add text shadow for it.
Created attachment 184442 [details] Patch
Created attachment 184444 [details] Updated screenshot
(In reply to comment #3) > (From update of attachment 184419 [details]) > View in context: https://bugs.webkit.org/attachment.cgi?id=184419&action=review > > > Source/WebCore/inspector/front-end/ConsoleMessage.js:308 > > + var note = section.element.querySelector(".header > .title").createChild("span", "object-info-state-note"); > > You should not reach out for ObjectPropertiesSection internals from here - it is better to have this code in the object properties section itself. You can add ObjectPropertiesSection.prototype.showExpansionHint(enabled) to control it from here, default it to false. It exposed on the same level as section.element (now I made it clear by removing querySelector) which this code already uses. So I don't think it's violation of encapsulation. > > Source/WebCore/inspector/front-end/inspector.css:1216 > > + display: none; > > We try to be minimalistic wrt styles - sounds like alignment ones are not needed here. Removed vertical-align. text-align is essential. > > Source/WebCore/inspector/front-end/inspector.css:1224 > > + font-size: 10px; > > We typically inherit font proeprties. Didn't get what are you suggesting. Inherited value is 11px. So I need make font smaller or enlarge the box.
Comment on attachment 184442 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=184442&action=review Slightly adjusted style below. Otherwise looks good. > Source/WebCore/inspector/front-end/inspector.css:1215 > +.object-info-state-note { Here is my version (round balloon): width: 12px; height: 12px; background-color: rgb(179, 203, 247); color: white; text-align: center; border-radius: 5px; line-height: 13px; margin: 0 8px;
Comment on attachment 184442 [details] Patch Attachment 184442 [details] did not pass chromium-ews (chromium-xvfb): Output: http://queues.webkit.org/results/16080877 New failing tests: inspector/console/console-tests.html inspector/console/console-log-document-proto.html inspector/console/console-external-array.html inspector/console/console-log-toString-object.html inspector/console/console-big-array.html inspector/console/console-eval-syntax-error.html inspector/console/console-message-format.html inspector/console/console-format.html inspector/console/console-object-constructor-name.html inspector/console/console-dir.html inspector/console/console-eval-undefined-override.html inspector/console/console-dirxml.html inspector/console/console-object-preview.html inspector/console/console-format-collections.html
Created attachment 184669 [details] Patch
Created attachment 184670 [details] Updated screenshot
Comment on attachment 184669 [details] Patch Rejecting attachment 184669 [details] from commit-queue. Failed to run "['/mnt/git/webkit-commit-queue/Tools/Scripts/webkit-patch', '--status-host=queues.webkit.org', '--bot-id=gce-cq-03', 'apply-attachment', '--no-update', '--non-interactive', 184669, '--port=chromium-xvfb']" exit_code: 2 cwd: /mnt/git/webkit-commit-queue Last 500 characters of output: webkit-commit-queue Parsed 4 diffs from patch file(s). patch: **** Can't create file /tmp/ppSAsOFf : No space left on device patch: **** Can't create file /tmp/ppZm1GVf : No space left on device patch: **** Can't create file /tmp/ppkY8lre : No space left on device patch: **** Can't create file /tmp/ppEgfH4d : No space left on device Failed to run "[u'/mnt/git/webkit-commit-queue/Tools/Scripts/svn-apply', '--force', '--reviewer', 'Pavel Feldman']" exit_code: 2 cwd: /mnt/git/webkit-commit-queue Full output: http://queues.webkit.org/results/16122141
Comment on attachment 184669 [details] Patch Rejecting attachment 184669 [details] from commit-queue. Failed to run "['/mnt/git/webkit-commit-queue/Tools/Scripts/webkit-patch', '--status-host=queues.webkit.org', '--bot-id=gce-cq-03', 'apply-attachment', '--no-update', '--non-interactive', 184669, '--port=chromium-xvfb']" exit_code: 2 cwd: /mnt/git/webkit-commit-queue Last 500 characters of output: webkit-commit-queue Parsed 4 diffs from patch file(s). patch: **** Can't create file /tmp/ppWivw1O : No space left on device patch: **** Can't create file /tmp/ppMKFNdP : No space left on device patch: **** Can't create file /tmp/ppgPhXRO : No space left on device patch: **** Can't create file /tmp/ppQEj7iN : No space left on device Failed to run "[u'/mnt/git/webkit-commit-queue/Tools/Scripts/svn-apply', '--force', '--reviewer', 'Pavel Feldman']" exit_code: 2 cwd: /mnt/git/webkit-commit-queue Full output: http://queues.webkit.org/results/16123124
Comment on attachment 184669 [details] Patch Rejecting attachment 184669 [details] from commit-queue. New failing tests: inspector/console/console-tests.html inspector/console/console-log-document-proto.html inspector/console/console-external-array.html inspector/console/console-log-toString-object.html inspector/console/console-big-array.html inspector/console/console-eval-syntax-error.html inspector/console/console-message-format.html inspector/console/console-format.html inspector/console/console-object-constructor-name.html inspector/console/console-dir.html inspector/console/console-eval-undefined-override.html inspector/console/console-dirxml.html inspector/console/console-object-preview.html inspector/console/console-format-collections.html Full output: http://queues.webkit.org/results/16120230
Created attachment 184718 [details] Patch
Comment on attachment 184718 [details] Patch Clearing flags on attachment: 184718 Committed r140813: <http://trac.webkit.org/changeset/140813>
All reviewed patches have been landed. Closing bug.