Release (#1489)

* fix: move width & height from style to attribute in <foreignObject> (#1486) * fix: move width & height from style to attribute in <foreignObject> #1485 * chore: commit changeset * chore(release): bump version (#1488) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
antvis · Aug 15, 2023 · 992e9d5 · 992e9d5
1 parent 28753a8
commit 992e9d5
Show file tree

Hide file tree

Showing 15 changed files with 162 additions and 6 deletions.
diff --git a/__tests__/integration/__node__tests__/svg/html.spec.js b/__tests__/integration/__node__tests__/svg/html.spec.js
@@ -0,0 +1,109 @@
+const util = require('util');
+// ref: https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
+// ref: https://github.com/jsdom/jsdom/issues/2524
+Object.defineProperty(window, 'TextEncoder', {
+  writable: true,
+  value: util.TextEncoder,
+});
+Object.defineProperty(window, 'TextDecoder', {
+  writable: true,
+  value: util.TextDecoder,
+});
+
+const fs = require('fs');
+const { JSDOM } = require('jsdom');
+const xmlserializer = require('xmlserializer');
+const { HTML, Canvas } = require('@antv/g');
+const { Renderer } = require('@antv/g-svg');
+const { sleep } = require('../../util');
+
+// create a renderer, unregister plugin relative to DOM
+const renderer = new Renderer();
+const domInteractionPlugin = renderer.getPlugin('dom-interaction');
+renderer.unregisterPlugin(domInteractionPlugin);
+
+const dom = new JSDOM(`
+<div id="container">
+</div>
+`);
+
+const SIZE = 200;
+const canvas = new Canvas({
+  container: 'container',
+  width: SIZE,
+  height: SIZE,
+  renderer,
+  document: dom.window.document,
+  requestAnimationFrame: dom.window.requestAnimationFrame,
+  cancelAnimationFrame: dom.window.cancelAnimationFrame,
+});
+
+const RESULT_IMAGE = '/html.svg';
+const BASELINE_IMAGE_DIR = '/snapshots';
+
+describe('Render <HTML> with g-svg', () => {
+  afterEach(() => {
+    canvas.removeChildren();
+  });
+
+  afterAll(() => {
+    canvas.destroy();
+  });
+
+  it('should render HTML on server-side correctly.', async () => {
+    await canvas.ready;
+    const html = new HTML({
+      id: 'p1',
+      name: 'p2-name',
+      className: 'p2-classname',
+      style: {
+        x: 50,
+        y: 50,
+        width: 60,
+        height: 30,
+        innerHTML: 'p2',
+      },
+    });
+    canvas.appendChild(html);
+
+    const html2 = new HTML({
+      id: 'p1',
+      name: 'p2-name',
+      className: 'p2-classname',
+      style: {
+        x: 50,
+        y: 150,
+        width: 60,
+        height: 30,
+        innerHTML: '<div>p2</div>',
+        fontSize: '20px',
+        textAlign: 'center',
+        color: 'red',
+      },
+    });
+    canvas.appendChild(html2);
+
+    await sleep(120);
+
+    // fs.writeFileSync(
+    //   __dirname + RESULT_IMAGE,
+    //   xmlserializer.serializeToString(
+    //     dom.window.document.getElementById('container').children[0],
+    //   ),
+    // );
+
+    const snapshot = fs.readFileSync(
+      __dirname + BASELINE_IMAGE_DIR + RESULT_IMAGE,
+      {
+        encoding: 'utf8',
+        flag: 'r',
+      },
+    );
+
+    expect(
+      xmlserializer.serializeToString(
+        dom.window.document.getElementById('container').children[0],
+      ),
+    ).toBe(snapshot);
+  });
+});
diff --git a/__tests__/integration/__node__tests__/svg/snapshots/html.svg b/__tests__/integration/__node__tests__/svg/snapshots/html.svg
diff --git a/packages/g-mobile-svg/CHANGELOG.md b/packages/g-mobile-svg/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @antv/g-mobile-svg
 
+## 0.10.14
+
+### Patch Changes
+
+-   Updated dependencies [c0b9fc49]
+    -   @antv/g-plugin-svg-renderer@1.10.14
+    -   @antv/g-plugin-svg-picker@1.9.14
+
 ## 0.10.13
 
 ### Patch Changes

diff --git a/packages/g-mobile-svg/package.json b/packages/g-mobile-svg/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-mobile-svg",
-  "version": "0.10.13",
+  "version": "0.10.14",
   "description": "A renderer implemented by SVG in mobile environment",
   "keywords": [
     "antv",

diff --git a/packages/g-plugin-rough-svg-renderer/CHANGELOG.md b/packages/g-plugin-rough-svg-renderer/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @antv/g-plugin-rough-svg-renderer
 
+## 1.9.15
+
+### Patch Changes
+
+-   @antv/g-svg@1.10.14
+
 ## 1.9.14
 
 ### Patch Changes

diff --git a/packages/g-plugin-rough-svg-renderer/package.json b/packages/g-plugin-rough-svg-renderer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-plugin-rough-svg-renderer",
-  "version": "1.9.14",
+  "version": "1.9.15",
   "description": "A G plugin of renderer implementation with rough.js",
   "keywords": [
     "antv",

diff --git a/packages/g-plugin-svg-picker/CHANGELOG.md b/packages/g-plugin-svg-picker/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @antv/g-plugin-svg-picker
 
+## 1.9.14
+
+### Patch Changes
+
+-   Updated dependencies [c0b9fc49]
+    -   @antv/g-plugin-svg-renderer@1.10.14
+
 ## 1.9.13
 
 ### Patch Changes

diff --git a/packages/g-plugin-svg-picker/package.json b/packages/g-plugin-svg-picker/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-plugin-svg-picker",
-  "version": "1.9.13",
+  "version": "1.9.14",
   "description": "A G plugin for picking in SVG",
   "keywords": [
     "antv",

diff --git a/packages/g-plugin-svg-renderer/CHANGELOG.md b/packages/g-plugin-svg-renderer/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @antv/g-plugin-svg-renderer
 
+## 1.10.14
+
+### Patch Changes
+
+-   c0b9fc49: Move width & height from style to attribute in <foreignObject>.
+
 ## 1.10.13
 
 ### Patch Changes

diff --git a/packages/g-plugin-svg-renderer/package.json b/packages/g-plugin-svg-renderer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-plugin-svg-renderer",
-  "version": "1.10.13",
+  "version": "1.10.14",
   "description": "A G plugin of renderer implementation with SVG",
   "keywords": [
     "antv",

diff --git a/packages/g-plugin-svg-renderer/src/SVGRendererPlugin.ts b/packages/g-plugin-svg-renderer/src/SVGRendererPlugin.ts
@@ -520,6 +520,9 @@ export class SVGRendererPlugin implements RenderingPlugin {
           $el.style['border-style'] = 'dashed';
         } else if (name === 'innerHTML') {
           this.createOrUpdateInnerHTML(document, $el, usedValue);
+        } else if (name === 'width' || name === 'height' || name === 'class') {
+          // width & height are both required for <foreignObject> and cannot be used as style.
+          $el.setAttribute(name, usedValue.toString());
         } else if (
           name !== 'x' &&
           name !== 'y' &&

diff --git a/packages/g-plugin-zdog-svg-renderer/CHANGELOG.md b/packages/g-plugin-zdog-svg-renderer/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @antv/g-plugin-zdog-svg-renderer
 
+## 1.2.15
+
+### Patch Changes
+
+-   Updated dependencies [c0b9fc49]
+    -   @antv/g-plugin-svg-renderer@1.10.14
+    -   @antv/g-svg@1.10.14
+
 ## 1.2.14
 
 ### Patch Changes

diff --git a/packages/g-plugin-zdog-svg-renderer/package.json b/packages/g-plugin-zdog-svg-renderer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-plugin-zdog-svg-renderer",
-  "version": "1.2.14",
+  "version": "1.2.15",
   "description": "A G plugin of renderer implementation with Zdog",
   "keywords": [
     "antv",

diff --git a/packages/g-svg/CHANGELOG.md b/packages/g-svg/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @antv/g-svg
 
+## 1.10.14
+
+### Patch Changes
+
+-   Updated dependencies [c0b9fc49]
+    -   @antv/g-plugin-svg-renderer@1.10.14
+    -   @antv/g-plugin-svg-picker@1.9.14
+
 ## 1.10.13
 
 ### Patch Changes

diff --git a/packages/g-svg/package.json b/packages/g-svg/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-svg",
-  "version": "1.10.13",
+  "version": "1.10.14",
   "description": "A renderer implemented by SVG",
   "keywords": [
     "antv",