Bug 216111

Created attachment 407843 [details] Left is applying filter on an img node, right is applying filter on a background-image There is a test case, fast/filter-image/background-filter-image.html that is testing the result of rendering background-image with filters. However there is a problem where current WebKit doesn't render the background image on Retina screens properly. In this test, background-filter-image.html uses background-image: filter(url(../replaced/resources/compass.jpg), sepia(1)); to apply a sepia filter on the background image of a div; we are comparing against the reference test, fast/filter-image/background-filter-image-expected.html, which is just applying a sepia filter on a img node. img { width: 100px; height: 100px; filter: sepia(1); } <img src="../replaced/resources/compass.jpg"> I have included a screenshot of the comparison: on the left we can see a sharp image, which is from fast/filter-image/background-filter-image-expected.html; on the right is a lower quality image from fast/filter-image/background-filter-image.html. Seems that we didn't upscale the image on retina screens when rendering background-image