Skip to content

Commit

Permalink
added tests, make replacement for all elements using href
Browse files Browse the repository at this point in the history
  • Loading branch information
Fuzzyma committed Apr 25, 2017
1 parent 9660844 commit 4455a78
Show file tree
Hide file tree
Showing 10 changed files with 92 additions and 30 deletions.
39 changes: 25 additions & 14 deletions dist/svg.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
* @copyright Wout Fierens <wout@mick-wout.com>
* @license MIT
*
* BUILT: Mon Apr 24 2017 09:47:29 GMT+0200 (Mitteleuropäische Sommerzeit)
* BUILT: Tue Apr 25 2017 13:06:29 GMT+0200 (Mitteleuropäische Sommerzeit)
*/;
(function(root, factory) {
/* istanbul ignore next */
Expand Down Expand Up @@ -183,7 +183,7 @@ SVG.regex = {
, rgb: /rgb\((\d+),(\d+),(\d+)\)/

// Parse reference url
, reference: /(url\()?([-\w:/.]+)?#([-\w]+)/
, reference: /(url\()?([-\w:/.]+)?(#([-\w]+))?/

// splits a transformation chain
, transforms: /\)\s*,?\s*/
Expand Down Expand Up @@ -3765,7 +3765,7 @@ SVG.Use = SVG.invent({
// Use element as a reference
element: function(element, file) {
// Set lined element
return this.attr('href', (file || '') + '#' + element, SVG.xlink)
return this.attr('href', link((file || '') + '#' + element), SVG.xlink)
}
}

Expand Down Expand Up @@ -4127,7 +4127,7 @@ SVG.Image = SVG.invent({
}
}, this)

return this.attr('href', (img.src = url), SVG.xlink)
return this.attr('href', (img.src = link(url)), SVG.xlink)
}
}

Expand Down Expand Up @@ -4394,7 +4394,7 @@ SVG.TextPath = SVG.invent({
this.node.appendChild(path.node)

// link textPath to path and add content
path.attr('href', '#' + track, SVG.xlink)
path.attr('href', link('#' + track), SVG.xlink)

return this
}
Expand Down Expand Up @@ -4460,7 +4460,7 @@ SVG.A = SVG.invent({
, extend: {
// Link url
to: function(url) {
return this.attr('href', url, SVG.xlink)
return this.attr('href', link(url), SVG.xlink)
}
// Link show attribute
, show: function(target) {
Expand Down Expand Up @@ -4972,12 +4972,23 @@ function fullBox(b) {
function idFromReference(url) {
var m = SVG.regex.reference.exec(url+'')

if (m) return m[3]
if (m && m[2] == location() && m[4]) return m[4]
}

function location() {
return window.location.href
.replace(window.location.hash, '')
}

// creates an url reference out of nodes id
function url(node) {
return 'url(' + window.location + '#' + node.id() + ')'
return 'url(' + location() + '#' + node.id() + ')'
}

function link(url) {
var match = SVG.regex.reference.exec(url)
if(!url || match[2]) return url
return location() + (match[3] || '')
}

function removePrefixFromReferences(node) {
Expand All @@ -4987,10 +4998,10 @@ function removePrefixFromReferences(node) {

var v = node.attributes, match
for (n = v.length - 1; n >= 0; n--) {
if(v[n].nodeName == 'xlink:href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(match[2] == window.location) v[n].nodeValue = '#' + (match[3] || '')
if(v[n].nodeName == 'href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(match[2] == location()) v[n].nodeValue = (match[3] || '')
}else if(match = SVG.regex.reference.exec(v[n].nodeValue)) {
if(match[1] && match[2] == window.location) v[n].nodeValue = 'url(#' + match[3] + ')'
if(match[1] && match[2] == location()) v[n].nodeValue = 'url(' + match[3] + ')'
}
}
}
Expand All @@ -5002,10 +5013,10 @@ function addPrefixToReferences(node) {

var v = node.attributes, match
for (n = v.length - 1; n >= 0; n--) {
if(v[n].nodeName == 'xlink:href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(!match[2]) v[n].nodeValue = window.location + '#' + (match[3] || '')
if(v[n].nodeName == 'href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(!match[2]) v[n].nodeValue = location() + (match[3] || '')
}else if(match = SVG.regex.reference.exec(v[n].nodeValue)) {
if(match[1] && !match[2]) v[n].nodeValue = 'url(' + window.location + '#' + match[3] + ')'
if(match[1] && !match[2]) v[n].nodeValue = 'url(' + location() + match[3] + ')'
}
}
}
Expand Down
4 changes: 2 additions & 2 deletions dist/svg.min.js

Large diffs are not rendered by default.

40 changes: 40 additions & 0 deletions spec/spec/element.js
Original file line number Diff line number Diff line change
Expand Up @@ -861,6 +861,46 @@ describe('Element', function() {
|| toBeTested === '<circle xmlns="http://www.w3.org/2000/svg" r="50" cx="50" cy="50" fill="#ff0066"></circle>'
).toBeTruthy()
})
it('correctly removes the current location from urls on export', function() {
var rect2, rect1 = draw.rect(100,100).clipWith(rect2 = draw.rect(100,100))
expect(rect1.attr('clip-path')).toBe('url(' + window.location + '#' + rect2.parent().id() + ')')

var doc = document.createElement('svg')
doc.innerHTML = rect1.svg()

expect(doc.firstChild.getAttribute('clip-path')).toBe('url(#' + rect2.parent().id() + ')')

rect1.attr('clip-path', 'url(http://someUrl.com/with/path/and#Hash)')

doc.innerHTML = rect1.svg()
expect(doc.firstChild.getAttribute('clip-path')).toBe('url(http://someUrl.com/with/path/and#Hash)')
})
it('correctly removes the current location from href on export', function() {
var link = draw.link('#somewhere')
expect(link.to()).toBe(window.location + '#somewhere')

var doc = document.createElement('svg')
doc.innerHTML = link.svg()
expect(doc.firstChild.getAttribute('xlink:href')).toBe('#somewhere')

link.to('http://someUrl.com/with/path/and#Hash')
doc.innerHTML = link.svg()
expect(doc.firstChild.getAttribute('xlink:href')).toBe('http://someUrl.com/with/path/and#Hash')
})
it('correctly adds the current location to urls on import', function() {
draw.svg('<rect width="100" height="100" clip-path="url(#something)" id="someId">')
expect(SVG.get('someId').attr('clip-path')).toBe('url(' + window.location + '#something)')

draw.clear().svg('<rect width="100" height="100" clip-path="url(http://someUrl.com/with/path/and#Hash)" id="someId">')
expect(SVG.get('someId').attr('clip-path')).toBe('url(http://someUrl.com/with/path/and#Hash)')
})
it('correctly adds the current location to href on import', function() {
draw.svg('<a href="#something" id="someId">')
expect(SVG.get('someId').attr('href')).toBe(window.location + '#something')

draw.clear().svg('<a href="http://someUrl.com/with/path/and#Hash" id="someId">')
expect(SVG.get('someId').attr('href')).toBe('http://someUrl.com/with/path/and#Hash')
})
})
describe('with raw svg given', function() {
it('imports a full svg document', function() {
Expand Down
2 changes: 1 addition & 1 deletion spec/spec/use.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ describe('Use', function() {
})

it('sets the target element id to its href attribute', function() {
expect(use.node.getAttributeNS(SVG.xlink, 'href')).toBe('#' + rect)
expect(use.node.getAttributeNS(SVG.xlink, 'href')).toBe(window.location + '#' + rect)
})

it('adopts the geometry of the target element', function() {
Expand Down
27 changes: 19 additions & 8 deletions src/helpers.js
Original file line number Diff line number Diff line change
Expand Up @@ -182,12 +182,23 @@ function fullBox(b) {
function idFromReference(url) {
var m = SVG.regex.reference.exec(url+'')

if (m) return m[3]
if (m && m[2] == location() && m[4]) return m[4]
}

function location() {
return window.location.href
.replace(window.location.hash, '')
}

// creates an url reference out of nodes id
function url(node) {
return 'url(' + window.location + '#' + node.id() + ')'
return 'url(' + location() + '#' + node.id() + ')'
}

function link(url) {
var match = SVG.regex.reference.exec(url)
if(!url || match[2]) return url
return location() + (match[3] || '')
}

function removePrefixFromReferences(node) {
Expand All @@ -197,10 +208,10 @@ function removePrefixFromReferences(node) {

var v = node.attributes, match
for (n = v.length - 1; n >= 0; n--) {
if(v[n].nodeName == 'xlink:href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(match[2] == window.location) v[n].nodeValue = '#' + (match[3] || '')
if(v[n].nodeName == 'href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(match[2] == location()) v[n].nodeValue = (match[3] || '')
}else if(match = SVG.regex.reference.exec(v[n].nodeValue)) {
if(match[1] && match[2] == window.location) v[n].nodeValue = 'url(#' + match[3] + ')'
if(match[1] && match[2] == location()) v[n].nodeValue = 'url(' + match[3] + ')'
}
}
}
Expand All @@ -212,10 +223,10 @@ function addPrefixToReferences(node) {

var v = node.attributes, match
for (n = v.length - 1; n >= 0; n--) {
if(v[n].nodeName == 'xlink:href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(!match[2]) v[n].nodeValue = window.location + '#' + (match[3] || '')
if(v[n].nodeName == 'href' && (match = SVG.regex.reference.exec(v[n].nodeValue))) {
if(!match[2]) v[n].nodeValue = location() + (match[3] || '')
}else if(match = SVG.regex.reference.exec(v[n].nodeValue)) {
if(match[1] && !match[2]) v[n].nodeValue = 'url(' + window.location + '#' + match[3] + ')'
if(match[1] && !match[2]) v[n].nodeValue = 'url(' + location() + match[3] + ')'
}
}
}
Expand Down
2 changes: 1 addition & 1 deletion src/hyperlink.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ SVG.A = SVG.invent({
, extend: {
// Link url
to: function(url) {
return this.attr('href', url, SVG.xlink)
return this.attr('href', link(url), SVG.xlink)
}
// Link show attribute
, show: function(target) {
Expand Down
2 changes: 1 addition & 1 deletion src/image.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ SVG.Image = SVG.invent({
}
}, this)

return this.attr('href', (img.src = url), SVG.xlink)
return this.attr('href', (img.src = link(url)), SVG.xlink)
}
}

Expand Down
2 changes: 1 addition & 1 deletion src/regex.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ SVG.regex = {
, rgb: /rgb\((\d+),(\d+),(\d+)\)/

// Parse reference url
, reference: /(url\()?([-\w:/.]+)?#([-\w]+)/
, reference: /(url\()?([-\w:/.]+)?(#([-\w]+))?/

// splits a transformation chain
, transforms: /\)\s*,?\s*/
Expand Down
2 changes: 1 addition & 1 deletion src/textpath.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ SVG.TextPath = SVG.invent({
this.node.appendChild(path.node)

// link textPath to path and add content
path.attr('href', '#' + track, SVG.xlink)
path.attr('href', link('#' + track), SVG.xlink)

return this
}
Expand Down
2 changes: 1 addition & 1 deletion src/use.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ SVG.Use = SVG.invent({
// Use element as a reference
element: function(element, file) {
// Set lined element
return this.attr('href', (file || '') + '#' + element, SVG.xlink)
return this.attr('href', link((file || '') + '#' + element), SVG.xlink)
}
}

Expand Down

0 comments on commit 4455a78

Please sign in to comment.