@@ -10,8 +10,7 @@ import { | |||
Fragment, | |||
Circle, | |||
Tspan, | |||
create, | |||
Text | |||
create | |||
} from '../../../src/main.js' | |||
import { getWindow } from '../../../src/utils/window.js' | |||
import { svg, html } from '../../../src/modules/core/namespaces.js' | |||
@@ -658,25 +657,6 @@ describe('Dom.js', function () { | |||
}) | |||
}) | |||
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', () => { | |||
it('returns itself', () => { |
@@ -1,6 +1,6 @@ | |||
/* globals describe, expect, it, beforeEach, spyOn, jasmine, container */ | |||
import { Element, create, Rect, G, SVG } from '../../../src/main.js' | |||
import { Element, create, Rect, G, SVG, Text } from '../../../src/main.js' | |||
const { any, objectContaining } = jasmine | |||
describe('Element.js', function () { | |||
@@ -34,9 +34,14 @@ describe('Element.js', function () { | |||
}) | |||
it('falls back to empty object when attribute is null', () => { | |||
element.node.setAttribute('svgjs:data', 'null') | |||
element.node.setAttribute('data-svg', 'null') | |||
expect(new Element(element.node).dom).toEqual({}) | |||
}) | |||
it('uses old svgjs:data attribute if present', () => { | |||
element.node.setAttribute('svgjs:data', '{"foo":"bar"}') | |||
expect(new Element(element.node).dom).toEqual({ foo: 'bar' }) | |||
}) | |||
}) | |||
describe('center()', () => { | |||
@@ -265,15 +270,15 @@ describe('Element.js', function () { | |||
describe('writeDataToDom()', () => { | |||
it('removes previously set data', () => { | |||
element.node.setAttribute('svgjs:data', JSON.stringify({ foo: 'bar' })) | |||
element.node.setAttribute('data-svgjs', JSON.stringify({ foo: 'bar' })) | |||
element.writeDataToDom() | |||
expect(element.node.getAttribute('svgjs:data')).toBe(null) | |||
expect(element.node.getAttribute('data-svgjs')).toBe(null) | |||
}) | |||
it('writes data from the dom property into the dom', () => { | |||
element.dom = { foo: 'bar' } | |||
element.writeDataToDom() | |||
expect(element.node.getAttribute('svgjs:data')).toBe( | |||
expect(element.node.getAttribute('data-svgjs')).toBe( | |||
JSON.stringify({ foo: 'bar' }) | |||
) | |||
}) | |||
@@ -285,6 +290,16 @@ describe('Element.js', function () { | |||
g.writeDataToDom() | |||
expect(spy).toHaveBeenCalled() | |||
}) | |||
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('data-svgjs')).toBe(null) | |||
expect(node2.node.getAttribute('data-svgjs')).toBe('{"foo":"bar"}') | |||
}) | |||
}) | |||
describe('x()', () => { |
@@ -1,11 +1,7 @@ | |||
/* globals describe, expect, it, jasmine, container */ | |||
import { Svg, SVG, Defs } from '../../../src/main.js' | |||
import { | |||
svg as ns, | |||
xlink, | |||
svgjs | |||
} from '../../../src/modules/core/namespaces.js' | |||
import { svg as ns, xlink } from '../../../src/modules/core/namespaces.js' | |||
import { getWindow } from '../../../src/utils/window.js' | |||
const { any } = jasmine | |||
@@ -26,7 +22,6 @@ describe('Svg.js', () => { | |||
expect(svg.attr('xmlns')).toBe(ns) | |||
expect(svg.attr('version')).toBe(1.1) | |||
expect(svg.attr('xmlns:xlink')).toBe(xlink) | |||
expect(svg.attr('xmlns:svgjs')).toBe(svgjs) | |||
}) | |||
}) | |||
@@ -71,7 +66,6 @@ describe('Svg.js', () => { | |||
expect(svg.attr('xmlns')).toBe(ns) | |||
expect(svg.attr('version')).toBe(1.1) | |||
expect(svg.attr('xmlns:xlink')).toBe(xlink) | |||
expect(svg.attr('xmlns:svgjs')).toBe(svgjs) | |||
}) | |||
}) | |||
@@ -25,9 +25,13 @@ export default class Element extends Dom { | |||
// create circular reference | |||
this.node.instance = this | |||
if (node.hasAttribute('svgjs:data')) { | |||
if (node.hasAttribute('data-svgjs') || node.hasAttribute('svgjs:data')) { | |||
// pull svgjs data from the dom (getAttributeNS doesn't work in html5) | |||
this.setData(JSON.parse(node.getAttribute('svgjs:data')) || {}) | |||
this.setData( | |||
JSON.parse(node.getAttribute('data-svgjs')) ?? | |||
JSON.parse(node.getAttribute('svgjs:data')) ?? | |||
{} | |||
) | |||
} | |||
} | |||
@@ -4,7 +4,7 @@ import { | |||
register, | |||
wrapWithAttrCheck | |||
} from '../utils/adopter.js' | |||
import { svg, svgjs, xlink, xmlns } from '../modules/core/namespaces.js' | |||
import { svg, xlink, xmlns } from '../modules/core/namespaces.js' | |||
import { registerMethods } from '../utils/methods.js' | |||
import Container from './Container.js' | |||
import Defs from './Defs.js' | |||
@@ -34,9 +34,11 @@ export default class Svg extends Container { | |||
// Add namespaces | |||
namespace() { | |||
if (!this.isRoot()) return this.root().namespace() | |||
return this.attr({ xmlns: svg, version: '1.1' }) | |||
.attr('xmlns:xlink', xlink, xmlns) | |||
.attr('xmlns:svgjs', svgjs, xmlns) | |||
return this.attr({ xmlns: svg, version: '1.1' }).attr( | |||
'xmlns:xlink', | |||
xlink, | |||
xmlns | |||
) | |||
} | |||
removeNamespace() { |
@@ -3,4 +3,3 @@ export const svg = 'http://www.w3.org/2000/svg' | |||
export const html = 'http://www.w3.org/1999/xhtml' | |||
export const xmlns = 'http://www.w3.org/2000/xmlns/' | |||
export const xlink = 'http://www.w3.org/1999/xlink' | |||
export const svgjs = 'http://svgjs.dev/svgjs' |
@@ -135,8 +135,9 @@ export const writeDataToDom = (element, data, defaults = {}) => { | |||
} | |||
if (Object.keys(cloned).length) { | |||
element.node.setAttribute('svgjs:data', JSON.stringify(cloned)) // see #428 | |||
element.node.setAttribute('data-svgjs', JSON.stringify(cloned)) // see #428 | |||
} else { | |||
element.node.removeAttribute('data-svgjs') | |||
element.node.removeAttribute('svgjs:data') | |||
} | |||
} |