How to create a lossless WebP image using toDataURL?

canvas, google-chrome, html, javascript, webp

Solution

There are no official MIME types for webp so take this with a grain of salt for now.

Using "image/webp" on chrome in `toDataURL` will always result in a lossy webp image right now, even at quality "1"

There is seemingly no way to get a lossless webP image at this time

Problem

I'm trying out the WebP image format in Chrome using the canvas element. On MDN I saw that `toDataURL` accepts a second argument representing the quality of the resulting image. I'd like to generate a lossless WebP image of a canvas element. However, if I pass `1` for quality (meaning 100%), I don't get the exact same pixels back. It looks like it is generating a lossy image. Here's a test case: http://jsfiddle.net/Nf5ve/1/. When drawing the PNG image, a certain color of a certain pixel has a value of 40. After drawing a 100% quality WebP image of the canvas on itself, the same value has changed to 37. This does not seem lossless to me, even though I passed a quality of 100%. Is it possible to have `toDataURL` create a lossless WebP image, and if so how?

Original source