Bug 223288

Summary: Web Inspector: REGRESSION(r271348): Console: message source code location is not vertically aligned with containing function name
Product: WebKit Reporter: Devin Rousso <hi>
Component: Web InspectorAssignee: Nikita Vasilyev <nvasilyev>
Status: RESOLVED FIXED    
Severity: Normal CC: hi, inspector-bugzilla-changes, nvasilyev, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: WebKit Nightly Build   
Hardware: All   
OS: All   
Attachments:
Description Flags
[Image] screenshot of issue
none
Patch
none
[Image] With patch applied none

Description Devin Rousso 2021-03-16 15:52:11 PDT 
Created attachment 423409 [details]
[Image] screenshot of issue

# STEPS TO REPRODUCE
1. inspect <https://webkit.org>
2. set a breakpoint on global.js:4
3. edit the breakpoint and add an Evaluate JavaScript action for `console.log("test")`
4. reload the page
Comment 1 Radar WebKit Bug Importer 2021-03-16 15:52:36 PDT 
<rdar://problem/75498577>
Comment 2 Nikita Vasilyev 2021-03-17 14:08:22 PDT 
WebKit's inline-block behavior has changed in https://trac.webkit.org/changeset/271348/webkit, introduced this bug in Web Inspector.
Comment 3 Nikita Vasilyev 2021-03-17 14:10:50 PDT 
Shorter reduction:
1. Open data:text/html,<script>console.log("test")</script>
2. Open Console
Comment 4 Nikita Vasilyev 2021-03-18 09:48:19 PDT 
Created attachment 423608 [details]
Patch
Comment 5 Nikita Vasilyev 2021-03-18 09:48:54 PDT 
Created attachment 423609 [details]
[Image] With patch applied
Comment 6 Devin Rousso 2021-03-18 10:34:52 PDT 
Comment on attachment 423608 [details]
Patch

rs=me
Comment 7 Devin Rousso 2021-03-18 10:35:33 PDT 
Comment on attachment 423608 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=423608&action=review

> Source/WebInspectorUI/UserInterface/Views/ConsoleMessageView.css:284
> +    vertical-align: text-top;

Why not `middle` or `bottom`?
Comment 8 Nikita Vasilyev 2021-03-18 11:00:37 PDT 
Comment on attachment 423608 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=423608&action=review

>> Source/WebInspectorUI/UserInterface/Views/ConsoleMessageView.css:284
>> +    vertical-align: text-top;
> 
> Why not `middle` or `bottom`?

With `middle`, the text is misaligned at negative zoom.
With `bottom`, the text is misaligned even at 100% zoom.
Comment 9 EWS 2021-03-18 11:45:20 PDT 
Committed r274656: <https://commits.webkit.org/r274656>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 423608 [details].