fix import of leading, dont write data to dom if not neccessary

6 files changed, 56 insertions, 17 deletions

diff --git a/spec/spec/elements/Dom.js b/spec/spec/elements/Dom.js
index 3325d93..11ce9e0 100644
--- a/spec/spec/elements/Dom.js
+++ b/spec/spec/elements/Dom.js
@@ -10,7 +10,8 @@ import {
   Fragment,
   Circle,
   Tspan,
-  create
+  create,
+  Text
 } from '../../../src/main.js'
 import { getWindow } from '../../../src/utils/window.js'
 import { svg, html } from '../../../src/modules/core/namespaces.js'
@@ -657,9 +658,24 @@ describe('Dom.js', function () {
     })
   })
 
-  // describe('writeDataToDom()', () => {
-  //   // not really testable
-  // })
+  describe('writeDataToDom()', () => {
+    it('writes the data to the dom', () => {
+      const node = new Rect()
+      node.setData({ foo: 'bar' })
+      node.writeDataToDom()
+      expect(node.node.getAttribute('svgjs:data')).toBe('{"foo":"bar"}')
+    })
+
+    it('filters out default data', () => {
+      const node1 = new Text()
+      const node2 = new Text()
+      node2.dom.foo = 'bar'
+      node1.writeDataToDom()
+      node2.writeDataToDom()
+      expect(node1.node.getAttribute('svgjs:data')).toBe(null)
+      expect(node2.node.getAttribute('svgjs:data')).toBe('{"foo":"bar"}')
+    })
+  })
 
   describe('xml()', () => {
     describe('as setter', () => {
diff --git a/spec/spec/elements/Element.js b/spec/spec/elements/Element.js
index 53c5028..c89f7aa 100644
--- a/spec/spec/elements/Element.js
+++ b/spec/spec/elements/Element.js
@@ -165,7 +165,7 @@ describe('Element.js', function () {
   describe('parents()', () => {
     it('returns array of parents until the passed element or root svg', () => {
       const canvas = SVG().addTo(container)
-      const groupA = canvas.group().addClass('test')
+      const _groupA = canvas.group().addClass('test')
       const group1 = canvas.group().addClass('test')
       const group2 = group1.group()
       const group3 = group2.group()
@@ -179,7 +179,7 @@ describe('Element.js', function () {
 
     it('returns array of parents until the closest matching parent', () => {
       const canvas = SVG().addTo(container)
-      const groupA = canvas.group().addClass('test')
+      const _groupA = canvas.group().addClass('test')
       const group1 = canvas.group().addClass('test')
       const group2 = group1.group().addClass('test').addClass('foo')
       const group3 = group2.group().addClass('foo')
diff --git a/spec/spec/elements/Text.js b/spec/spec/elements/Text.js
index f088618..28802a2 100644
--- a/spec/spec/elements/Text.js
+++ b/spec/spec/elements/Text.js
@@ -6,7 +6,8 @@ import {
   SVG,
   G,
   Path,
-  TextPath
+  TextPath,
+  Svg
 } from '../../../src/main.js'
 
 const { any } = jasmine
@@ -20,6 +21,13 @@ describe('Text.js', () => {
     it('sets passed attributes on the element', () => {
       expect(new Text({ id: 'foo' }).id()).toBe('foo')
     })
+
+    it('recovers leading data from dom', () => {
+      const svg = new Svg().namespace()
+      svg.text('').leading(3)
+      const newSvg = SVG(svg.svg())
+      expect(newSvg.findOne('text').leading().valueOf()).toBe(3)
+    })
   })
 
   describe('text()', () => {
diff --git a/src/elements/Element.js b/src/elements/Element.js
index 61db7b7..7a563d6 100644
--- a/src/elements/Element.js
+++ b/src/elements/Element.js
@@ -9,7 +9,7 @@ import {
 } from '../utils/adopter.js'
 import { globals } from '../utils/window.js'
 import { point } from '../types/Point.js'
-import { proportionalSize } from '../utils/utils.js'
+import { proportionalSize, writeDataToDom } from '../utils/utils.js'
 import { reference } from '../modules/core/regex.js'
 import Dom from './Dom.js'
 import List from '../types/List.js'
@@ -151,13 +151,7 @@ export default class Element extends Dom {
 
   // write svgjs data to the dom
   writeDataToDom() {
-    // remove previously set data
-    this.node.removeAttribute('svgjs:data')
-
-    if (Object.keys(this.dom).length) {
-      this.node.setAttribute('svgjs:data', JSON.stringify(this.dom)) // see #428
-    }
-
+    writeDataToDom(this, this.dom)
     return super.writeDataToDom()
   }
 
diff --git a/src/elements/Text.js b/src/elements/Text.js
index 0c5815d..c703e3b 100644
--- a/src/elements/Text.js
+++ b/src/elements/Text.js
@@ -10,14 +10,14 @@ import SVGNumber from '../types/SVGNumber.js'
 import Shape from './Shape.js'
 import { globals } from '../utils/window.js'
 import * as textable from '../modules/core/textable.js'
-import { isDescriptive } from '../utils/utils.js'
+import { isDescriptive, writeDataToDom } from '../utils/utils.js'
 
 export default class Text extends Shape {
   // Initialize node
   constructor(node, attrs = node) {
     super(nodeOrNew('text', node), attrs)
 
-    this.dom.leading = new SVGNumber(1.3) // store leading value for rebuilding
+    this.dom.leading = this.dom.leading ?? new SVGNumber(1.3) // store leading value for rebuilding
     this._rebuild = true // enable automatic updating of dy values
     this._build = false // disable build mode for adding multiple lines
   }
@@ -82,6 +82,11 @@ export default class Text extends Shape {
     return this
   }
 
+  writeDataToDom() {
+    writeDataToDom(this, this.dom, { leading: 1.3 })
+    return this
+  }
+
   // Set the text content
   text(text) {
     // act as getter
diff --git a/src/utils/utils.js b/src/utils/utils.js
index 0d297ec..2438431 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -124,3 +124,19 @@ export function getOrigin(o, element) {
 const descriptiveElements = new Set(['desc', 'metadata', 'title'])
 export const isDescriptive = (element) =>
   descriptiveElements.has(element.nodeName)
+
+export const writeDataToDom = (element, data, defaults = {}) => {
+  const cloned = { ...data }
+
+  for (const key in cloned) {
+    if (cloned[key].valueOf() === defaults[key]) {
+      delete cloned[key]
+    }
+  }
+
+  if (Object.keys(cloned).length) {
+    element.node.setAttribute('svgjs:data', JSON.stringify(cloned)) // see #428
+  } else {
+    element.node.removeAttribute('svgjs:data')
+  }
+}