refactor(tests): move global composite operation tests from qunit to playwright #10610
Conversation
Review or Edit in CodeSandboxOpen the branch in Web Editor • VS Code • Insiders |
| golden: `${operation}.png`, | ||
| snapshotSuffix: 'gco', | ||
| percentage: 0.04, | ||
| size: [size.width, size.height], |
There was a problem hiding this comment.
@asturur 4 tests are failing on node side on my local machine and I can't figure out why
you can focus them if you put only: true in here in options
then only this test file will be focused
I am not sure why tests just don't want to pass (these 4) on node side, might be my local machine
they do work just fine in playwright in browser
I tripple checked that I migrated the script properly from qunit, can't spot something that I missed
There was a problem hiding this comment.
the only difference i see is creating a new existing each test rather than cloning it. The difference would be that in one case is a canvas, in the other is an image probably created from a dataurl, so it is kind of reset from the canvas operations we did to create that particular gradient. is an unexpected failure tho,
There was a problem hiding this comment.
I mean each test should be purely independent and not rely on any kind of state of a previous test case
otherwise it is a brittle testing practice and a footgun in the long run
There was a problem hiding this comment.
what is weird it passes the browser step, meaning chromium properly generates the proper image
but node part fails, it ends up being without these generated circles
There was a problem hiding this comment.
Yeah my comment about image vs canvas was that maybe node-canvas internally could have a canvas tainted in some way with the global composite operation, not that would bleed test by test. But i tried to change it to an image and nothing really changed
|
Build Stats
|
| size: [size.width, size.height], | ||
| async renderFunction(canvas, fabric) { | ||
| // goldens are transparent | ||
| canvas.backgroundColor = 'transparent'; |
There was a problem hiding this comment.
I added this, since goldens are transparent and in global beforeEach in playwright we set it to white for some reason so then there is a mismatch in the background color when comparing snapshots
|
ok if i have to dig in those tests i ll need some time. |
no worries we are not in a hurry |
|
my gut feeling is that all nodes test are somehow failing and that those are the one that are more visibile, playwright has its own measurment that differs probably? with the current master ti should be possible to create the snasphots by deleting them and running the visual tests in node, i want to see what does node creates today, since we update it substantially. |
|
let me do a discovery test again |
|
i switched the drawing operation order between the small preview and the big gradient to see if it changes anything. Is like the background gets deleted in node after the first small draw, that with the operations that are failing seems to match what should happen. |
I don't think all node test cases are failing I feel like something might be issue in fabric itself or we have some race condition in the testing framework where compare too early before it is generated? |
|
there is something interesting canvas.add(
createNew(fabric, operation),
);then the test passes I don't get why is this different than in qunit |
| width: 30, | ||
| height: 30, | ||
| fill: 'red', | ||
| globalCompositeOperation: operation, |
There was a problem hiding this comment.
ok if we remove this line the test works just fine for all of the cases for both node and browser
now, why does this line break the tests, no idea
|
I have pushed a commit that made the tests pass |
|
ok your change made me understand where the issue is. |
Amazing |
No description provided.