Position of WebGL <canvas> on iOS is incorrect with CSS borders
https://bugs.webkit.org/show_bug.cgi?id=156790
Patch by Antoine Quint <graouts@apple.com> on 2016-06-06
Reviewed by Simon Fraser.
Source/WebKit2:
WebGL layers on iOS are hosted by a WKRemoteView, which applies a transform scaling
its content by the inverse of the device pixel ratio, which affects how positions are
applied to the WebGL layer. The container layer of the layer hosted by a WKRemoteView
then has an inverse transform applied to it in the PlatformCALayerRemoteCustom
constructor. However, the position of a CALayer is not affected by its transform.
The fix for <rdar://problem/18316542> should be specific to video, so we only apply the
scaling in the case of a LayerTypeAVPlayerLayer.
* UIProcess/ios/RemoteLayerTreeHostIOS.mm:
(-[WKRemoteView initWithFrame:contextID:]):
(WebKit::RemoteLayerTreeHost::createLayer):
(-[WKRemoteView initWithFrame:contextID:hostingDeviceScaleFactor:]): Deleted.
* WebProcess/WebPage/mac/PlatformCALayerRemoteCustom.mm:
(WebKit::PlatformCALayerRemoteCustom::PlatformCALayerRemoteCustom):
LayoutTests:
Adding new tests checking that CSS border, box-shadow and padding properties used on a
WebGL <canvas> element correctly affect the position of the WebGL content.
* webgl/webgl-border-expected.html: Added.
* webgl/webgl-border.html: Added.
* webgl/webgl-box-shadow-expected.html: Added.
* webgl/webgl-box-shadow.html: Added.
* webgl/webgl-padding-expected.html: Added.
* webgl/webgl-padding.html: Added.
git-svn-id: http://svn.webkit.org/repository/webkit/trunk@201727 268f45cc-cd09-0410-ab3c-d52691b4dbfc
diff --git a/LayoutTests/webgl/webgl-border-expected.html b/LayoutTests/webgl/webgl-border-expected.html
new file mode 100644
index 0000000..498eeaf
--- /dev/null
+++ b/LayoutTests/webgl/webgl-border-expected.html
@@ -0,0 +1,14 @@
+<head>
+ <meta name="viewport" content="width=device-width">
+ <style>
+
+ div {
+ width: 100px;
+ height: 100px;
+ background-color: black;
+ border: 20px solid blue;
+ }
+
+ </style>
+</head>
+<div></div>
