On Feb 24, 2012, at 18:00, Chad Retz wrote: > You can save an expected result image (as something lossless like PNG) and > use canvas to pixel by pixel assert your rendering with the expected result. > It may not be quick, but it'll work.
Yes, that is what I was thinking. However, the same canvas drawing rendered in Firefox and Safari has slightly different output. I assume this is because different browsers have different antialiasing implementations; I assume for example that Firefox uses the Cairo graphics library while Safari uses OS X's Quartz rendering. So I either need a reference image per browser, or a fuzzy way to compare the images. And I was hoping this was a matter that somebody's existing testing library had already taken care of, so that I didn't have to write it myself. On Feb 24, 2012, at 22:38, talltyler wrote: > I helped build a system for something at work like this, we use > ImageMagick to do this part which has a compair method. This method > can have a few different threshold values so images can be a few > pixels off which we needed because of anti-alias/floating point > differences we were seeing. > > If your images are not going to have these issues you can just get the > base64 strings directly from the canvas api which is much faster/ > simpler. > > The basic setup is every time you have a clean render export either > the base64 or a png with the serialized data that it took to render > that image. Then when you run your test just loop over every piece of > serialized data, render with the current state of your app and compair > the output with the fixtures. I'm familiar with ImageMagick's compare program and I've read articles about the many ways you can customize it to do more fuzzy, less-exact matching. It's possible I could come up with an invocation of compare that would ignore the small antialiasing differences I'm seeing. However, ImageMagick is a command line compiled program; how would you propose that I invoke it from a testing script running in a web browser? I suppose I could run a small node web server, and have the browser POST its drawn image to the server, which would then run ImageMagick to compare. It seems messy; it would be cleaner to keep it all running in the browser. I imagine I can loop over all the pixels in the drawn image and see how much each one differs from the corresponding pixel in the reference image, and develop some tolerances for what should be considered "close enough". If there's no existent testing library that does that, I guess that's what I'll do. -- Job Board: http://jobs.nodejs.org/ Posting guidelines: https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines You received this message because you are subscribed to the Google Groups "nodejs" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/nodejs?hl=en?hl=en
