[Bug]: Uncaught TypeError: object.dirty is not a function on Vue 3

[leoporcelli]

Describe the bug / 问题描述

I'm using G6 for creating graphs on a Vue 3 application. Up to two weeks ago, everything was fine. However, since then, every time I include G6 on my code the graph does not display and the TypeError in the title is thrown. This happens also for the graphs presented on the playground. For example:

<template>
<div id="container"></div>
</template>
<script>
import { Graph } from '@antv/g6';

fetch('https://assets.antv.antgroup.com/g6/combo.json')
  .then((res) => res.json())
  .then((data) => {
    const graph = new Graph({
      container: 'container',
      data,
      layout: {
        type: 'combo-combined',
        comboPadding: 2,
      },
      node: {
        style: {
          size: 20,
          labelText: (d) => d.id,
        },
        palette: {
          type: 'group',
          field: (d) => d.combo,
        },
      },
      edge: {
        style: (model) => {
          const { size, color } = model.data;
          return {
            stroke: color || '#99ADD1',
            lineWidth: size || 1,
          };
        },
      },
      behaviors: ['drag-element', 'drag-canvas', 'zoom-canvas'],
      autoFit: 'view',
    });

    graph.render();
  });


</script>

does not work

Reproduction link / 复现链接

No response

Steps to Reproduce the Bug or Issue / 重现步骤

• Copy the code provided in a Vue file and run in any browser

Version / 版本

🆕 5.x

OS / 操作系统

• [ ] macOS
• [x] Windows
• [ ] Linux
• [ ] Others / 其他

Browser / 浏览器

• [x] Chrome
• [x] Edge
• [ ] Firefox
• [ ] Safari (Limited support / 有限支持)
• [ ] IE (Nonsupport / 不支持)
• [ ] Others / 其他

[FoundTheWOUT]

Same issue at 5.0.44, disappear when update to 5.0.49. And this is non vue related. Error was occur when i update lock file, seem like version mismatch upstream.