Alternative for jest-snapshot for vitest browser mode

[Smrtnyk]

Currently we are using jest-snapshot for custom snapshot matchers in here
https://github.com/fabricjs/fabric.js/blob/master/vitest.extend.ts#L3

We are planning to run the tests also in browser mode, but then this breaks because jest-snapshot is not made for browser environment.
It works well in nodejs/jsdom environment.
Do you have some ideas on what could I do to replace the jest-snapshot package?
Does vitest expose something similar to this?

[hi-ogawa]

The abstraction of @vitest/snapshot is different from jest-snapshot as it's internally implemented as chai method:

vitest/packages/vitest/src/integrations/snapshot/chai.ts

Lines 64 to 71 in a288c1e

	for (const key of ['matchSnapshot', 'toMatchSnapshot']) {
	utils.addMethod(
	chai.Assertion.prototype,
	key,
	function (
	this: Record<string, unknown>,
	properties?: object,
	message?: string,

It looks like technically you can customize it like this https://stackblitz.com/edit/vitest-dev-vitest-3sb8oxer?file=test%2Frepro.test.ts

import { expect, test, chai } from 'vitest';

test('foo', () => {
  chai.util.addMethod(
    chai.Assertion.prototype,
    'toMatchSnapshot2',
    function (this: any, ...args: any[]) {
      // modify received object
      const object = chai.util.flag(this, 'object');
      chai.util.flag(this, 'object', { wrapped: object });

      // call orignal assertion
      return this.toMatchSnapshot(...args);
    }
  );

  expect({ hello: 'world' }).toMatchSnapshot2();
});

But the error stacktrace when unmatched seems off. I'm not sure how it can be handled in user land. Probably there is a way to provide something better officially, but I don't know what that is at the moment. Please feel free to create a feature request for starter.

[Smrtnyk]

Hi @hi-ogawa regarding #7848
since conversation is locked there, just wanted to let you know that I will try it out tomorrow in fabric and let you know

[hi-ogawa]

Thanks! Browser mode support was broken. It's going to fixed by #10042 (comment)

[Smrtnyk]

@hi-ogawa I tested it out here fabricjs/fabric.js#10937
much better, works like a charm for us

[Smrtnyk]

@hi-ogawa we have merged it to the fabric now, tnx a lot for this nicer API