I am noticing in some cases the drop-shadow is not rendered completely accurately. I attached an example where you can see there is a bit of space between the two images in the browser but they almost overlap in the rendered PDF. This is using the latest snapshot code from `prince-20170320-ubuntu16.04`.

PS I would like to say thank you again for adding support for native effects rendering. So far it has been going wonderfully and this is the first minor issue I've seen in quite a while!

1. test.html‎ 3.0 kB
2. test.pdf‎ 226.9 kB

Thanks, we will investigate this issue.

Have you had any progress in fixing this in the last few days?

This looks like it may not be a simple fix, but we will do some further investigation next week; this week we have been finishing up support for SVG masks among other things.

Do you have an update for this?

Yes, could you try the latest build? It includes some changes to filters and rasterisation.

Using the snapshot prince-20170522-ubuntu16.04-amd64 I don't see much improvement. It also seems like some of the corners look worse with the newer build. Notice in a browser there is no rounding on those corners at all. I added a new tests.html since the signed urls on the old one have expired.

1. test 2.pdf‎ 226.8 kB
2. test.html‎ 3.0 kB

The latest snapshot included a change to truncate fractional pixel offsets in the drop-shadow filter. That matches browser behaviour (from testing).

The test case tries to add a 8px border around each image. If you put a border on the outer divs you can see where the chain of drop-shadows should reach, if they could; the two borders are actually touching. The drop shadows won't always reach the border due to fractional pixel offsets being truncated. If you change the zoom level in a browser, you should see that the gap between the drop shadow and border is inconsistent and depends on the zoom level. If you increase prince-filter-resolution the drop shadows will be drawn right up to the border, as the error from truncation is minimised.

The rounded corners is due to a known problem which already existed in previous versions. The input going into the filter chain has soft edges from anti-aliasing which results in the rounded corners. I had a fix but it made some other renderings worse, so that change didn't make it.

If your images are rectangular and opaque, why not use a CSS border?

1. test.html‎ 1.9 kB ‎
   with border

I will take a look into the rest in a bit, but as for the last question, only those simple tests are rectangular and opaque. I have a ton of other images with transparency in them and a lot of them have SVG clip-paths or masks applied to them and so css border will not work with that. To be honest this is just something that the css spec ignores for now and the drop-shadow is a decent work around. If there were an alternative (even, say, a prince specific alternative) I would be happy to use it. Everything else I had tried in the past didn't work as well across various browsers.

Using 20191023 snapshot I am not seeing this issue anymore

1. Test Storyboard 1 Page 1 2019-11-12.pdf‎ 381.8 kB