Bug 185683

Summary: Image-rendering: pixelated; fails on scaled canvases
Product: WebKit Reporter: Jake Archibald <jaffathecake>
Component: CanvasAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: dino, kkinnunen, tomac
Priority: P2    
Version: Safari Technology Preview   
Hardware: Unspecified   
OS: Unspecified   
Bug Depends on: 27684    
Bug Blocks:    
Attachments:
Description Flags
Screenshot on 1x screen.
none
Screenshot on retina screen none

Jake Archibald
Reported 2018-05-16 09:54:51 PDT
https://pixelated-transform-demo.glitch.me/ These are all canvases & imgs displayed at 10x using different methods, all with pixelated image-rendering. Some have a null clip-path applied. The output of each should look the same. The canvases lose their sharpness when scaled using a CSS transform (on either the canvas element itself, or a parent element).
Attachments
Screenshot on 1x screen. (57.85 KB, image/png)
2018-05-17 01:38 PDT, Jake Archibald 		no flags
Details
Screenshot on retina screen (124.17 KB, image/png)
2018-05-17 01:39 PDT, Jake Archibald 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Jake Archibald
Comment 1 2018-05-17 01:38:52 PDT
Created attachment 340563 [details] Screenshot on 1x screen. The bug is much more noticeable on a 1x screen.
Jake Archibald
Comment 2 2018-05-17 01:39:20 PDT
Created attachment 340564 [details] Screenshot on retina screen
Kimmo Kinnunen
Comment 3 2021-09-01 01:14:35 PDT
I think what's left today is the ones that depend on transformed elements respecting image-rendering. That work should be bug 27684
Note You need to log in before you can comment on or make changes to this bug.