X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/87b31095331eab98415b37dbd2138cbd6a598b37..e08fcc47d3991b7e72a87f49104ec403a7b79151:/src/smartxml/smartxml.test.js diff --git a/src/smartxml/smartxml.test.js b/src/smartxml/smartxml.test.js index 90f7680..5d1ca3e 100644 --- a/src/smartxml/smartxml.test.js +++ b/src/smartxml/smartxml.test.js @@ -60,6 +60,15 @@ describe('smartxml', function() { expect(emptyTextNode.getText()).to.equal('', 'empty ok'); expect(nonEmptyTextNode.getText()).to.equal('alice', 'non empty ok'); }); + + it('creates nodes from xml strings', function() { + var doc = getDocumentFromXML('
'), + node = doc.createDocumentNode('Alice'); + expect(node.getTagName()).to.equal('a'); + expect(node.contents().length).to.equal(2); + expect(node.contents()[0].getText()).to.equal('Alice'); + expect(node.contents()[1].getTagName()).to.equal('b'); + }); }); describe('DocumentNode', function() { @@ -77,6 +86,31 @@ describe('smartxml', function() { }); }); + it('can be cloned with its contents and its contents data', function() { + var doc = getDocumentFromXML('
'), + root = doc.root, + div = root.contents()[0]; + + var ClonableObject = function(arg) { + this.arg = arg; + }; + ClonableObject.prototype.clone = function() { + return new ClonableObject(this.arg); + }; + + div.setData('key', 'value'); + div.setData('clonableObject', new ClonableObject('test')); + + var rootClone = root.clone(), + divClone = rootClone.contents()[0], + stringClone = divClone.getData('key'), + objClone = divClone.getData('clonableObject'); + + expect(stringClone).to.equal('value'); + expect(objClone.arg).to.equal('test', 'clonable object got copied'); + expect(objClone !== div.getData('clonableObject')).to.be.equal(true, 'copy of the clonable object is a new object'); + }); + it('knows its path in the document tree', function() { var doc = getDocumentFromXML('text'), root = doc.root, @@ -135,40 +169,16 @@ describe('smartxml', function() { it('can change tag name', function() { var node = elementNodeFromXML('
'); - node.setTag('span'); + node = node.setTag('span'); expect(node.getTagName()).to.equal('span'); }); - it('emits nodeTagChange event', function() { - var node = elementNodeFromXML('
'), - spy = sinon.spy(); - - node.document.on('change', spy); - node.setTag('span'); - var event = spy.args[0][0]; - - expect(event.type).to.equal('nodeTagChange'); - expect(event.meta.node.sameNode(node)).to.be.true; - expect(event.meta.oldTagName).to.equal('div'); - }); - describe('Implementation specific expectations', function() { - // DOM specifies ElementNode tag as a read-only property, so - // changing it in a seamless way is a little bit tricky. For this reason - // the folowing expectations are required, despite the fact that they actually are - // motivated by implemetation details. - - it('keeps node in the document', function() { - var doc = getDocumentFromXML('
'), - header = doc.root.contents()[0]; - header.setTag('span'); - expect(header.parent().sameNode(doc.root)).to.be.true; - }); it('keeps custom data', function() { var node = elementNodeFromXML('
'); node.setData('key', 'value'); - node.setTag('header'); + node = node.setTag('header'); expect(node.getTagName()).to.equal('header'); expect(node.getData()).to.eql({key: 'value'}); @@ -180,12 +190,13 @@ describe('smartxml', function() { expect(doc.root.getTagName()).to.equal('span'); }); - it('keeps contents', function() { + it('keeps node contents', function() { var node = elementNodeFromXML('
'); - node.setTag('header'); + node = node.setTag('header'); expect(node.contents()).to.have.length(1); }); }); + }); describe('Setting node attributes', function() { it('can set node attribute', function() { @@ -208,8 +219,6 @@ describe('smartxml', function() { expect(event.meta.oldVal).to.equal('value1'); }); }); - - }); }); describe('Basic TextNode properties', function() { @@ -301,10 +310,65 @@ describe('smartxml', function() { }); }); + describe('Dividing text node into two with element node', function() { + it('can divide text node with element node, splitting text node into two', function() { + var doc = getDocumentFromXML('
Alice has a cat
'), + text = doc.root.contents()[0]; + + var returned = text.divideWithElementNode({tagName: 'aside'}, {offset: 5}), + contents = doc.root.contents(), + lhsText = contents[0], + rhsText = contents[2]; + + expect(lhsText.getText()).to.equal('Alice'); + expect(returned.sameNode(contents[1])); + expect(rhsText.getText()).to.equal(' has a cat'); + }); + + it('treats dividing at the very end as appending after it', function() { + var doc = getDocumentFromXML('
Alice has a cat
'), + text = doc.root.contents()[0]; + + + var returned = text.divideWithElementNode({tagName: 'aside'}, {offset: 15}), + contents = doc.root.contents(), + textNode = contents[0], + elementNode = contents[1]; + + expect(contents.length).to.equal(2); + expect(textNode.getText()).to.equal('Alice has a cat'); + expect(returned.sameNode(elementNode)).to.be.true; + expect(elementNode.getTagName()).to.equal('aside'); + }); + + it('treats dividing at the very beginning as prepending before it', function() { + var doc = getDocumentFromXML('
Alice has a cat
'), + text = doc.root.contents()[0]; + + var returned = text.divideWithElementNode({tagName: 'aside'}, {offset: 0}), + contents = doc.root.contents(), + textNode = contents[1], + elementNode = contents[0]; + + expect(contents.length).to.equal(2); + expect(textNode.getText()).to.equal('Alice has a cat'); + expect(returned.sameNode(elementNode)).to.be.true; + expect(elementNode.getTagName()).to.equal('aside'); + }); + }); }); describe('Manipulations', function() { + describe('detaching nodes', function() { + it('can detach document root node', function() { + var doc = getDocumentFromXML('
'); + + doc.root.detach(); + expect(doc.root).to.equal(null); + }); + }); + describe('replacing node with another one', function() { it('replaces node with another one', function() { var doc = getDocumentFromXML('
'), @@ -378,12 +442,95 @@ describe('smartxml', function() { expect(node1.contents()[1].sameNode(node2)).to.be.true; }); - it('wraps element node with another element node', function() { + describe('adding text nodes', function() { + it('merges text nodes on append', function() { + var doc = getDocumentFromXML('text1'), + returned; + returned = doc.root.append({text: 'text2'}); + expect(doc.root.contents().length).to.equal(1); + expect(returned.sameNode(doc.root.contents()[0])).to.equal(true, 'modified node returned'); + expect(doc.root.contents()[0].getText()).to.equal('text1text2'); + }); + + it('merges text nodes on prepend', function() { + var doc = getDocumentFromXML('text1'), + returned; + returned = doc.root.prepend({text: 'text2'}); + expect(doc.root.contents().length).to.equal(1); + expect(returned.sameNode(doc.root.contents()[0])).to.equal(true, 'modified node returned'); + expect(doc.root.contents()[0].getText()).to.equal('text2text1'); + }); + + it('merges text nodes on before text node', function() { + var doc = getDocumentFromXML('text1'), + textNode = doc.root.contents()[0], + returned; + returned = textNode.before({text: 'text2'}); + expect(doc.root.contents().length).to.equal(1); + expect(returned.sameNode(doc.root.contents()[0])).to.equal(true, 'modified node returned'); + expect(doc.root.contents()[0].getText()).to.equal('text2text1'); + }); + + it('merges text nodes on after text node', function() { + var doc = getDocumentFromXML('text1'), + textNode = doc.root.contents()[0], + returned; + returned = textNode.after({text: 'text2'}); + expect(doc.root.contents().length).to.equal(1); + expect(returned.sameNode(doc.root.contents()[0])).to.equal(true, 'modified node returned'); + expect(doc.root.contents()[0].getText()).to.equal('text1text2'); + }); + + it('merges text nodes on before element node', function() { + var doc = getDocumentFromXML('text1
'), + textNode = doc.root.contents()[0], + div = doc.root.contents()[1], + returned; + returned = div.before({text: 'text2'}); + expect(doc.root.contents().length).to.equal(2); + expect(returned.sameNode(doc.root.contents()[0])).to.equal(true, 'modified node returned'); + expect(textNode.getText()).to.equal('text1text2'); + }); + + it('merges text nodes on after element node', function() { + var doc = getDocumentFromXML('
text1'), + textNode = doc.root.contents()[1], + div = doc.root.contents()[0], + returned; + returned = div.after({text: 'text2'}); + expect(doc.root.contents().length).to.equal(2); + expect(returned.sameNode(doc.root.contents()[1])).to.equal(true, 'modified node returned'); + expect(textNode.getText()).to.equal('text2text1'); + }); + }); + + it('wraps root element node with another element node', function() { var node = elementNodeFromXML('
'), wrapper = elementNodeFromXML(''); node.wrapWith(wrapper); expect(node.parent().sameNode(wrapper)).to.be.true; + expect(node.document.root.sameNode(wrapper)).to.be.true; + }); + + it('wraps element node with another element node', function() { + var doc = getDocumentFromXML('
'), + div = doc.root.contents()[0]; + + var wrapper = div.wrapWith({tagName: 'wrapper'}); + expect(wrapper.sameNode(doc.root.contents()[0])).to.equal(true, '1'); + expect(div.parent().sameNode(wrapper)).to.equal(true, '2'); + expect(wrapper.contents()[0].sameNode(div)).to.equal(true, '3'); + }); + + it('wraps element outside of document tree', function() { + var doc = getDocumentFromXML('
'), + node = doc.createDocumentNode({tagName: 'node'}); + + node.wrapWith({tagName: 'wrapper'}); + expect(node.parent().getTagName()).to.equal('wrapper'); + expect(node.parent().contents()[0].sameNode(node)).to.be.true; + expect(doc.root.getTagName()).to.equal('section'); }); it('unwraps element node contents', function() { @@ -502,6 +649,176 @@ describe('smartxml', function() { }); + var getTextNodes = function(text, doc) { + /* globals Node */ + var toret = []; + var search = function(node) { + node.contents().forEach(function(node) { + if(node.nodeType === Node.TEXT_NODE) { + if(node.getText() === text) { + toret.push(node); + } + } else { + search(node); + } + }); + }; + search(doc.root); + return toret; + }; + + var getTextNode = function(text, doc) { + var nodes = getTextNodes(text, doc), + error; + if(nodes.length === 0) { + error = 'Text not found'; + } else if(nodes.length > 1) { + error = 'Text not unique'; + } else if(nodes[0].getText() !== text) { + error = 'I was trying to cheat your test :('; + } + if(error) { + throw new Error(error); + } + return nodes[0]; + }; + + describe('Removing arbitrary text', function() { + it('removes within single text element', function() { + var doc = getDocumentFromXML('
Alice
'), + text = getTextNode('Alice', doc); + doc.deleteText({ + from: { + node: text, + offset: 1 + }, + to: { + node: text, + offset: 4 + } + }); + expect(doc.root.contents().length).to.equal(1); + expect(doc.root.contents()[0].getText()).to.equal('Ae'); + }); + it('removes across elements - 1', function() { + var doc = getDocumentFromXML('
aaabbb
'); + + doc.deleteText({ + from: { + node: getTextNode('aaa', doc), + offset: 2 + }, + to: { + node: getTextNode('bbb', doc), + offset: 2 + } + }); + + var contents = doc.root.contents(); + expect(contents.length).to.equal(2); + expect(contents[0].contents()[0].getText()).to.equal('aa'); + expect(contents[1].contents()[0].getText()).to.equal('b'); + }); + it('removes across elements - 2', function() { + var doc = getDocumentFromXML('cccxxx'); + doc.deleteText({ + from: { + node: getTextNode('ccc', doc), + offset: 2 + }, + to: { + node: getTextNode('xxx', doc), + offset: 2 + } + }); + + var contents = doc.root.contents(); + expect(contents.length).to.equal(2); + expect(contents[0].getTagName()).to.equal('b'); + expect(contents[1].getText()).to.equal('x'); + + var bContents = contents[0].contents(); + expect(bContents.length).to.equal(1); + expect(bContents[0].getTagName()).to.equal('c'); + expect(bContents[0].contents().length).to.equal(1); + expect(bContents[0].contents()[0].getText()).to.equal('cc'); + }); + it('remove across elements - 3 (merged text nodes)', function() { + var doc = getDocumentFromXML('
Alice has a cat
'); + doc.deleteText({ + from: { + node: getTextNode('Alice ', doc), + offset: 1 + }, + to: { + node: getTextNode(' a cat', doc), + offset: 3 + } + }); + var contents = doc.root.contents(); + expect(contents.length).to.equal(1); + expect(contents[0].getText()).to.equal('Acat'); + }); + it('remove across elements - 4', function() { + var doc = getDocumentFromXML('
Alice
has a cat
'); + doc.deleteText({ + from: { + node: getTextNode('Alice ', doc), + offset: 1 + }, + to: { + node: getTextNode(' cat', doc), + offset: 1 + } + }); + var contents = doc.root.contents(); + expect(contents.length).to.equal(2); + expect(contents[0].getText()).to.equal('A'); + expect(contents[1].getTagName()).to.equal('div'); + expect(contents[1].contents().length).to.equal(1); + expect(contents[1].contents()[0].getText()).to.equal('cat'); + }); + it('removes across elements - 5 (whole document)', function() { + var doc = getDocumentFromXML('
Alice
has a cat
!!!
'); + doc.deleteText({ + from: { + node: getTextNode('Alice ', doc), + offset: 0 + }, + to: { + node: getTextNode('!!!', doc), + offset: 3 + } + }); + + expect(doc.root.getTagName()).to.equal('div'); + expect(doc.root.contents().length).to.equal(1); + expect(doc.root.contents()[0].getText()).to.equal(''); + }); + it('removes nodes in between', function() { + var doc = getDocumentFromXML('
aaa!xxx!bbb
'); + doc.deleteText({ + from: { + node: getTextNode('aaa', doc), + offset: 2 + }, + to: { + node: getTextNode('bbb', doc), + offset: 2 + } + }); + + var contents = doc.root.contents(); + expect(contents.length).to.equal(2, 'two nodes survived'); + expect(contents[0].getTagName()).to.equal('a'); + expect(contents[1].getTagName()).to.equal('b'); + expect(contents[0].contents().length).to.equal(1); + expect(contents[0].contents()[0].getText()).to.equal('aa'); + expect(contents[1].contents().length).to.equal(1); + expect(contents[1].contents()[0].getText()).to.equal('b'); + }); + }); + describe('Splitting text', function() { it('splits TextNode\'s parent into two ElementNodes', function() { @@ -620,6 +937,7 @@ describe('smartxml', function() { expect(spy.callCount).to.equal(1); expect(event.type).to.equal('nodeMoved'); expect(event.meta.node.sameNode(appended)).to.be.true; + expect(node.document.root.sameNode(event.meta.parent)).to.equal(true, 'previous parent attached to event meta'); }); it('emits nodeAdded event when prepending new node', function() { @@ -736,15 +1054,14 @@ describe('smartxml', function() { expect(event.meta.node.sameNode(a)); }); - it('doesn\'t emit nodeDetached event for already out of document moved to out of document node: ' + insertionMethod, function() { + it('doesn\'t emit nodeDetached event for already out of document node moved to out of document node' + insertionMethod, function() { var doc = getDocumentFromXML('
'), - a = doc.root.contents()[0], spy = sinon.spy(); doc.on('change', spy); var newNode = doc.createDocumentNode({tagName: 'b'}); - var newNodeInner = newNode.append({tagName:'c'}); + newNode.append({tagName:'c'}); expect(spy.callCount).to.equal(0); }); @@ -800,6 +1117,16 @@ describe('smartxml', function() { expect(siblingParents.node1.sameNode(aliceText)).to.equal(true, 'aliceText'); expect(siblingParents.node2.sameNode(span)).to.equal(true, 'span'); }); + + it('returns node itself for two same nodes', function() { + var doc = getDocumentFromXML('
'), + div = doc.root.contents()[0]; + + var siblingParents = doc.getSiblingParents({node1: div, node2: div}); + expect(!!siblingParents.node1 && !!siblingParents.node2).to.equal(true, 'nodes defined'); + expect(siblingParents.node1.sameNode(div)).to.be.equal(true, 'node1'); + expect(siblingParents.node2.sameNode(div)).to.be.equal(true, 'node2'); + }); }); }); @@ -831,7 +1158,7 @@ describe('smartxml', function() { }); describe('Extension API', function() { - var doc, extension, elementNode, textNode, testClassNode; + var doc, extension, elementNode, textNode; beforeEach(function() { doc = getDocumentFromXML('
Alice
'); @@ -1060,6 +1387,7 @@ describe('smartxml', function() { var sampleMethod = function(val) { this._$.attr('x', val); + this.triggerChangeEvent(); }; var transformations = { @@ -1156,10 +1484,12 @@ describe('smartxml', function() { doc.registerExtension({elementNode: {transformations: { nested: function(v) { this._$.attr('innerAttr', v); + this.triggerChangeEvent(); }, outer: function(v) { this.nested(v); this._$.attr('outerAttr', v); + this.triggerChangeEvent(); } }}}); @@ -1190,60 +1520,189 @@ describe('smartxml', function() { expect(doc.root.getAttr('outerAttr')).to.equal('test2'); }); - // it('does work', function() { - // var doc = getDocumentFromXML('
Alice
'), - // span = doc.root.contents()[0]; - // span.transform('smartxml.detach'); + it('ignores transformation if document didn\'t emit change event', function() { + var doc = getDocumentFromXML('
'); + doc.registerExtension({elementNode: {transformations: { + test: function() { + // empty + } + }}}); - // doc.undo(); + doc.root.test(); + expect(doc.undoStack.length).to.equal(0); - // expect(doc.root.contents()).to.have.length(1); - // expect(doc.root.contents()[0].getTagName()).to.equal('span'); - // expect(doc.root.contents()[0].contents()[0].getText()).to.equal('Alice'); + }); - // doc.redo(); - // expect(doc.root.contents()).to.have.length(0); + describe('Transactions', function() { + it('allows to undo/redo series of transformations at once', function() { + var doc = getDocumentFromXML('
'); - // doc.undo(); - // expect(doc.root.contents()).to.have.length(1); - // expect(doc.root.contents()[0].getTagName()).to.equal('span'); - // expect(doc.root.contents()[0].contents()[0].getText()).to.equal('Alice'); + doc.registerExtension({ + elementNode: {transformations: { + test: function(v) { + this.setAttr('test', v); + } + }} + }); - // }); - // it('does work - merged text nodes case', function() { - // var doc = getDocumentFromXML('
Alice has a cat.
'), - // span = doc.root.contents()[1]; + doc.startTransaction(); + doc.root.test('1'); + doc.root.test('2'); + doc.root.test('3'); + doc.endTransaction(); + + doc.undo(); + expect(doc.root.getAttr('test'), '1'); + doc.redo(); + expect(doc.root.getAttr('test'), '3'); + doc.undo(); + expect(doc.root.getAttr('test'), '1'); + doc.redo(); + expect(doc.root.getAttr('test'), '3'); + }); - // span.transform('smartxml.detach'); + it('ignores empty transactions', function() { + var doc = getDocumentFromXML('
'); + doc.startTransaction(); + doc.endTransaction(); + expect(doc.undoStack).to.have.length(0, 'empty transaction doesn\'t get pushed into undo stack'); + }); + it('doesn\'t break on optimizations', function() { + // This is a smoke test checking if optimizations made to transaction undoing + // doesnt't break anything. + var doc = getDocumentFromXML('
'); + + doc.registerExtension({ + elementNode: {transformations: { + unaware: function(v) { + this.setAttr('unware', v); + this.triggerChangeEvent(); + }, + smart: { + impl: function(t, v) { + t.oldVal = this.getAttr('smart'); + this.setAttr('smart', v); + this.triggerChangeEvent(); + }, + undo: function(t) { + this.setAttr('smart', t.oldVal); + this.triggerChangeEvent(); + } + } + }} + }); - // doc.undo(); + doc.startTransaction(); + doc.root.smart('2'); + doc.root.unaware('2'); + doc.root.smart('3'); + doc.root.unaware('3'); + doc.endTransaction(); - // expect(doc.root.contents().length).to.equal(3); - // //console.log(doc.toXML()); - // expect(doc.root.contents()[1].contents()[0].getText()).to.equal('has'); + doc.undo(); - // }); - // it('dbg - don not store nodes in tranformation state!', function() { - // var doc = getDocumentFromXML('
'), - // a = doc.root.contents()[0], - // b = doc.root.contents()[1]; + expect(doc.root.getAttr('smart')).to.equal('1'); + expect(doc.root.getAttr('unaware')).to.equal('1'); + }); - // a.transform('smartxml.detach'); - // b.transform('smartxml.detach'); - // doc.undo(); - // doc.undo(); - // expect(doc.root.contents().length).to.equal(2); - // expect(doc.root.contents()[0].getTagName()).to.equal('a'); - // expect(doc.root.contents()[1].getTagName()).to.equal('b'); + it('can have associated metadata', function() { + var doc = getDocumentFromXML('
'), + metadata = Object.create({}); - // doc.redo(); - // doc.redo(); - // expect(doc.root.contents().length).to.equal(0); + doc.registerExtension({document: {transformations: { + test: function() { + this.trigger('change'); + } + }}}); - // }); + doc.startTransaction(metadata); + doc.test(); + doc.endTransaction(); + + var transaction = doc.undoStack[0]; + expect(transaction.metadata).to.equal(metadata); + }); + + it('can be rolled back', function() { + var doc = getDocumentFromXML(''); + + doc.startTransaction(); + doc.root.append({tagName: 'div'}); + doc.rollbackTransaction(); + + expect(doc.undoStack.length).to.equal(0, 'nothing to undo'); + expect(doc.root.contents().length).to.equal(0); + }); + + it('rollbacks and calls error handleor if error gets thrown', function() { + var doc = getDocumentFromXML(''), + err = new Error(), + spy = sinon.spy(); + + doc.transaction(function() { + doc.root.append({tagName: 'div'}); + throw err; + }, {error: spy}); + + expect(spy.args[0][0]).to.equal(err); + expect(doc.root.contents().length).to.equal(0); + expect(doc.undoStack.length).to.equal(0); + }); + }); + + describe('Regression tests', function() { + it('redos correctly after running its own undo followed by unaware transformation undo', function() { + var doc = getDocumentFromXML('
'); + + doc.registerExtension({elementNode: {transformations: { + unaware: function() { + this.triggerChangeEvent(); + }, + test: { + impl: function() { + this._$.attr('t', 1); + this.triggerChangeEvent(); + }, + undo: function() { + this._$.attr('t', 0); + } + } + }}}); + doc.root.unaware(); + doc.root.test(); + doc.undo(); + doc.undo(); + doc.redo(); + doc.redo(); + expect(doc.root.getAttr('t')).to.equal('1'); + }); + it('can perform undo of an operation performed after automatic transaction rollback', function() { + var doc = getDocumentFromXML('
'), + extension = {document: {transformations: { + throwingTransformation: function() { throw new Error(); } + }}}; + + doc.registerExtension(extension); + + doc.throwingTransformation(); + + doc.transaction(function() { + doc.root.setAttr('x', '2'); + }); + + expect(doc.undoStack.length).to.equal(1); + expect(doc.root.getAttr('x')).to.equal('2'); + + doc.undo(); + + expect(doc.undoStack.length).to.equal(0); + expect(doc.root.getAttr('x')).to.be.undefined; + + }); + }); }); });