Bug 1531532. Use preTranslate instead of postTranslate when correcting for the mask offset. r=mattwoodrow

DTO = DrawTargetOffset = (-Origin.x, -Origin.y)
CTM = CurrentTransform
MASKT = MaskTransform = Inv(CurrentTransform)
MASKO = MaskOffset = (GetRect().x, GetRect().y)

The transform to device space is:

MASKT * CTM * DTO

Currently we do:
MASKT = MASKT * MASKO

Which gives us MASKT * MASKO * CTM * DTO. This works fine if there's no scale but
will not properly cancel out if there is.

I believe we want:
MASKO * MASKT * CTM * DTO

To get this we need to preTranslate instead of postTranslate.

Differential Revision: https://phabricator.services.mozilla.com/D21604
This commit is contained in:
Jeff Muizelaar 2019-03-04 22:30:06 -05:00
parent 3f385ffa33
commit 967d03ef66
4 changed files with 55 additions and 1 deletions

View File

@ -1840,7 +1840,7 @@ void DrawTargetSkia::PushLayerWithBlend(bool aOpaque, Float aOpacity,
SkMatrix clipMatrix;
GfxMatrixToSkiaMatrix(aMaskTransform, clipMatrix);
if (aMask) {
clipMatrix.postTranslate(aMask->GetRect().X(), aMask->GetRect().Y());
clipMatrix.preTranslate(aMask->GetRect().X(), aMask->GetRect().Y());
}
SkCanvas::SaveLayerRec saveRec(

View File

@ -0,0 +1,20 @@
<meta charset="utf-8">
<style>
body { overflow:hidden }
p {
margin: 1em 0;
padding: 1.4em;
font: 900 1.2em sans-serif;
position:absolute;
color: rgba(0,0,0,0);
background: red;
border: black solid 80px;
transform: scale(2,0.3);
transform-origin: center;
left: 330px;
top: -75px;
}
</style>
<p></p>

View File

@ -0,0 +1,31 @@
<meta charset="utf-8">
<style>
body { overflow: hidden }
p {
margin: 1em 0;
padding: 1.4em;
font: 900 1.2em sans-serif;
position:absolute;
color: rgba(0,0,0,0);
}
.text {
background: red;
-webkit-background-clip: text;
background-clip: text;
transform: scale(20,2);
transform-origin: center;
left: 400px;
}
.wrapper {
border: black solid 80px;
transform: scale(2,0.3);
transform-origin: center;
left: 330px;
top: -75px;
}
</style>
<p class="text"></p>
<p class="wrapper"></p>

View File

@ -185,3 +185,6 @@ fuzzy-if(winWidget,0-102,0-2032) fuzzy-if(skiaContent,0-102,0-2811) fuzzy-if(web
fuzzy-if(winWidget,0-102,0-2032) fuzzy-if(skiaContent,0-102,0-2811) fuzzy-if(webrender&&winWidget,153-153,2866-2866) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == background-clip-text-1e.html background-clip-text-1-ref.html # Bug 1392106
random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == background-clip-text-2.html background-clip-text-2-ref.html # Bug 1392106
# this is unexplicably fuzzy on linux. the red background also shows up as rgb(252,13,27) for some reason
fuzzy-if(webrender&&gtkWidget,36-36,138-138) == background-clip-text-scale.html background-clip-text-scale-ref.html