mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-12-01 17:36:35 +00:00
e148234c29
Moved annotation rendering from ce.Textnode into the new ce.ContentBranchNode class. This allows us to render annotations that span across multiple nodes. * Add ce.ContentBranchNode, inheriting ce.BranchNode * Make ce.{Paragraph,Heading,Preformatted}Node inherit ce.ContentBranchNode * Made ce.ContentBranchNode render its child nodes with anntations, using .getAnnotatedHtml() on the child nodes * Put a default implementation for .getAnnotatedHtml() in ce.LeafNode * Override this in ce.TextNode to do escaping and whitespace handling * Removed rendering code from ce.TextNode (this.$ is now unused there) * Removed ce.TextNode.onUpdate() and ce.BranchNode.clean(), now unneeded * Have ce.BranchNode propagate update events from children, so ce.ContentBranchNode can rerender when its children change * Update tests, add test case for escaping of &<>'" Change-Id: I4600e984b287c6ff9267f4281d2f09bab9e1ad95
250 lines
5.6 KiB
JavaScript
250 lines
5.6 KiB
JavaScript
/**
|
|
* VisualEditor content editable ContentBranchNode tests.
|
|
*
|
|
* @copyright 2011-2012 VisualEditor Team and others; see AUTHORS.txt
|
|
* @license The MIT License (MIT); see LICENSE.txt
|
|
*/
|
|
|
|
QUnit.module( 've.ce.ContentBranchNode' );
|
|
|
|
/* Tests */
|
|
|
|
QUnit.test( 'renderContents', function ( assert ) {
|
|
var i, len, $rendered, cases = [
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
'a',
|
|
'b',
|
|
'c',
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': 'abc'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
['a', [ { 'type': 'textStyle/bold' } ]],
|
|
['b', [ { 'type': 'textStyle/bold' } ]],
|
|
['c', [ { 'type': 'textStyle/bold' } ]],
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': '<b>abc</b>'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
['a', [ { 'type': 'textStyle/bold' } ]],
|
|
'b',
|
|
['c', [ { 'type': 'textStyle/italic' } ]],
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': '<b>a</b>b<i>c</i>'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
['a', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['b', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['c', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': '<b><i><u>abc</u></i></b>'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
['a', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['b', [
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' }
|
|
]],
|
|
['c', [
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' }
|
|
]],
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': '<b><i><u>abc</u></i></b>'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
['a', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
'b',
|
|
['c', [
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' }
|
|
]],
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': '<b><i><u>a</u></i></b>b<u><b><i>c</i></b></u>'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
'a',
|
|
'b',
|
|
'c',
|
|
['d', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['e', [
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' }
|
|
]],
|
|
['f', [
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' }
|
|
]],
|
|
'g',
|
|
'h',
|
|
'i',
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': 'abc<b><i><u>def</u></i></b>ghi'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
'a',
|
|
'b',
|
|
'c',
|
|
['d', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['e', [
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['f', [
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' }
|
|
]],
|
|
'g',
|
|
'h',
|
|
'i',
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': 'abc<b><i><u>d</u></i></b><i><u>e<b>f</b></u></i>ghi'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
'a',
|
|
'b',
|
|
'c',
|
|
['d', [
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' }
|
|
]],
|
|
['e', [
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['f', [
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/italic' }
|
|
]],
|
|
'g',
|
|
'h',
|
|
'i',
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': 'abc<i><u><b>d</b>e<b>f</b></u></i>ghi'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
'a',
|
|
'b',
|
|
'c',
|
|
['d', [
|
|
{ 'type': 'textStyle/italic' },
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' }
|
|
]],
|
|
['e', [
|
|
{ 'type': 'textStyle/bold' },
|
|
{ 'type': 'textStyle/underline' }
|
|
]],
|
|
['f', [
|
|
{ 'type': 'textStyle/underline' },
|
|
{ 'type': 'textStyle/bold' }
|
|
]],
|
|
'g',
|
|
'h',
|
|
'i',
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': 'abc<i><u><b>d</b></u></i><u><b>ef</b></u>ghi'
|
|
},
|
|
{
|
|
'data': [
|
|
{ 'type': 'paragraph' },
|
|
'a',
|
|
['b', [ { 'type': 'textStyle/bold' } ]],
|
|
{
|
|
'type': 'MWentity',
|
|
'attributes': { 'character': 'c', 'html/typeof': 'mw:Entity' },
|
|
'annotations': [ { 'type': 'textStyle/bold' } ]
|
|
},
|
|
{ 'type': '/MWentity' },
|
|
['d', [ { 'type': 'textStyle/bold' } ]],
|
|
{
|
|
'type': 'alienInline',
|
|
'attributes': { 'html': '<tt>e</tt>' },
|
|
'annotations': [ { 'type': 'textStyle/bold' } ]
|
|
},
|
|
{ 'type': '/alienInline' },
|
|
{ 'type': '/paragraph' }
|
|
],
|
|
'html': 'a<b>b<span typeof="mw:Entity" class="ve-ce-leafNode ' +
|
|
've-ce-MWEntityNode" contenteditable="false">c</span>d<div ' +
|
|
'class="ve-ce-leafNode ve-ce-alienNode ve-ce-alienInlineNode" ' +
|
|
'contenteditable="false"><tt>e</tt></div></b>'
|
|
}
|
|
];
|
|
QUnit.expect( cases.length );
|
|
for ( i = 0, len = cases.length; i < len; i++ ) {
|
|
ve.dm.example.preprocessAnnotations( cases[i].data );
|
|
$rendered = ( new ve.ce.ParagraphNode(
|
|
( new ve.dm.Document( cases[i].data ) )
|
|
.documentNode.getChildren()[0] )
|
|
).renderContents();
|
|
assert.deepEqual( $( '<div>' ).append( $rendered ).html(), cases[i].html );
|
|
}
|
|
} );
|