在Vue中为fabric.js画布运行快照测试时出错

Question

这是我的画布的简单快照代码，会抛出错误

import { shallow } from "@vue/test-utils";
import ImageUpload from "packs/canvas/image_upload";
import { createRenderer } from "vue-server-renderer";

describe("Create Experience", () => {
    it("success matches snapshot", () => {
        const renderer = createRenderer();
        const wrapper = shallow(ImageUpload);
      }
      renderer.renderToString(wrapper.vm, (err, str) => {
        if (err) throw new Error(err);
        expect(str ).toMatchSnapshot();
      });
  });
  });

收到错误 snapshot error

我也尝试过使用JSDOM，但这也不起作用

我也尝试使用JSDOM，但效果也不佳

import { shallow } from "@vue/test-utils";
import ImageUpload from "packs/canvas/image_upload";
import jsdom from 'jsdom';
import { createRenderer } from "vue-server-renderer";
beforeEach(() => {
    const createElement = document.createElement.bind(document);
    document.createElement = (tagName) => {
        if (tagName === 'canvas') {
            return {
                getContext: () => ({}),
                measureText: () => ({}),
                setAttribute: () => ({}),
            };
        }
        createElement.appendChild(document.getElementById("container"))
        return createElement(tagName);
    };
});
describe("Create Experience", () => {
    it("success matches snapshot", () => {
        const renderer = createRenderer();
        const wrapper = shallow(ImageUpload);
        const { createCanvas } = require('canvas')
      renderer.renderToString(wrapper.vm, (err, str) => {
        if (err) throw new Error(err);
          const dom = new jsdom.JSDOM(str);
        expect(dom).toMatchSnapshot();
      });
  });
  });

错误：Error with using JSDOM