fix(Text):Double offset when exporting SVG after setting deltaY in Text

[jiao1187875445]

After setting deltaY in the text, the exported SVG has both dy and baseline shift attributes, resulting in inconsistent rendering between SVG and Canvas, leading to double offset. Just keep one of these two

2222.mov

[codesandbox]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders

Open Preview

[asturur]

thank you.
It would be great if you could a visual regression test in our playwright tests.
Have a look if you see how to do that, if not i can guide you.

[github-actions]

Build Stats

file / KB (diff)	bundled	minified
fabric	917.685 (-0.045)	301.570 (-0.030)

[jiao1187875445]

thank you. It would be great if you could a visual regression test in our playwright tests. Have a look if you see how to do that, if not i can guide you.

Okay, what do you need me to do?

[asturur]

if you didn't already do a 'npx playwright install' in the fabric js folder to get playwright.

Then look at this file here:
e2e/tests/visual-output/rendering/testcases/z-svg-export.ts
you see is an array of objects, each object represent a test.

a test looks like this

  {
    title: 'Text deltay export',
    golden: 'text_deltay.png',
    percentage: 0.06,
    size: [200, 200], // <= pick an appropriate size for your canvas depending how large is the object you test, you can go over, but do not exagerate, too many white pixels not a good test
    async renderFunction(canvas, fabric) {
      // you have a canvas and the fabric import in this function, write your test code
      // just create a text object with a DY in the style so obvious that can be seen easily
      // add more than just one negative and one positive, nest it if possible
      const text = new fabric.Text('some sample text', { styles: { .... } });
      canvas.add(text);
      canvas.centerObject(text);
    },
  },

^^^ something like this.
Then run npm run build and npm run test:e2e

Following times is enough to run npm run test:e2e

The test should create a golden image.
Add the golden image to git, but do not add the change dist folder, so we don't create useless diffs.
If you commit the dist folder by error , just do git checkout master dist*