RESOLVED FIXED 242338
Web Inspector: Styles: CSS documentation popover is needlessly persistent with broken background 
https://bugs.webkit.org/show_bug.cgi?id=242338
Summary Web Inspector: Styles: CSS documentation popover is needlessly persistent wit...
Razvan Caliman
Reported 2022-07-05 05:33:39 PDT
The pop-up for CSS documentation remains visible while clicking in the CSS value field. Clicking on an inline swatch in the same value field causes another pop-up to show. The CSS documentation pop-up is not hidden automatically. Steps to reproduce: - Load the attached test case - Inspect the `<body>` element - In the Styles panel, click the "info" icon next to a CSS declaration to open the CSS documentation pop-up. - For the same CSS declaration, click the "equals" next to the CSS variable to see its resolved value. Result: Both pop-ups are visible. The documentation pop-up looks broken because its background image is sourced from the same canvas context used for all visible pop-ups. As the pop-up for an inline swatch is drawn, its background is shared with the other visible pop-up. ``` https://searchfox.org/wubkat/rev/3db59430108ca0e3f01ec4d6ac7adbc8ec6fa7c4/Source/WebInspectorUI/UserInterface/Views/Popover.js#425 ``` let context = document.getCSSCanvasContext("2d", "popover", scaledWidth, scaledHeight); ``` https://searchfox.org/wubkat/rev/3db59430108ca0e3f01ec4d6ac7adbc8ec6fa7c4/Source/WebInspectorUI/UserInterface/Views/Popover.css#38 ``` .popover { ... background-image: -webkit-canvas(popover); } This shared context is by design: https://webkit.org/blog/176/css-canvas-drawing/ "All objects that observe a CSS canvas of the same name are sharing that canvas."
Attachments
test case (1.06 KB, text/html)
2022-07-05 05:34 PDT, Razvan Caliman 		no flags
Details
Video of issue (725.99 KB, video/mp4)
2022-07-05 05:35 PDT, Razvan Caliman 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2022-07-05 05:34:26 PDT
<rdar://problem/96433005>
Razvan Caliman
Comment 2 2022-07-05 05:34:43 PDT
Created attachment 460678 [details] test case
Razvan Caliman
Comment 3 2022-07-05 05:35:11 PDT
Created attachment 460679 [details] Video of issue
Razvan Caliman
Comment 4 2022-07-05 05:59:34 PDT
Pull request: https://github.com/WebKit/WebKit/pull/2076
EWS
Comment 5 2022-07-06 05:50:52 PDT
Committed 252175@main (a56e4283f9a6): <https://commits.webkit.org/252175@main> Reviewed commits have been landed. Closing PR #2076 and removing active labels.
Note You need to log in before you can comment on or make changes to this bug.