X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/c031ffaa79a223a05a4a58de2854c9855e94cc18..45bebc5c454ced236db27631004cc2628260f3c9:/src/editor/modules/documentCanvas/canvas/canvas.test.js diff --git a/src/editor/modules/documentCanvas/canvas/canvas.test.js b/src/editor/modules/documentCanvas/canvas/canvas.test.js index 642438a..be4a8b9 100644 --- a/src/editor/modules/documentCanvas/canvas/canvas.test.js +++ b/src/editor/modules/documentCanvas/canvas/canvas.test.js @@ -4,16 +4,17 @@ define([ 'libs/sinon', 'modules/documentCanvas/canvas/canvas', 'modules/documentCanvas/canvas/utils', -'wlxml/wlxml' -], function($, chai, sinon, canvas, utils, wlxml) { +'modules/documentCanvas/canvas/documentElement', +'wlxml/wlxml', +], function($, chai, sinon, canvas, utils, documentElement, wlxml) { 'use strict'; /* global describe, it, beforeEach, afterEach */ var expect = chai.expect; -var getCanvasFromXML = function(xml) { - return canvas.fromXMLDocument(getDocumentFromXML(xml)); +var getCanvasFromXML = function(xml, elements) { + return canvas.fromXMLDocument(getDocumentFromXML(xml), elements); }; var getDocumentFromXML = function(xml) { @@ -26,6 +27,17 @@ var wait = function(callback, timeout) { }; +describe('wtf', function() { + it('wtf!', function() { + var c = getCanvasFromXML('
Alice
'), + doc = c.wlxmlDocument; + + var txtNode = doc.root.contents()[0]; + txtNode.wrapWith({tagName: 'header', start: 1, end: 2}); + expect(c.doc().children().length).to.equal(3); + }); +}); + describe('new Canvas', function() { it('abc', function() { var doc = wlxml.WLXMLDocumentFromXML('
Alice has a cat!'), @@ -73,8 +85,8 @@ describe('Listening to document changes', function() { a.before(b); var sectionChildren = c.doc().children(); expect(sectionChildren.length).to.equal(2); - expect(sectionChildren[0].getWlxmlTag()).to.equal('b'); - expect(sectionChildren[1].getWlxmlTag()).to.equal('a'); + expect(sectionChildren[0].wlxmlNode.getTagName()).to.equal('b'); + expect(sectionChildren[1].wlxmlNode.getTagName()).to.equal('a'); }); it('Handling text node moved', function() { @@ -87,7 +99,7 @@ describe('Listening to document changes', function() { var sectionChildren = c.doc().children(); expect(sectionChildren.length).to.equal(2); expect(sectionChildren[0].getText()).to.equal('Alice'); - expect(sectionChildren[1].getWlxmlTag()).to.equal('a'); + expect(sectionChildren[1].wlxmlNode.getTagName()).to.equal('a'); }); it('Handles nodeTagChange event', function() { @@ -100,7 +112,7 @@ describe('Listening to document changes', function() { var headerNode = doc.root.contents()[0], headerElement = c.doc().children()[0]; - expect(headerElement.getWlxmlTag()).to.equal('header', 'element ok'); + expect(headerElement.wlxmlNode.getTagName()).to.equal('header', 'element ok'); /* Make sure we handle invalidation of reference to wlxmlNode after changing its tag */ expect(headerNode.getData('canvasElement').sameNode(headerElement)).to.equal(true, 'node->element'); @@ -113,7 +125,7 @@ describe('Listening to document changes', function() { aTextElement; canvas.fromXMLDocument(doc); - aTextElement = utils.findCanvasElementInParent(aTextNode, aTextNode.parent()); // TODO: This really should be easier... + aTextElement = utils.getElementForNode(aTextNode); aTextElement.setText(''); @@ -122,7 +134,7 @@ describe('Listening to document changes', function() { expect(aTextElement.getText({raw:true})).to.equal(utils.unicode.ZWS, 'canvas represents this as empty node'); aTextElement.wlxmlNode.detach(); expect(parent.children().length).to.equal(1); - expect(parent.children()[0].getWlxmlTag()).to.equal('span'); + expect(parent.children()[0].wlxmlNode.getTagName()).to.equal('span'); done(); }); }); @@ -167,6 +179,158 @@ describe('Displaying span nodes', function() { }); }); + +describe('Default document changes handling', function() { + it('handles added node', function() { + var c = getCanvasFromXML('
'); + c.wlxmlDocument.root.append({tagName:'div'}); + expect(c.doc().children().length).to.equal(1); + c.wlxmlDocument.root.prepend({tagName:'div'}); + expect(c.doc().children().length).to.equal(2); + + var node = c.wlxmlDocument.root.contents()[1]; + node.before({tagName: 'div'}); + expect(c.doc().children().length).to.equal(3); + node.after({tagName: 'div'}); + expect(c.doc().children().length).to.equal(4); + }); + + it('handles attribute value change for a class attribute', function() { + var c = getCanvasFromXML('
'); + c.wlxmlDocument.root.setAttr('class', 'test'); + expect(c.doc().wlxmlNode.getClass()).to.equal('test'); + }); + + it('handles detached node', function() { + var c = getCanvasFromXML('
'); + c.wlxmlDocument.root.contents()[0].detach(); + expect(c.doc().children().length).to.equal(0); + }); + + it('handles moved node', function() { + var doc = getDocumentFromXML('
'), + c = doc.root.contents()[0], + a = doc.root.contents()[1], + b = doc.root.contents()[2], + cv = canvas.fromXMLDocument(doc); + + a.document.transaction(function() { + a.before(b); // => cab + b.after(c); // => bca + }, { + error: function(e) {throw e;} + }); + + var sectionChildren = cv.doc().children(); + expect(sectionChildren.length).to.equal(3); + expect(sectionChildren[0].wlxmlNode.getTagName()).to.equal('b'); + expect(sectionChildren[1].wlxmlNode.getTagName()).to.equal('c'); + expect(sectionChildren[2].wlxmlNode.getTagName()).to.equal('a'); + }); + + it('handles moving text node to another parent', function() { + var c = getCanvasFromXML('
Alice
has
a cat.
'), + doc = c.wlxmlDocument, + text = doc.root.contents()[0], + div = doc.root.contents()[1]; + + div.append(text); + + var sectionChildren = c.doc().children(); + expect(sectionChildren.length).to.equal(2); + expect(sectionChildren[0].wlxmlNode.sameNode(div)).to.equal(true); + expect(sectionChildren[1].getText()).to.equal('a cat.'); + + expect(div.contents().length).to.equal(2); + expect(div.contents()[0].getTagName()).to.equal('span'); + expect(div.contents()[1].getText()).to.equal('Alice'); + }); + + it('handles change in a text node', function() { + var c = getCanvasFromXML('
Alice
'); + c.wlxmlDocument.root.contents()[0].setText('cat'); + expect(c.doc().children()[0].getText()).to.equal('cat'); + }); + + describe('Regression tests', function() { + it('handles moving node after its next neighbour correctly', function() { + var c = getCanvasFromXML('
'), + doc = c.wlxmlDocument, + a = doc.root.contents()[0], + b = doc.root.contents()[1]; + b.after(a); + var sectionChildren = c.doc().children(); + expect(sectionChildren[0].wlxmlNode.getTagName()).to.equal('b'); + expect(sectionChildren[1].wlxmlNode.getTagName()).to.equal('a'); + }); + }); +}); + +describe('Custom elements based on wlxml class attribute', function() { + it('allows custom rendering', function() { + var prototype = $.extend({}, documentElement.DocumentNodeElement.prototype, { + init: function() { + this._container().append(''); + } + }), + c = getCanvasFromXML('
', [ + {tag: 'div', klass: 'testClass', prototype: prototype} + ]); + + expect(c.doc().children()[0]._container().children('test').length).to.equal(1); // @! + }); + + it('allows handling changes to internal structure of rendered node', function() { + var prototype = $.extend({}, documentElement.DocumentNodeElement.prototype, { + init: function() { + this.header = $('

'); + this._container().append(this.header); + this.refresh2(); + }, + refresh2: function() { + this.header.text(this.wlxmlNode.contents().length); + }, + onNodeAdded: function(event) { + void(event); + this.refresh2(); + }, + onNodeTextChange: function(event) { + this.header.text(event.meta.node.getText()); + }, + children: function() { return []; } + }); + + var c = getCanvasFromXML('
', [ + {tag: 'div', klass: 'testClass', prototype: prototype} + ]); + + var node = c.wlxmlDocument.root.contents()[0], + element = node.getData('canvasElement'); + + var header = element.dom.find('h1'); + expect(header.text()).to.equal('1', 'just '); + + node.append({tagName: 'div'}); + + expect(header.text()).to.equal('2', 'added div'); + + var textNode = node.append({text: 'test'}); + + expect(header.text()).to.equal('3', 'added text node'); + + textNode.setText('test2'); + + expect(header.text()).to.equal('test2', 'text node change handled'); + }); + + describe('Handling unknown class', function() { + it('Inherits default behavior', function() { + var c = getCanvasFromXML('
Hi!
'); + expect(c.doc().children()[0].children()[0].getText()).to.equal('Hi!'); + }); + }); +}); + describe('Cursor', function() { /* globals Node */ var getSelection; @@ -192,7 +356,7 @@ describe('Cursor', function() { it('returns position when browser selection collapsed', function() { var c = getCanvasFromXML('
Alice has a cat
'), - dom = c.doc().dom(), + dom = c.doc().dom, text = findTextNode(dom, 'Alice has a cat'); expect(text.nodeType).to.equal(Node.TEXT_NODE, 'correct node selected'); @@ -226,7 +390,7 @@ describe('Cursor', function() { it('recognizes selection start and end on document order', function() { var c = getCanvasFromXML('
Alicehas a cat
abc...cde
'), - dom = c.doc().dom(), + dom = c.doc().dom, textFirst = findTextNode(dom, 'Alice'), textSecond = findTextNode(dom, 'has a cat'), textAbc = findTextNode(dom, 'abc'), @@ -327,7 +491,7 @@ describe('Cursor', function() { it('returns boundries of selection when browser selection not collapsed', function() { var c = getCanvasFromXML('
Alice has a big cat
'), - dom = c.doc().dom(), + dom = c.doc().dom, text = { alice: findTextNode(dom, 'Alice '), has: findTextNode(dom, 'has'), @@ -359,7 +523,7 @@ describe('Cursor', function() { it('recognizes when browser selection boundries lies in sibling DocumentTextElements', function() { var c = getCanvasFromXML('
Alice has a big cat
'), - dom = c.doc().dom(), + dom = c.doc().dom, text = { alice: findTextNode(dom, 'Alice '), has: findTextNode(dom, 'has'),