X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/7234259fa025569d6a7682aa6c74fdcfb3ca7e17..72dfc92f908add69b4d862e9b6c3107e2a8acd21:/modules/documentCanvas/tests/canvas.test.js?ds=sidebyside diff --git a/modules/documentCanvas/tests/canvas.test.js b/modules/documentCanvas/tests/canvas.test.js index 57ad625..5dc017b 100644 --- a/modules/documentCanvas/tests/canvas.test.js +++ b/modules/documentCanvas/tests/canvas.test.js @@ -1,140 +1,326 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/chai', -'./utils.js', -'modules/documentCanvas/canvas' -], function($, chai, utils, canvas) { - - 'use strict'; - - var assert = chai.assert; - - assert.xmlEqual = function(lhsText, rhsText) { - var cleanLhs = utils.cleanUp(lhsText); - var cleanRhs = utils.cleanUp(rhsText); - - var lhs = $(cleanLhs); - var rhs = $(cleanRhs); - - this.equal(lhs.length, 1); - this.equal(rhs.length, 1); - - lhs = lhs.get(0); - rhs = rhs.get(0); - - var test = lhs.isEqualNode(rhs); - if(!test) { - console.log(cleanLhs); - console.log(cleanRhs); - } - return this.ok(test, 'xmls are equal'); - }; - - var retrievingTest = function(title, xml) { - test(title, function() { - var c = new canvas.Canvas(xml); - assert.xmlEqual(c.toXML(), xml); - }); - }; - - suite('Basic document retrieving', function() { - test('empty document', function() { - var c = new canvas.Canvas(''); - assert.equal(c.toXML(), ''); - }); - retrievingTest('empty tag', '
'); - retrievingTest('tag with content', '
Some text
'); - retrievingTest('tag with class', '
'); - }); - - suite('Nodes', function() { - test('getting nodes via selector', function() { - var c = new canvas.Canvas('
Header 1
'); - var header = c.getNode({tag: 'header'})[0]; - assert.equal(header.tag, 'header'); - assert.equal(header.klass, 'some-class'); - }); - - test('getting previous node', function() { - var c = new canvas.Canvas('
Div 1
Div 2
'); - var secondDiv = c.getNode({tag: 'div'})[1]; - var firstDiv = c.getPreviousNode({node: secondDiv}); - assert.equal(firstDiv.klass, 'some-class'); - }) - - test('pervious node of node without "previous siblings" is its parent', function() { - var c = new canvas.Canvas('
Div 1
'); - var div = c.getNode({tag: 'div'})[0]; - var section = c.getPreviousNode({node: div}); - assert.equal(section.tag, 'section'); - }) - - test('inserting after', function() { - var c = new canvas.Canvas('
Header 1
'); - var header = c.getNode({tag: 'header'})[0]; - c.insertNode({place: 'after', context: header, tag: 'div', klass: 'some.class'}); - assert.xmlEqual(c.toXML(), '
Header 1
'); - }); - - test('wrap text in node', function() { - var c = new canvas.Canvas('
Header 1
'); - var header = c.getNode({tag: 'header'})[0]; - c.insertNode({place: 'wrapText', context: header, tag: 'span', klass: 'url', offsetStart: 1, offsetEnd: 6}); - assert.xmlEqual(c.toXML(), '
Header 1
'); - }); - - test('split node', function() { - var c = new canvas.Canvas('
Header 1
'); - var header = c.getNode({tag: 'header'})[0]; - c.splitNode({node: header, offset: 4}); - assert.xmlEqual(c.toXML(), '\ -
\ -
Head
\ -
er 1
\ -
' - ); - }); - - test('split node with subnodes', function() { - var c = new canvas.Canvas('
Fancy and nice header 1
'); - var header = c.getNode({tag: 'header'})[0]; - c.splitNode({node: header, textNodeIdx: 0, offset: 5}); - assert.xmlEqual(c.toXML(), '\ -
\ -
Fancy
\ -
and nice header 1
\ -
' - ); - }); - - test('remove node', function() { - var c = new canvas.Canvas('
Fancy and nice header 1
'); - var span = c.getNode({tag: 'span'})[0]; - var siblings = c.removeNode({node:span}); - assert.xmlEqual(c.toXML(), '\ -
\ -
Fancy and nice 1
\ -
' - ); - }); - - test('list', function() { - var c = new canvas.Canvas('
Alice
has
a cat
'); - var div1 = c.getNode({tag:'div'})[0]; - var div2 = c.getNode({tag:'div'})[1]; - - c.createList({start: div1, end: div2}); - - assert.xmlEqual(c.toXML(), '\ -
\ -
\ -
Alice
\ -
has
\ -
a cat
\ -
\ -
'); - - }); - }); - +define([ +'libs/jquery-1.9.1.min', +'libs/chai', +'./utils.js', +'modules/documentCanvas/canvas', +'modules/documentCanvas/canvasNode' +], function($, chai, utils, canvas, canvasNode) { + + 'use strict'; + + var assert = chai.assert; + var assertDomEqual = utils.assertDomEqual; + + + suite('Quering nodes', function() { + test('getting preceding node', function() { + var c = canvas.create('
a
b
'); + var secondP = c.findNodes({tag: 'p'})[1]; + var firstP = c.getPrecedingNode({node: secondP}); + assert.equal(firstP.getContent(), 'a'); + }); + + test('pervious node of node without "previous siblings" is its parent', function() { + var c = canvas.create('
a
'); + var paragraph = c.findNodes({tag: 'p'})[0]; + assert.equal(c.getPrecedingNode({node: paragraph}).getTag(), 'section'); + }); + + }); + + + suite('Inserting nodes', function() { + test('append node to root', function() { + var c = canvas.create(); + var node = canvasNode.create({tag: 'header', klass: 'some-class'}); + c.nodeAppend({node: node, to: 'root'}); + assertDomEqual(c.getContent(), '
'); + }); + + test('append node to another node', function() { + var c = canvas.create('
'); + var node = canvasNode.create({tag: 'header', klass: 'some-class'}); + var to = c.findNodes('div')[0]; + c.nodeAppend({node: node, to: to}); + assertDomEqual(c.getContent(), '
'); + }); + + test('insert node after another node', function() { + var c = canvas.create('
'); + var node = canvasNode.create({tag: 'header', klass: 'some-class'}); + var after = c.findNodes('div')[0]; + c.nodeInsertAfter({node: node, after: after}); + assertDomEqual(c.getContent(), '
'); + }); + + test('wrap text in node', function() { + var c = canvas.create('
Header 1
'); + var header = c.findNodes({tag: 'header'})[0]; + var wrapper = canvasNode.create({tag: 'aside'}); + c.nodeWrap({inside: header, _with: wrapper, offsetStart: 1, offsetEnd: 6}); + assertDomEqual(c.getContent(), '
Header 1
'); + }); + + test('wrap text in node - text not a first node', function() { + var c = canvas.create('
Alice has a cat
'); + var header = c.findNodes({tag: 'header'})[0]; + var wrapper = canvasNode.create({tag: 'aside'}); + c.nodeWrap({inside: header, _with: wrapper, offsetStart: 1, offsetEnd: 4, textNodeIdx: 2}); + assertDomEqual(c.getContent(), '
Alice has a cat
'); + }); + + test('wrap text with nodes inside', function() { + var c = canvas.create('
Alice has a small cat
'); + var header = c.findNodes({tag: 'header'})[0]; + var wrapper = canvasNode.create({tag: 'aside'}); + c.nodeWrap({inside: header, _with: wrapper, offsetStart: 6, offsetEnd: 4, textNodeIdx: [0,2]}); + assertDomEqual(c.getContent(), '
Alice has a small cat
'); + }); + + test('unwrap text', function() { + var c = canvas.create('
Alice has a cat
'); + var span = c.findNodes({tag:'span'})[0]; + c.nodeUnwrap({node: span}); + assertDomEqual(c.getContent(), '
Alice has a cat
'); + }); + + test('unwrap text - first text node', function() { + var c = canvas.create('
Alice has a cat
'); + var span = c.findNodes({tag:'span'})[0]; + c.nodeUnwrap({node: span}); + assertDomEqual(c.getContent(), '
Alice has a cat
'); + }); + + test('unwrap text - only text node', function() { + var c = canvas.create('
Alice
'); + var span = c.findNodes({tag:'span'})[0]; + c.nodeUnwrap({node: span}); + assertDomEqual(c.getContent(), '
Alice
'); + }); + + + test('unwrap text - non text neighbours', function() { + var c = canvas.create('
a
Alice
b
'); + var span = c.findNodes({tag:'span'})[0]; + c.nodeUnwrap({node: span}); + assertDomEqual(c.getContent(), '
a
Alice
b
'); + }); + + test('split node', function() { + var c = canvas.create('
Header 1
'); + var header = c.findNodes({tag: 'header'})[0]; + var newNode = c.nodeSplit({node: header, offset: 4}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
Head
\ +
er 1
\ +
')); + assert.ok(newNode.isSame(c.findNodes({tag: 'header'})[1])); + }); + + test('split root node', function() { + var c = canvas.create('
cat
'); + var header = c.findNodes({tag: 'header'})[0]; + var newNode = c.nodeSplit({node: header, offset: 1}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
c
\ +
at
')); + assert.ok(newNode.isSame(c.findNodes({tag: 'header'})[1])); + }); + + test('split node with subnodes', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
Fancy and niceheader 1
\ +
')); + var header = c.findNodes({tag: 'header'})[0]; + var newNode = c.nodeSplit({node: header, offset: 5}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
Fancy
\ +
and niceheader 1
\ +
')); + }); + + test('remove node', function() { + var c = canvas.create('
some text
'); + var span = c.findNodes({tag: 'span'})[0]; + c.nodeRemove({node: span}); + assertDomEqual(c.getContent(), '
'); + }); + }); + + + suite('Lists', function() { + test('create from existing nodes', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
alice
\ + has\ +
a
\ +
cat
\ +
or not
\ +
' + )); + + var div_alice = c.findNodes({tag: 'div'})[0]; + var div_cat = c.findNodes({tag:'div'})[2]; + + c.listCreate({start: div_alice, end: div_cat}); + + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
\ +
alice
\ +
has
\ +
a
\ +
cat
\ +
\ +
or not
\ +
')); + }); + + test('create from existing nodes - start/end order doesn\'t matter', function() { + var html = utils.cleanUp('\ +
alice
\ +
cat
'); + var expected = utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
'); + + var c = canvas.create(html); + var div_alice = c.findNodes({tag: 'div'})[0]; + var div_cat = c.findNodes({tag:'div'})[1]; + c.listCreate({start: div_cat, end: div_alice}); + assertDomEqual(c.getContent(), expected); + + c = canvas.create(html); + div_alice = c.findNodes({tag: 'div'})[0]; + div_cat = c.findNodes({tag:'div'})[1]; + c.listCreate({start: div_alice, end: div_cat}); + assertDomEqual(c.getContent(), expected); + }); + + test('remove', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
\ +
alice
\ +
cat
\ +
\ +
')); + var item = c.findNodes({klass: 'item'})[1]; + c.listRemove({pointer: item}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
')); + }); + + test('checking if node is inside a list', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
\ +
alice \ +
cat
\ +
\ +
')); + assert.ok(c.nodeInsideList({node: c.findNodes({klass: 'item'})[1]}), 'item is inside a list'); + assert.ok(c.nodeInsideList({node: c.findNodes({tag: 'span'})[0]}), 'things nested in item are inside a list'); + }); + + test('moving items to nested list', function() { + var listHTML = utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
dog
\ +
bee
\ +
'); + var c = canvas.create(listHTML); + var items = c.findNodes({klass: 'item'}); + var cat_item = items[1]; + var dog_item = items[2]; + + c.listCreate({start: cat_item, end: dog_item}); + + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
alice
\ +
\ +
\ +
cat
\ +
dog
\ +
\ +
\ +
bee
\ +
' + )); + }); + + test('removing nested list', function() { + var nestedList = utils.cleanUp('\ +
\ +
alice
\ +
\ +
\ +
cat
\ +
dog
\ +
\ +
\ +
bee
\ +
'); + + var c = canvas.create(nestedList); + var dog_item = c.findNodes('[wlxml-class=list-items] [wlxml-class=list-items] > div')[1]; + assert.equal(dog_item.getContent(), 'dog'); + + c.listRemove({pointer: dog_item}); + + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
dog
\ +
bee
\ +
')); + + + }); + + test('removing list containing nested list', function() { + var nestedList = utils.cleanUp('\ +
\ +
\ +
alice
\ +
\ +
\ +
cat
\ +
dog
\ +
\ +
\ +
bee
\ +
\ +
'); + + var c = canvas.create(nestedList); + var alice_item = c.findNodes('[wlxml-class=list-items] > div')[0]; + assert.equal(alice_item.getContent(), 'alice'); + + c.listRemove({pointer: alice_item}); + + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
dog
\ +
bee
\ +
')); + + + }); + }); }); \ No newline at end of file