| Summary: | transform: rotateY() with perspective differs between firefox and chromium | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | mszamot |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED WONTFIX | ||
| Severity: | Normal | CC: | cbiesinger, dino, krit, kvserr, shawnsingh, simon.fraser, syoichi, thakis |
| Priority: | P2 | ||
| Version: | 528+ (Nightly build) | ||
| Hardware: | PC | ||
| OS: | Linux | ||
| Attachments: | |||
Created attachment 187934 [details]
Side by side difference between rendering of 'transform: rotateY(80deg): firefox vs chromium.
(In reply to comment #1) > Created an attachment (id=187934) [details] > Side by side difference between rendering of 'transform: rotateY(80deg): firefox vs chromium. I checked in Chromium and Safari and it works on both the same as for Firefox. Can you try Chromium? Looking at the image, it looks like it does not do 3D transformations at all for you? (In reply to comment #2) > (In reply to comment #1) > > Created an attachment (id=187934) [details] [details] > > Side by side difference between rendering of 'transform: rotateY(80deg): firefox vs chromium. > > I checked in Chromium and Safari and it works on both the same as for Firefox. Can you try Chromium? Looking at the image, it looks like it does not do 3D transformations at all for you? I have also tried 'chromium 24.0.1312.52' and surf (from suckless.org build with webkit-gtk-1.8.3 (on Gentoo) and it works there as in google-chrome. Best regards, Marcin The example works essentially the same for me on Firefox, Safari, Chrome stable, and Chrome canary (26.0.1410.0) Can you please give us more details about your system and setup? Perhaps there's some detail about your setup that causes this difference. In particular, can you try something that clearly indicates that chromium is using the accelerated compositor (otherwise 3d transforms are ignored anyway) such flags would be: --force-compositing-mode --show-fps-counter" or "--force-compositing-mode --show-composited-layer-borders" those flags will show some additional annotations on the screen that help to verify that chromium really is indeed in composited mode. And finally, can you please try Safari (Webkit nightly) as well? Perhaps this is a chromium-only issue and we would take the discussion back to crbug.com instead. (In reply to comment #4) > The example works essentially the same for me on Firefox, Safari, Chrome stable, and Chrome canary (26.0.1410.0) > > Can you please give us more details about your system and setup? Perhaps there's some detail about your setup that causes this difference. > > In particular, can you try something that clearly indicates that chromium is using the accelerated compositor (otherwise 3d transforms are ignored anyway) > such flags would be: --force-compositing-mode --show-fps-counter" > or "--force-compositing-mode --show-composited-layer-borders" > > those flags will show some additional annotations on the screen that help to verify that chromium really is indeed in composited mode. > > And finally, can you please try Safari (Webkit nightly) as well? Perhaps this is a chromium-only issue and we would take the discussion back to crbug.com instead. Here is what I captured on running google-chrome on the console with the requested flags: google-chrome --force-composition-mode --show-fps-counter /tmp/test.html [20965:21216:0212/235505:ERROR:nss_util.cc(492)] Error initializing NSS with a persistent database (sql:/home/coot/.pki/nssdb): NSS error code: -8187 [20965:21212:0212/235506:ERROR:object_proxy.cc(624)] Failed to get name owner. Got org.freedesktop.DBus.Error.NameHasNoOwner: Could not get owner of name 'org.chromium.Mtpd': no such name [20965:21212:0212/235506:ERROR:object_proxy.cc(624)] Failed to get name owner. Got org.freedesktop.DBus.Error.NameHasNoOwner: Could not get owner of name 'org.chromium.Mtpd': no such name [20965:21460:0212/235509:ERROR:connection.cc(677)] sqlite error 19, errno -2: PRIMARY KEY must be unique [20965:20965:0212/235512:ERROR:object_proxy.cc(529)] Failed to call method: org.chromium.Mtpd.EnumerateStorages: object_path= /org/chromium/Mtpd: org.freedesktop.DBus.Error.ServiceUnknown: The name org.chromium.Mtpd was not provided by any .service file google-chrome --force-compositing-mode --show-composited-layer-borders /tmp/test.html [11479:11558:0213/000430:ERROR:nss_util.cc(492)] Error initializing NSS with a persistent database (sql:/home/coot/.pki/nssdb): NSS error code: -8187 [11479:11554:0213/000433:ERROR:object_proxy.cc(624)] Failed to get name owner. Got org.freedesktop.DBus.Error.NameHasNoOwner: Could not get owner of name 'org.chromium.Mtpd': no such name [11479:11554:0213/000433:ERROR:object_proxy.cc(624)] Failed to get name owner. Got org.freedesktop.DBus.Error.NameHasNoOwner: Could not get owner of name 'org.chromium.Mtpd': no such name [11565:11565:0213/000437:ERROR:nss_util.cc(492)] Error initializing NSS with a persistent database (sql:/home/coot/.pki/nssdb): NSS error code: -8187 [11479:11479:0213/000437:ERROR:object_proxy.cc(529)] Failed to call method: org.chromium.Mtpd.EnumerateStorages: object_path= /org/chromium/Mtpd: org.freedesktop.DBus.Error.ServiceUnknown: The name org.chromium.Mtpd was not provided by any .service files [11479:11692:0213/000438:ERROR:connection.cc(677)] sqlite error 19, errno -2: PRIMARY KEY must be unique How I can install Safari on Linux, are there some instructions out there? Thanks for your help, Marcin Firefox's rendering shows an isometric rectangle, which is wrong. I think the FF rendering is incorrect. Created attachment 187972 [details]
Testcase
(In reply to comment #7) > Created an attachment (id=187972) [details] > Testcase There are 3d cubes on page: https://developer.mozilla.org/en-US/docs/CSS/backface-visibility In the attached png image is how chromium and ff are rendering them. Chrome renders them in the same way as chromium. Clearly the 3d comopsiting is turned off even with --force-compositing-mode . I also tried running chromium with (in various combinations) --enable-software-compositing-gl-adapter, --enable-fixed-position-compositing, --enable-browser-plugin-compositing and --enable-threaded-compositing . None of them helped to solve the issue. Best regards, Marcin Created attachment 188045 [details] Difference for ff and chromium: https://developer.mozilla.org/en-US/docs/CSS/Tutorials/Using_CSS_transforms about:gpu in chromium will likely inform you that your graphics card driver doesn't support rendering 3d contents. If you enable "Override software rendering list" on about:flags, it'll likely start working, at the expense of making your system unstable. Thank you, indeed enabling this flag turned on 3d rendering. Best regards, Marcin Szamotulski (In reply to comment #10) > about:gpu in chromium will likely inform you that your graphics card driver doesn't support rendering 3d contents. If you enable "Override software rendering list" on about:flags, it'll likely start working, at the expense of making your system unstable. |
With the following simple html file I got different views in 'Mozilla Firefox 17.0.2' and 'Google Chrome 26.0.1403.0 dev' on Gentoo(Linux): <body> <div style="margin-top: 100px; -moz-transform: perspective(500px) rotateY(80deg); -webkit-transform: perspective(500px) rotateY(80deg); background-color: lime; width: 300px; height: 300px;" > HELLO WORLD </div> </body> I attach screen a side by side shot. Best regards, Marcin