浏览代码

Added tests for links, tables and code.

Szymon Kupś 9 年之前
父节点
当前提交
ca3ec5cd80

+ 1 - 0
packages/ckeditor5-markdown-gfm/src/gfmdataprocessor.js

@@ -17,6 +17,7 @@ export default class GFMDataProcessor extends HtmlDataProcessor {
 		const html = marked.parse( data, {
 			gfm: true,
 			breaks: true,
+			tables: true,
 			xhtml: true,
 			renderer: new GFMRenderer()
 		} );

+ 3 - 3
packages/ckeditor5-markdown-gfm/src/renderer.js

@@ -72,14 +72,14 @@ Renderer.prototype.table = function( header, body ) {
 };
 
 Renderer.prototype.tablerow = function( content ) {
-	return '<tr>\n' + content + '</tr>\n';
+	return '<tr>' + content + '</tr>';
 };
 
 Renderer.prototype.tablecell = function( content, flags ) {
 	const type = flags.header ? 'th' : 'td';
-	const tag = flags.align ? '<' + type + ' style="text-align:' + flags.align + '">' : '<' + type + '>';
+	const tag = flags.align ? `<${ type } align="${ flags.align }">` : `<${ type }>`;
 
-	return tag + content + '</' + type + '>\n';
+	return tag + content + `</${ type }>`;
 };
 
 // span level renderer

+ 20 - 1
packages/ckeditor5-markdown-gfm/tests/gfmdataprocessor/code_blocks.js

@@ -13,8 +13,27 @@ describe( 'GFMDataProcessor', () => {
 		dataProcessor = new MarkdownDataProcessor();
 	} );
 
-	describe( 'code blocks', () => {
+	describe( 'code', () => {
 		describe( 'toView', () => {
+			it( 'should process inline code', () => {
+				const viewFragment = dataProcessor.toView( 'regular text and `inline code`' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<p>regular text and <code>inline code</code></p>' );
+			} );
+
+			it( 'should properly process backticks when combined', () => {
+				const viewFragment = dataProcessor.toView( '`<fake a="` content of attribute `">`' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<p><code><fake a="</code> content of attribute <code>"></code></p>' );
+			} );
+
+			it( 'should properly process backticks inside code spans', () => {
+				const viewFragment = dataProcessor.toView( '`` `backticks` ``' );
+
+				// This should be checked - why there is a space after `bacticks`.
+				expect( stringify( viewFragment ) ).to.equal( '<p><code>`backticks` </code></p>' );
+			} );
+
 			it( 'should process code blocks indented with tabs', () => {
 				const viewFragment = dataProcessor.toView( '	code block' );
 

+ 71 - 0
packages/ckeditor5-markdown-gfm/tests/gfmdataprocessor/links.js

@@ -0,0 +1,71 @@
+/**
+ * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+import MarkdownDataProcessor from '/ckeditor5/markdown-gfm/gfmdataprocessor.js';
+import { stringify } from '/tests/engine/_utils/view.js';
+
+describe( 'GFMDataProcessor', () => {
+	let dataProcessor;
+
+	beforeEach( () => {
+		dataProcessor = new MarkdownDataProcessor();
+	} );
+
+	describe( 'links', () => {
+		describe( 'toView', () => {
+			it( 'should autolink', () => {
+				const viewFragment = dataProcessor.toView( 'Link: <http://example.com/>.' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<p>Link: <a href="http://example.com/">http://example.com/</a>.</p>' );
+			} );
+
+			it( 'should autolink #2', () => {
+				const viewFragment = dataProcessor.toView( 'Link: http://example.com/.' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<p>Link: <a href="http://example.com/">http://example.com/</a>.</p>' );
+			} );
+
+			it( 'should autolink with params', () => {
+				const viewFragment = dataProcessor.toView( 'Link: <http://example.com/?foo=1&bar=2>.' );
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<p>Link: <a href="http://example.com/?foo=1&bar=2">http://example.com/?foo=1&bar=2</a>.</p>'
+				);
+			} );
+
+			it( 'should autolink inside list', () => {
+				const viewFragment = dataProcessor.toView( '* <http://example.com/>' );
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<ul>' +
+						'<li><a href="http://example.com/">http://example.com/</a></li>' +
+					'</ul>'
+				);
+			} );
+
+			it( 'should autolink inside blockquote', () => {
+				const viewFragment = dataProcessor.toView( '> Blockquoted: <http://example.com/>' );
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<blockquote>' +
+						'<p>Blockquoted: <a href="http://example.com/">http://example.com/</a></p>' +
+					'</blockquote>'
+				);
+			} );
+
+			it( 'should not autolink inside inline code', () => {
+				const viewFragment = dataProcessor.toView( '`<http://example.com/>`' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<p><code><http://example.com/></code></p>' );
+			} );
+
+			it( 'should not autolink inside code block', () => {
+				const viewFragment = dataProcessor.toView( '	<http://example.com/>' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<pre><code><http://example.com/></code></pre>' );
+			} );
+		} );
+	} );
+} );

+ 53 - 6
packages/ckeditor5-markdown-gfm/tests/gfmdataprocessor/lists.js

@@ -76,9 +76,27 @@ describe( 'GFMDataProcessor', () => {
 			} );
 
 			it( 'should process ordered list with multiple paragraphs in them', () => {
-				const viewFragment = dataProcessor.toView( '1.	Item 1, graf one.\n\n	Item 2. graf two. The quick brown fox jumped over the lazy dogs\n	back.\n	\n2.	Item 2.\n\n3.	Item 3.' );
-
-				expect( stringify( viewFragment ) ).to.equal( '<ol><li><p>Item 1, graf one.</p><p>Item 2. graf two. The quick brown fox jumped over the lazy dogs<br></br>back.</p></li><li><p>Item 2.</p></li><li><p>Item 3.</p></li></ol>' );
+				const viewFragment = dataProcessor.toView(
+					'1.	Item 1, graf one.\n\n' +
+					'	Item 2. graf two. The quick brown fox jumped over the lazy dogs\n' +
+					'	back.\n	\n' +
+					'2.	Item 2.\n\n' +
+					'3.	Item 3.' );
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<ol>' +
+						'<li>' +
+							'<p>Item 1, graf one.</p>' +
+							'<p>Item 2. graf two. The quick brown fox jumped over the lazy dogs<br></br>back.</p>' +
+						'</li>' +
+						'<li>' +
+							'<p>Item 2.</p>' +
+						'</li>' +
+						'<li>' +
+							'<p>Item 3.</p>' +
+						'</li>' +
+					'</ol>'
+				);
 			} );
 
 			it( 'should process nested lists', () => {
@@ -90,16 +108,45 @@ describe( 'GFMDataProcessor', () => {
 			it( 'should process nested and mixed lists', () => {
 				const viewFragment = dataProcessor.toView( '1. First\n2. Second:\n	* Fee\n	* Fie\n	* Foe\n3. Third' );
 
-				expect( stringify( viewFragment ) ).to.equal( '<ol><li>First</li><li>Second:<ul><li>Fee</li><li>Fie</li><li>Foe</li></ul></li><li>Third</li></ol>' );
+				expect( stringify( viewFragment ) ).to.equal(
+					'<ol>' +
+						'<li>First</li>' +
+						'<li>Second:' +
+							'<ul>' +
+								'<li>Fee</li>' +
+								'<li>Fie</li>' +
+								'<li>Foe</li>' +
+							'</ul>' +
+						'</li>' +
+						'<li>Third</li>' +
+					'</ol>'
+				);
 			} );
 
 			it( 'should process nested and mixed loose lists', () => {
 				const viewFragment = dataProcessor.toView( '1. First\n\n2. Second:\n	* Fee\n	* Fie\n	* Foe\n\n3. Third' );
 
-				expect( stringify( viewFragment ) ).to.equal( '<ol><li><p>First</p></li><li><p>Second:</p><ul><li>Fee</li><li>Fie</li><li>Foe</li></ul></li><li><p>Third</p></li></ol>' );
+				expect( stringify( viewFragment ) ).to.equal(
+					'<ol>' +
+						'<li>' +
+							'<p>First</p>' +
+						'</li>' +
+						'<li>' +
+							'<p>Second:</p>' +
+							'<ul>' +
+								'<li>Fee</li>' +
+								'<li>Fie</li>' +
+								'<li>Foe</li>' +
+							'</ul>' +
+						'</li>' +
+						'<li>' +
+							'<p>Third</p>' +
+						'</li>' +
+					'</ol>'
+				);
 			} );
 
-			it( 'should create same bullet from different list indicatiors', () => {
+			it( 'should create same bullet from different list indicators', () => {
 				const viewFragment = dataProcessor.toView( '* test\n+ test\n- test' );
 
 				expect( stringify( viewFragment ) ).to.equal( '<ul><li>test</li><li>test</li><li>test</li></ul>' );

+ 12 - 0
packages/ckeditor5-markdown-gfm/tests/gfmdataprocessor/strong_and_emphasis.js

@@ -56,6 +56,18 @@ describe( 'GFMDataProcessor', () => {
 
 				expect( stringify( viewFragment ) ).to.equal( '<p>This should_not_be_emp.</p>' );
 			} );
+
+			it( 'should process nested emphasis #1', () => {
+				const viewFragment = dataProcessor.toView( '*test **test** test*' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<p><em>test <strong>test</strong> test</em></p>' );
+			} );
+
+			it( 'should process nested emphasis #2', () => {
+				const viewFragment = dataProcessor.toView( '_test __test__ test_' );
+
+				expect( stringify( viewFragment ) ).to.equal( '<p><em>test <strong>test</strong> test</em></p>' );
+			} );
 		} );
 	} );
 } );

+ 135 - 0
packages/ckeditor5-markdown-gfm/tests/gfmdataprocessor/tables.js

@@ -0,0 +1,135 @@
+/**
+ * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+import MarkdownDataProcessor from '/ckeditor5/markdown-gfm/gfmdataprocessor.js';
+import { stringify } from '/tests/engine/_utils/view.js';
+
+describe( 'GFMDataProcessor', () => {
+	let dataProcessor;
+
+	beforeEach( () => {
+		dataProcessor = new MarkdownDataProcessor();
+	} );
+
+	describe( 'tables', () => {
+		describe( 'toView', () => {
+			it( 'should process tables', () => {
+				const viewFragment = dataProcessor.toView(
+					'| Heading 1 | Heading 2\n' +
+					'| --------- | ---------\n' +
+					'| Cell 1    | Cell 2\n' +
+					'| Cell 3    | Cell 4\n'
+				);
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<table>' +
+						'<thead>' +
+							'<tr>' +
+								'<th>Heading 1</th>' +
+								'<th>Heading 2</th>' +
+							'</tr>' +
+						'</thead>' +
+						'<tbody>' +
+							'<tr>' +
+								'<td>Cell 1</td>' +
+								'<td>Cell 2</td>' +
+							'</tr>' +
+							'<tr>' +
+								'<td>Cell 3</td>' +
+								'<td>Cell 4</td>' +
+							'</tr>' +
+						'</tbody>' +
+					'</table>'
+				);
+			} );
+
+			it( 'should process tables with aligned columns', () => {
+				const viewFragment = dataProcessor.toView(
+					'| Header 1 | Header 2 | Header 3 | Header 4 |\n' +
+					'| :------: | -------: | :------- | -------- |\n' +
+					'| Cell 1   | Cell 2   | Cell 3   | Cell 4   |\n' +
+					'| Cell 5   | Cell 6   | Cell 7   | Cell 8   |'
+				);
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<table>' +
+						'<thead>' +
+							'<tr>' +
+								'<th align="center">Header 1</th>' +
+								'<th align="right">Header 2</th>' +
+								'<th align="left">Header 3</th>' +
+								'<th>Header 4</th>' +
+							'</tr>' +
+						'</thead>' +
+						'<tbody>' +
+							'<tr>' +
+								'<td align="center">Cell 1</td>' +
+								'<td align="right">Cell 2</td>' +
+								'<td align="left">Cell 3</td>' +
+								'<td>Cell 4</td>' +
+							'</tr>' +
+							'<tr>' +
+								'<td align="center">Cell 5</td>' +
+								'<td align="right">Cell 6</td>' +
+								'<td align="left">Cell 7</td>' +
+								'<td>Cell 8</td>' +
+							'</tr>' +
+						'</tbody>' +
+					'</table>'
+				);
+			} );
+
+			it( 'should process not table without borders', () => {
+				const viewFragment = dataProcessor.toView(
+					'Header 1 | Header 2\n' +
+					'-------- | --------\n' +
+					'Cell 1   | Cell 2\n' +
+					'Cell 3   | Cell 4'
+				);
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<table>' +
+						'<thead>' +
+							'<tr><th>Header 1</th><th>Header 2</th></tr>' +
+						'</thead>' +
+						'<tbody>' +
+							'<tr><td>Cell 1</td><td>Cell 2</td></tr>' +
+							'<tr><td>Cell 3</td><td>Cell 4</td></tr>' +
+						'</tbody>' +
+					'</table>'
+				);
+			} );
+
+			it( 'should process formatting inside cells', () => {
+				const viewFragment = dataProcessor.toView(
+					'Header 1|Header 2|Header 3|Header 4\n' +
+					':-------|:------:|-------:|--------\n' +
+					'*Cell 1*  |**Cell 2**  |~~Cell 3~~  |Cell 4'
+				);
+
+				expect( stringify( viewFragment ) ).to.equal(
+					'<table>' +
+						'<thead>' +
+							'<tr>' +
+								'<th align="left">Header 1</th>' +
+								'<th align="center">Header 2</th>' +
+								'<th align="right">Header 3</th>' +
+								'<th>Header 4</th>' +
+							'</tr>' +
+						'</thead>' +
+						'<tbody>' +
+							'<tr>' +
+								'<td align="left"><em>Cell 1</em></td>' +
+								'<td align="center"><strong>Cell 2</strong></td>' +
+								'<td align="right"><del>Cell 3</del></td>' +
+								'<td>Cell 4</td>' +
+							'</tr>' +
+						'</tbody>' +
+					'</table>'
+				);
+			} );
+		} );
+	} );
+} );