search

masakudamatsu / color-picker-nova

Pick a color by the contrast ratio to pure black and how much grey is mixed with pure hue
MIT License
0 stars 0 forks source link

Find a way to test HTML5 canvas element #5

Open masakudamatsu opened 3 years ago

masakudamatsu commented 3 years ago

This issue will need to be dropped if we decide not to use HTML5 Canvas to render the color triangle (#4 ).

See https://www.notion.so/Assertion-Canvas-element-d79e9249d87d4d8f9c6af63a8dc73528

masakudamatsu commented 3 years ago

Try jest-canvas-mock. The following code snippet seems to work:

const events = ctx.__getEvents();
 expect(events).toMatchSnapshot();
masakudamatsu commented 3 years ago

We cannot use jest-canvas-mock. It's meant for unit tests of all the canvas functions. We need to access to the context object in a test. I don't know how.

masakudamatsu commented 3 years ago

As suggested in this article, Cypress image snapshot test seems to be a way to go.

masakudamatsu commented 3 years ago

How to use cypress-image-snapshot is summarized in: https://www.notion.so/Visual-Testing-Cypress-Image-Snapshot-2cb49e721b0e4959b5ec2cb6adbd30ae

Read this and finalize how we test canvas elements with it.