diff --git a/src/vectorizer.js b/src/vectorizer.js index 310baffc0..80eeea61f 100644 --- a/src/vectorizer.js +++ b/src/vectorizer.js @@ -31,8 +31,17 @@ V = Vectorizer = (function() { return 'v-' + id; } + // Replace all spaces with the Unicode No-break space (http://www.fileformat.info/info/unicode/char/a0/index.htm). + // IE would otherwise collapse all spaces into one. This is used in the text() method but it is + // also exposed so that the programmer can use it in case he needs to. This is useful e.g. in tests + // when you want to compare the actual DOM text content without having to add the unicode character in + // the place of all spaces. + function sanitizeText(text) { + return (text || '').replace(/ /g, '\u00A0'); + } + function isObject(o) { - return Object(o) === Object(o); + return o === Object(o); } function isArray(o) { @@ -355,6 +364,9 @@ V = Vectorizer = (function() { text: function(content, opt) { + // Replace all spaces with the Unicode No-break space (http://www.fileformat.info/info/unicode/char/a0/index.htm). + // IE would otherwise collapse all spaces into one. + content = sanitizeText(content); opt = opt || {}; var lines = content.split('\n'); var i = 0; @@ -487,11 +499,12 @@ V = Vectorizer = (function() { } else { - // Make sure the textContent is never empty. If it is, add an additional - // space (an invisible character) so that following lines are correctly + // Make sure the textContent is never empty. If it is, add a dummy + // character and make it invisible, making the following lines correctly // relatively positioned. `dy=1em` won't work with empty lines otherwise. vLine.addClass('v-empty-line'); - vLine.node.textContent = ' '; + vLine.node.style.opacity = 0; + vLine.node.textContent = '-'; } V(textNode).append(vLine); @@ -1337,6 +1350,8 @@ V = Vectorizer = (function() { return annotations; }; + V.sanitizeText = sanitizeText; + return V; })(); diff --git a/test/jointjs/basic.js b/test/jointjs/basic.js index da02ea655..838cf486f 100644 --- a/test/jointjs/basic.js +++ b/test/jointjs/basic.js @@ -40,7 +40,7 @@ test('construction', function() { equal(textEls.length, 1, 'there is exactly one element in the paper'); equal(rectEls.length, 1, 'there is exactly one element in the paper'); - equal(textEls[0].textContent, 'my rectangle', 'text element has a proper content'); + equal(textEls[0].textContent, V.sanitizeText('my rectangle'), 'text element has a proper content'); }); @@ -63,7 +63,7 @@ asyncTest('async: resetCells', function() { equal(textEls.length, 3, 'there is exactly 3 elements in the paper'); equal(rectEls.length, 3, 'there is exactly 3 elements in the paper'); - equal(textEls[0].textContent, 'my rectangle', 'text element has a proper content'); + equal(textEls[0].textContent, V.sanitizeText('my rectangle'), 'text element has a proper content'); start(); @@ -95,7 +95,7 @@ asyncTest('async: addCells', function() { equal(textEls.length, 5, 'there is exactly 5 elements in the paper'); equal(rectEls.length, 5, 'there is exactly 5 elements in the paper'); - equal(textEls[0].textContent, 'my rectangle', 'text element has a proper content'); + equal(textEls[0].textContent, V.sanitizeText('my rectangle'), 'text element has a proper content'); start(); @@ -620,8 +620,8 @@ test('clone()', function() { equal(textEls.length, 2, 'there are exactly two elements in the paper'); equal(rectEls.length, 2, 'there are exactly two elements in the paper'); - equal(textEls[0].textContent, 'my rectangle', 'text element has a proper content'); - equal(textEls[1].textContent, 'my rectangle', 'text element of the cloned element has a proper content'); + equal(textEls[0].textContent, V.sanitizeText('my rectangle'), 'text element has a proper content'); + equal(textEls[1].textContent, V.sanitizeText('my rectangle'), 'text element of the cloned element has a proper content'); checkBbox(this.paper, r2, 20, 30, 120, 80, 'cloned element is at the exact same position as the original element');