internal container wip: synchronizing main node and container display style (inline...

[fnpeditor.git] / modules / documentCanvas / canvas / canvas.test3.js

diff --git a/modules/documentCanvas/canvas/canvas.test3.js b/modules/documentCanvas/canvas/canvas.test3.js
index a68e66b..fc390ec 100644 (file)
--- a/modules/documentCanvas/canvas/canvas.test3.js
+++ b/modules/documentCanvas/canvas/canvas.test3.js
@@ -12,38 +12,6 @@ var expect = chai.expect;
 
 describe('Canvas', function() {
 
 
 describe('Canvas', function() {
 

-    describe('Internal HTML representation of a sample document', function() {
-        it('works', function() {
-            var c = canvas.fromXML('\
-                <section>\
-                    This is some text without its own wrapping tag.\
-                    <div class="p.subclass">\
-                        This is a paragraph.\
-                    </div>\
-                    <div>\
-                        This is text in a div <span>with some inline text</span>.\
-                    </div>\
-                    This is some text without its own wrapping tag.\
-                </section>\
-            ');
-            var expected = '<div wlxml-tag="section">'
-                            + '<div wlxml-text>This is some text without its own wrapping tag.</div>'
-                            + '<div wlxml-tag="div" wlxml-class="p-subclass">'
-                            +   '<div wlxml-text>This is a paragraph.</div>'
-                            + '</div>'
-                            + '<div wlxml-tag="div">'
-                            +   '<div wlxml-text>This is text in a div </div>'
-                            +   '<div wlxml-tag="span">'
-                            +       '<div wlxml-text>with some inline text</div>'
-                            +   '</div>'
-                            +   '<div wlxml-text>.</div>'
-                            + '</div>'
-                            + '<div wlxml-text>This is some text without its own wrapping tag.</div>'
-                            + '</div>';
-            expect(c.doc().dom()[0].isEqualNode($(expected)[0])).to.be.true;
-        });
-    });
-

     describe('Internal HTML representation of a DocumentNodeElement', function() {
         it('is always a div tag', function() {
             ['section', 'header', 'span', 'aside', 'figure'].forEach(function(tagName) {
     describe('Internal HTML representation of a DocumentNodeElement', function() {
         it('is always a div tag', function() {
             ['section', 'header', 'span', 'aside', 'figure'].forEach(function(tagName) {


@@ -51,21 +19,21 @@ describe('Canvas', function() {
                 expect(dom.prop('tagName')).to.equal('DIV', tagName + ' is represented as div');
             });
         });
                 expect(dom.prop('tagName')).to.equal('DIV', tagName + ' is represented as div');
             });
         });

-        it('has wlxml tag put into wlxml-tag attribute', function() {
+        it('has wlxml tag put into wlxml-tag attribute of its internal container', function() {

             var dom = canvas.fromXML('<section></section>').doc().dom();
             var dom = canvas.fromXML('<section></section>').doc().dom();

-            expect(dom.attr('wlxml-tag')).to.equal('section');
+            expect(dom.children('[document-element-content]').attr('wlxml-tag')).to.equal('section');

         });
         });

-        it('has wlxml class put into wlxml-class, dots replaced with dashes', function() {
+        it('has wlxml class put into wlxml-class attribute of its internal containr, dots replaced with dashes', function() {

             var dom = canvas.fromXML('<section class="some.class"></section>').doc().dom();
             var dom = canvas.fromXML('<section class="some.class"></section>').doc().dom();

-            expect(dom.attr('wlxml-class')).to.equal('some-class');
+            expect(dom.children('[document-element-content]').attr('wlxml-class')).to.equal('some-class');

         });
     });
 
     describe('Internal HTML representation of a DocumentTextElement', function() {
         });
     });
 
     describe('Internal HTML representation of a DocumentTextElement', function() {

-        it('is text node wrapped in a div with wlxml-text attribute set', function() {
+        it('is text node wrapped in a div with document-text-element attribute set', function() {

             var dom = canvas.fromXML('<section>Alice</section>').doc().children()[0].dom();
             expect(dom.prop('tagName')).to.equal('DIV');
             var dom = canvas.fromXML('<section>Alice</section>').doc().children()[0].dom();
             expect(dom.prop('tagName')).to.equal('DIV');

-            expect(dom.attr('wlxml-text')).to.equal('');
+            expect(dom.attr('document-text-element')).to.equal('');

             expect(dom.contents().length).to.equal(1);
             expect(dom.contents()[0].nodeType).to.equal(Node.TEXT_NODE);
             expect($(dom.contents()[0]).text()).to.equal('Alice');
             expect(dom.contents().length).to.equal(1);
             expect(dom.contents()[0].nodeType).to.equal(Node.TEXT_NODE);
             expect($(dom.contents()[0]).text()).to.equal('Alice');


@@ -388,6 +356,53 @@ describe('Canvas', function() {
                     expect(children[1]).to.be.instanceOf(documentElement.DocumentTextElement);
                     expect(children[1].getText()).to.equal('Alice');
                 });
                     expect(children[1]).to.be.instanceOf(documentElement.DocumentTextElement);
                     expect(children[1].getText()).to.equal('Alice');
                 });

+
+                it('can divide DocumentTextElement with a new DocumentNodeElement', function() {
+                    var c = canvas.fromXML('<section>Alice has a cat</section>'),
+                        section = c.doc(),
+                        text = section.children()[0];
+
+                    var returned = text.divide({tag: 'aside', klass: 'footnote', offset: 5}),
+                        sectionChildren = section.children(),
+                        lhsText = sectionChildren[0],
+                        rhsText = sectionChildren[2];
+
+                    expect(lhsText.getText()).to.equal('Alice');
+                    expect(returned.sameNode(sectionChildren[1]));
+                    expect(rhsText.getText()).to.equal(' has a cat');
+                });
+
+                it('treats dividing DocumentTextElement at the very end as appending after it', function() {
+                    var c = canvas.fromXML('<section>Alice has a cat</section>'),
+                        section = c.doc(),
+                        text = section.children()[0];
+
+                    var returned = text.divide({tag: 'aside', klass: 'footnote', offset: 15}),
+                        sectionChildren = section.children(),
+                        textElement = sectionChildren[0],
+                        nodeElement = sectionChildren[1];
+
+                    expect(sectionChildren.length).to.equal(2);
+                    expect(textElement.getText()).to.equal('Alice has a cat');
+                    expect(returned.sameNode(nodeElement)).to.be.true;
+                    expect(nodeElement.getWlxmlTag()).to.equal('aside');
+                });
+
+                it('treats dividing DocumentTextElement at the very beginning as appending before it', function() {
+                    var c = canvas.fromXML('<section>Alice has a cat</section>'),
+                        section = c.doc(),
+                        text = section.children()[0];
+
+                    var returned = text.divide({tag: 'aside', klass: 'footnote', offset: 0}),
+                        sectionChildren = section.children(),
+                        nodeElement = sectionChildren[0],
+                        textElement = sectionChildren[1];
+                        
+                    expect(sectionChildren.length).to.equal(2);
+                    expect(textElement.getText()).to.equal('Alice has a cat');
+                    expect(returned.sameNode(nodeElement)).to.be.true;
+                    expect(nodeElement.getWlxmlTag()).to.equal('aside');
+                });

             });
 
             describe('Splitting text', function() {
             });
 
             describe('Splitting text', function() {


@@ -981,6 +996,15 @@ describe('Canvas', function() {
 
         var getSelection;
 
 
         var getSelection;
 

+        var findTextNode = function(inside, text) {
+            var nodes = inside.find(':not(iframe)').addBack().contents().filter(function() {
+                return this.nodeType === Node.TEXT_NODE && this.data === text;
+            });
+            if(nodes.length)
+                return nodes[0];
+            return null;
+        }
+

         beforeEach(function() {
             getSelection = sinon.stub(window, 'getSelection');
         });
         beforeEach(function() {
             getSelection = sinon.stub(window, 'getSelection');
         });


@@ -992,7 +1016,7 @@ describe('Canvas', function() {
         it('returns position when browser selection collapsed', function() {
             var c = canvas.fromXML('<section>Alice has a cat</section>'),
                 dom = c.doc().dom(),
         it('returns position when browser selection collapsed', function() {
             var c = canvas.fromXML('<section>Alice has a cat</section>'),
                 dom = c.doc().dom(),

-                text = $(dom.contents()[0]).contents()[0];
+                text = findTextNode(dom, 'Alice has a cat');

 
             expect(text.nodeType).to.equal(Node.TEXT_NODE, 'correct node selected');
             expect($(text).text()).to.equal('Alice has a cat');
 
             expect(text.nodeType).to.equal(Node.TEXT_NODE, 'correct node selected');
             expect($(text).text()).to.equal('Alice has a cat');


@@ -1027,9 +1051,9 @@ describe('Canvas', function() {
             var c = canvas.fromXML('<section>Alice <span>has</span> a <span>big</span> cat</section>'),
                 dom = c.doc().dom(),
                 text = {
             var c = canvas.fromXML('<section>Alice <span>has</span> a <span>big</span> cat</section>'),
                 dom = c.doc().dom(),
                 text = {

-                    alice: dom.contents()[0],
-                    has: $(dom.contents()[1]).contents()[0],
-                    cat: dom.contents()[4]
+                    alice: findTextNode(dom, 'Alice '),
+                    has: findTextNode(dom, 'has'),
+                    cat: findTextNode(dom, ' cat')

                 },
                 cursor = c.getCursor(),
                 aliceElement = c.getDocumentElement(text.alice),
                 },
                 cursor = c.getCursor(),
                 aliceElement = c.getDocumentElement(text.alice),


@@ -1060,11 +1084,11 @@ describe('Canvas', function() {
             var c = canvas.fromXML('<section>Alice <span>has</span> a <span>big</span> cat</section>'),
                 dom = c.doc().dom(),
                 text = {
             var c = canvas.fromXML('<section>Alice <span>has</span> a <span>big</span> cat</section>'),
                 dom = c.doc().dom(),
                 text = {

-                    alice: dom.contents()[0],
-                    has: $(dom.contents()[1]).contents()[0],
-                    a: dom.contents()[2],
-                    big: $(dom.contents()[3]).contents()[0],
-                    cat: dom.contents()[4]
+                    alice: findTextNode(dom, 'Alice '),
+                    has: findTextNode(dom, 'has'),
+                    a: findTextNode(dom, ' a '),
+                    big: findTextNode(dom, 'big'),
+                    cat: findTextNode(dom, ' cat'),

                 },
                 cursor = c.getCursor();
 
                 },
                 cursor = c.getCursor();
 


@@ -1102,6 +1126,41 @@ describe('Canvas', function() {
             expect(input.isEqualNode(output)).to.be.true;
         });
 
             expect(input.isEqualNode(output)).to.be.true;
         });
 

+        it('keeps arbitrary node attributes intact', function() {
+            var xmlIn = '<section a="1" xmlns:dcterms="http://purl.org/dc/terms/"></section>',
+                $xmlOut = $(canvas.fromXML(xmlIn).toXML());
+
+            expect($xmlOut.attr('a')).to.equal('1');
+            expect($xmlOut.attr('xmlns:dcterms')).to.equal('http://purl.org/dc/terms/');
+        });
+
+        it('doesn\' serialize meta attribute if its empty', function() {
+            var c;
+
+            c = canvas.fromXML('<section class="uri" meta-uri="some.uri"></section>');
+            c.doc().setWlxmlMetaAttr('uri', '');
+            expect($(c.toXML()).attr('meta-uri')).to.equal(undefined, 'overriding attribute with zero length string');
+
+            c = canvas.fromXML('<section class="uri"></section>');
+            c.doc().setWlxmlMetaAttr('uri', '');
+            expect($(c.toXML()).attr('meta-uri')).to.equal(undefined, 'setting attribute to zero length string');
+        });
+
+        describe('output xml', function() {
+            it('keeps entities intact', function() {
+                var xmlIn = '<section>&lt; &gt;</section>',
+                    c = canvas.fromXML(xmlIn),
+                    xmlOut = c.toXML();
+                expect(xmlOut).to.equal(xmlIn);
+            });
+            it('keeps entities intact when they form html/xml', function() {
+                var xmlIn = '<section>&lt;abc&gt;</section>',
+                    c = canvas.fromXML(xmlIn),
+                    xmlOut = c.toXML();
+                expect(xmlOut).to.equal(xmlIn);
+            });
+        });
+

         describe('formatting output xml', function() {
             /*it('keeps white spaces at the edges of input xml', function() {
                 var xmlIn = '  <section></section>  ',
         describe('formatting output xml', function() {
             /*it('keeps white spaces at the edges of input xml', function() {
                 var xmlIn = '  <section></section>  ',


@@ -1133,6 +1192,14 @@ describe('Canvas', function() {
                 expect(partsIn).to.deep.equal(partsOut);
             });
 
                 expect(partsIn).to.deep.equal(partsOut);
             });
 

+            it('keeps white space at the beginning of text', function() {
+                var xmlIn = '<section>    abc<div>some div</div>    abc</section>',
+                    c = canvas.fromXML(xmlIn),
+                    xmlOut = c.toXML();
+
+                expect(xmlOut).to.equal(xmlIn);
+            });
+

             it('nests new children block elements', function() {
                 var c = canvas.fromXML('<section></section>');
     
             it('nests new children block elements', function() {
                 var c = canvas.fromXML('<section></section>');
     


@@ -1153,6 +1220,68 @@ describe('Canvas', function() {
                 expect(xmlOut).to.equal('<section><span></span></section>');
             });
 
                 expect(xmlOut).to.equal('<section><span></span></section>');
             });
 

+            it('keeps original white space at the end of text', function() {
+                
+                var xmlIn = '<header>    Some text ended with white space \
+                \
+                <span class="uri">Some text</span> some text\
+            \
+            </header>',
+                    c = canvas.fromXML(xmlIn);
+
+            var xmlOut = c.toXML();
+            console.log(xmlOut);
+            expect(xmlOut).to.equal(xmlIn);
+            });
+
+            it('keeps white space around text node', function() {
+                var xmlIn = '<section>\
+                <header>header1</header>\
+                Some text surrounded by white space\
+                <header>header2</header>\
+            </section>',
+                    c = canvas.fromXML(xmlIn);
+
+                var xmlOut = c.toXML();
+                expect(xmlOut).to.equal(xmlIn);
+            });
+
+            it('keeps white space around text node - last node case', function() {
+                var xmlIn = '<section>\
+                <header>header</header>\
+                    \
+                Some text surrounded by white space\
+                    \
+            </section>',
+                    c = canvas.fromXML(xmlIn);
+
+                var xmlOut = c.toXML();
+                expect(xmlOut).to.equal(xmlIn);
+            });
+
+            it('keeps white space after detaching text element', function() {
+                var xmlIn = '<section><header>header</header>\n\
+                    \n\
+                text1\n\
+                    \n\
+            </section>',
+                    expectedXmlOut = '<section><header>header</header>\n\
+                    \n\
+                \n\
+                    \n\
+            </section>',
+                    c = canvas.fromXML(xmlIn),
+                    children = c.doc().children(),
+                    text = children[children.length-1];
+                
+                expect(text.getText()).to.equal('text1');
+
+                text.detach();
+
+                var xmlOut = c.toXML();
+                expect(xmlOut).to.equal(expectedXmlOut);
+            });
+

         })
     })
 });
         })
     })
 });