Bug 123742 - Fix outline not rendering for composited divs with overflow:hidden
Summary: Fix outline not rendering for composited divs with overflow:hidden
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Compositing (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2013-11-04 08:45 PST by Mihai Maerean
Modified: 2024-03-04 17:57 PST (History)
6 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Mihai Maerean 2013-11-04 08:45:58 PST 
The following div is rendered without the outline when compositing is activated using the transform property.
<div style="overflow:hidden; outline:solid 1px green; -webkit-transform:translateZ(1px);">text</div>

The outline is rendered when the overflow property is removed.

Removing the transform property causes the outline to be rendered no matter if the overflow property is present or not.

None of this happens if the overflow property is replaced with a box-shadow property.
If there is an outline and a box-shadow that is smaller than the outline, the visible outline is clipped to the rectangle of the box-shadow.
Comment 1 Ahmad Saleem 2024-01-02 09:23:24 PST 
https://jsfiddle.net/h4orw0kf/1/show

I am not able to reproduce this bug in Safari 17.2.1. All other browsers (Chrome Canary 122 and Firefox Nightly 123) have outline similar to Safari.