181818 2018-01-18 16:36:42 -0800 CSS resize handle can be covered by child (composited) elements 2023-04-18 13:03:35 -0700 1 1 1 Unclassified WebKit CSS WebKit Local Build Unspecified Unspecified NEW InRadar P2 Normal --- 1 roko.cb webkit-unassigned ahmad.saleem792 simon.fraser timdream webkit-bug-importer zalan oldest_to_newest 1390706 0 roko.cb 2018-01-18 16:36:42 -0800 # CSS `resize: both` handler issue ### Issue: Parent CSS `resize` handler is shadowed by child element. (On Firefox it works. Handler is visible (painted on a higher Z-index layer) and receiver resize events). ### Description: Resize handler shadowed by Canvas element (Similar to [144526](https://bugs.webkit.org/show_bug.cgi?id=144526) but regardless of absolute positioning) ### Test case: https://jsfiddle.net/tqqhpa0f/1/ 1. Handler not visible. 2. Even if not visible, when overlayed by IMG (see jsfiddle) it receives resize events. 3. When canvas element is child of our `resize` parent - the handler is not visible (like in IMG case) but it doesn't receives any events. 1391710 1 webkit-bug-importer 2018-01-22 10:38:03 -0800 <rdar://problem/36739743> 1873414 2 ahmad.saleem792 2022-06-01 16:04:03 -0700 I am still able to reproduce this from attached JSFiddle in Comment 01 using Safari 15.5 on macOS 12.4. I am unable to resize "red" canvas but when I expand, I can see yellow <div> and it can be resize. All other browsers like Chrome Canary 104 and Firefox Nightly 103 are able to resize "red canvas' as well. Thanks! 1949559 3 465972 timdream 2023-04-18 13:03:35 -0700 Created attachment 465972 test case Test case for the canvas case. 465972 2023-04-18 13:03:35 -0700 2023-04-18 13:03:35 -0700 test case resizer.html text/html 1018 timdream PHN0eWxlPgoKZGl2IHsKICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgLjIpOwog ICAgd2lkdGg6IDMwMHB4OwogICAgaGVpZ2h0OiAzMDBweDsKICAgIC8qIHBhZGRpbmc6IDEwcHg7 ICovCn0KCmJvZHkgPiBkaXYgewogICAgbWFyZ2luOiAxMHB4Owp9CgoucmVzaXphYmxlIHsKICAg IG92ZXJmbG93OiBoaWRkZW47CiAgICByZXNpemU6IGJvdGg7Cn0KCjwvc3R5bGU+CgoKPGRpdiBp ZD1kaXYxIGNsYXNzPXJlc2l6YWJsZT4KICAgIFBsYWluIHJlc2l6ZSB3b3Jrcwo8L2Rpdj4KCjwh LS0gPGRpdiBpZD1kaXYyIGNsYXNzPXJlc2l6YWJsZT4KICAgIDxkaXYgc3R5bGU9InRvdWNoLWFj dGlvbjogbm9uZTsiIG9ucG9pbnRlcmRvd249ImV2ZW50LnByZXZlbnREZWZhdWx0KCkiPgogICAg ICAgIHRvdWNoLWFjdGlvbjogbm9uZTsKICAgIDwvZGl2Pgo8L2Rpdj4gLS0+Cgo8ZGl2IGlkPWRp djMgY2xhc3M9cmVzaXphYmxlPgogICAgPGNhbnZhcyBpZD0iZ2xjYW52YXMiIHdpZHRoPSIzMDAi IGhlaWdodD0iMzAwIj48L2NhbnZhcz4KPC9kaXY+Cgo8c2NyaXB0PgogICAgY29uc3QgY2FudmFz ID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoImdsY2FudmFzIik7CiAgICBjb25zdCBnbCA9IGNh bnZhcy5nZXRDb250ZXh0KCJ3ZWJnbCIpOwogICAgZ2wuY2xlYXJDb2xvcigxLjAsIDEuMCwgMC4w LCAxLjApOwogICAgZ2wuY2xlYXIoZ2wuQ09MT1JfQlVGRkVSX0JJVCk7Cjwvc2NyaXB0PgoKPGRp diBpZD1kaXY0IGNsYXNzPXJlc2l6YWJsZT4KICAgIDxjYW52YXMgaWQ9ImNhbnZhczJkIiB3aWR0 aD0iMzAwIiBoZWlnaHQ9IjMwMCI+PC9jYW52YXM+CjwvZGl2PgoKPHNjcmlwdD4KICAgIGNvbnN0 IGNhbnZhczJkID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoImNhbnZhczJkIik7CiAgICBjb25z dCBjdHggPSBjYW52YXMyZC5nZXRDb250ZXh0KCIyZCIpOwogICAgY3R4LmZpbGxTdHlsZSA9ICJy ZWQiOwogICAgY3R4LmZpbGxSZWN0KDAsIDAsIDMwMCwgMzAwKTsKPC9zY3JpcHQ+Cg==