nephele
/
haikuwebkit
1
0
Fork 0
Code Issues Releases Activity
haikuwebkit/LayoutTests/fast/images/exif-orientation-background...

90 lines
2.8 KiB
HTML
Raw Permalink Normal View History

EXIF orientation is ignored for some CSS images https://bugs.webkit.org/show_bug.cgi?id=203355 Patch by Said Abou-Hallawa <sabouhallawa@apple.com> on 2020-01-20 Reviewed by Simon Fraser. Source/WebCore: Unlike GraphicsContext::drawNativeImage(), GraphicsContext::drawPattern() can't change the coordinates system before drawing the image to respect the EXIF orientation. Drawing a pattern tries to fill the destination rectangle with the image according to the GraphicsContext origin and the direction of its axes. So we need to create temporary NativeImage with respecting the EXIF orientation and then use it to draw the pattern. Tests: fast/images/exif-orientation-background-image-no-repeat.html fast/images/exif-orientation-background-image-repeat.html fast/images/exif-orientation-border-image.html * platform/graphics/BitmapImage.cpp: (WebCore::BitmapImage::nativeImageForCurrentFrameRespectingOrientation): (WebCore::BitmapImage::drawPattern): * platform/graphics/BitmapImage.h: * platform/graphics/Image.h: (WebCore::Image::nativeImage): (WebCore::Image::nativeImageForCurrentFrameRespectingOrientation): (WebCore::Image::nativeImageOfSize): * platform/graphics/ImageBuffer.h: * platform/graphics/cg/GraphicsContextCG.cpp: (WebCore::GraphicsContext::drawPattern): * platform/graphics/cg/NativeImageCG.cpp: (WebCore::drawNativeImage): * rendering/style/NinePieceImage.cpp: (WebCore::NinePieceImage::paint const): LayoutTests: * fast/images/exif-orientation-background-image-no-repeat-expected.html: Added. * fast/images/exif-orientation-background-image-no-repeat.html: Added. * fast/images/exif-orientation-background-image-repeat-expected.html: Added. * fast/images/exif-orientation-background-image-repeat.html: Added. * fast/images/exif-orientation-border-image-expected.html: Added. * fast/images/exif-orientation-border-image.html: Added. Canonical link: https://commits.webkit.org/219578@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@254841 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-01-21 02:54:22 +00:00
<!DOCTYPE html>
<style>
div.container {
display: inline-block;
margin-right: 20px;
margin-bottom: 10px;
width: 100px;
vertical-align: top;
}
div.box {
width: 100px;
height:100px;
border: 1px solid black;
}
img {
display: block;
[ iOS wk2 ] fast/images/exif-orientation-background-image-repeat.html is flaky failing. <rdar://problem/60921187> Unreviewed test gardening. Add "image-rendering: pixelated;" to the elements which render images to avoid unintended anti-aliasing. * fast/images/exif-orientation-background-image-repeat-expected.html: * fast/images/exif-orientation-background-image-repeat.html: Canonical link: https://commits.webkit.org/222855@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@259434 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-04-03 00:19:20 +00:00
image-rendering: pixelated;
EXIF orientation is ignored for some CSS images https://bugs.webkit.org/show_bug.cgi?id=203355 Patch by Said Abou-Hallawa <sabouhallawa@apple.com> on 2020-01-20 Reviewed by Simon Fraser. Source/WebCore: Unlike GraphicsContext::drawNativeImage(), GraphicsContext::drawPattern() can't change the coordinates system before drawing the image to respect the EXIF orientation. Drawing a pattern tries to fill the destination rectangle with the image according to the GraphicsContext origin and the direction of its axes. So we need to create temporary NativeImage with respecting the EXIF orientation and then use it to draw the pattern. Tests: fast/images/exif-orientation-background-image-no-repeat.html fast/images/exif-orientation-background-image-repeat.html fast/images/exif-orientation-border-image.html * platform/graphics/BitmapImage.cpp: (WebCore::BitmapImage::nativeImageForCurrentFrameRespectingOrientation): (WebCore::BitmapImage::drawPattern): * platform/graphics/BitmapImage.h: * platform/graphics/Image.h: (WebCore::Image::nativeImage): (WebCore::Image::nativeImageForCurrentFrameRespectingOrientation): (WebCore::Image::nativeImageOfSize): * platform/graphics/ImageBuffer.h: * platform/graphics/cg/GraphicsContextCG.cpp: (WebCore::GraphicsContext::drawPattern): * platform/graphics/cg/NativeImageCG.cpp: (WebCore::drawNativeImage): * rendering/style/NinePieceImage.cpp: (WebCore::NinePieceImage::paint const): LayoutTests: * fast/images/exif-orientation-background-image-no-repeat-expected.html: Added. * fast/images/exif-orientation-background-image-no-repeat.html: Added. * fast/images/exif-orientation-background-image-repeat-expected.html: Added. * fast/images/exif-orientation-background-image-repeat.html: Added. * fast/images/exif-orientation-border-image-expected.html: Added. * fast/images/exif-orientation-border-image.html: Added. Canonical link: https://commits.webkit.org/219578@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@254841 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2020-01-21 02:54:22 +00:00
}
</style>
<body>
<b>The CSS background images should be rotated respecting their EXIF orientation.</b>
<br>
<br>
<div class="container">
<div class="box">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Normal
</div>
<div class="container">
<div class="box" style="transform: scaleX(-1);">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Flipped horizontally
</div>
<div class="container">
<div class="box" style="transform: rotate(180deg);">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Rotated 180&deg;
</div>
<div class="container">
<div class="box" style="transform: scaleX(-1) rotate(180deg);">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Flipped vertically
</div>
<br>
<div class="container">
<div class="box" style="transform: rotate(90deg) scaleY(-1);">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Rotated 90&deg; CCW and flipped vertically
</div>
<div class="container">
<div class="box" style="transform: rotate(90deg);">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Rotated 90&deg; CCW
</div>
<div class="container">
<div class="box" style="transform: rotate(270deg) scaleY(-1);">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Rotated 90&deg; CW and flipped vertically
</div>
<div class="container">
<div class="box" style="transform: rotate(270deg);">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Rotated 90&deg; CW
</div>
<br>
<div class="container">
<div class="box">
<img src="resources/exif-orientation-1-ul.jpg">
<img src="resources/exif-orientation-1-ul.jpg">
</div>
<br>Undefined (invalid value)
</div>
</body>