Closed Bug 985882 Opened 6 years ago Closed 5 years ago

SVG as a background-image is pixelated with transform rotate and scale applied

Categories

(Core :: SVG, defect)

28 Branch
defect
Not set

Tracking

()

RESOLVED WORKSFORME
Tracking Status
firefox28 --- affected
firefox29 --- affected
firefox30 --- affected
firefox31 --- affected
firefox32 --- affected
firefox33 --- affected
firefox34 --- affected
firefox35 --- affected

People

(Reporter: andrej.okonetschnikow, Unassigned)

References

()

Details

(Keywords: regression)

Attachments

(1 file)

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537.74.9 (KHTML, like Gecko) Version/7.0.2 Safari/537.74.9

Steps to reproduce:

1. Use a HTML element with a style which uses background property with SVG image
2. Apply a CSS transform with scale and rotate to it (or container element)

This doesn't happened then the <object> is being used.

Test case: http://jsfiddle.net/nGdnM/1/


Actual results:

The presentation of the SVG becomes pixelated. The same SVG in the <object> tag  remains sharp after applying the same CSS transformation.


Expected results:

SVG when used as background image should have sharp edges regardless of scale/rotate transformation.
Component: Untriaged → SVG
OS: Mac OS X → All
Product: Firefox → Core
Hardware: x86 → All
I would say it's the same in Chrome
It's definitly not the same in Chrome, I just checked OS X as well as Windows 7 (Chrome left, Firefox on the right):
https://www.dropbox.com/s/2vyskku0k9wso1e/bugzilla-985882-chrome-vs-firefox.png

Note that I increased the scale factor to 3.5 for better visibility on http://jsfiddle.net/nGdnM/2/
This looks like a regression from ff26 to ff27.

Here is a screenshot from the test case with ff26, which looks much better as it is not pixelated at all:
https://www.dropbox.com/s/coghxa8kqushqx3/bug%20985882%20ff26.png
Status: UNCONFIRMED → NEW
Ever confirmed: true
(In reply to Dieter Komendera from comment #3)
> This looks like a regression from ff26 to ff27.
> 
> Here is a screenshot from the test case with ff26, which looks much better
> as it is not pixelated at all:
> https://www.dropbox.com/s/coghxa8kqushqx3/bug%20985882%20ff26.png


I have a different regression window for http://jsfiddle.net/nGdnM/2/ . Firefox27.0.1 render well.

Regression:
http://hg.mozilla.org/integration/mozilla-inbound/pushloghtml?fromchange=3d3a8f13aa66&tochange=99108bac6f2d

triggered by: Bug 923341
fixed on trunk. don't know what did it.
Status: NEW → RESOLVED
Closed: 5 years ago
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.