Bug 289023 – CSS property image-rendering:pixelated does not work on background-image when a border is set

• Component: Layout and Rendering
• Status: NEW

Created attachment 474401 [details]
Screenshot of the example HTML file in Safari TP

1. Give a <div> 

The image is interpolated when upscaled, thus looking blurry.

It should have been interpolated with nearest neighbor and the individual pixels should remain distinct.

This is reproduced on iOS Safari and Safari TP on macOS. Not reproduced on stable Chrome and stable Firefox.

Created attachment 474402 [details]
Not reproduced, Chrome Canary

Created attachment 474403 [details]
HTML minimal reproducible example

My bad, pressed submit too early.

Steps to reproduce:
1. Create two <div>s with a low-res background image.
2. Add image-rendering: pixelated to both of them.
3. Add a border to one of them.
4. Compare result.

[Karl Dubost]

this is happening even with 

```
.border {
    border: 0.0000000000001px solid #242424;
}
```

[Radar WebKit Bug Importer]

<rdar://problem/146704372>