Przeglądaj źródła

Tests: input command integration tests.

Krzysztof Krztoń 8 lat temu
rodzic
commit
bb1ea88b0d

+ 206 - 0
packages/ckeditor5-typing/tests/inputcommand-integration.js

@@ -0,0 +1,206 @@
+/**
+ * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* globals document */
+
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
+
+import Typing from '@ckeditor/ckeditor5-typing/src/typing';
+import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
+import Undo from '@ckeditor/ckeditor5-undo/src/undo';
+import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
+import Italic from '@ckeditor/ckeditor5-basic-styles/src/italic';
+import Enter from '@ckeditor/ckeditor5-enter/src/enter';
+
+import Range from '@ckeditor/ckeditor5-engine/src/model/range';
+import Position from '@ckeditor/ckeditor5-engine/src/model/position';
+
+import { setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+import { getData as getModelData } from  '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+import { getData as getViewData } from '@ckeditor/ckeditor5-engine/src/dev-utils/view';
+
+describe( 'InputCommand integration', () => {
+	let editor, doc, viewDocument, boldView, italicView;
+
+	beforeEach( () => {
+		const editorElement = document.createElement( 'div' );
+		document.body.appendChild( editorElement );
+
+		return ClassicTestEditor.create( editorElement, {
+			plugins: [ Typing, Paragraph, Undo, Bold, Italic, Enter ],
+			typing: { undoStep: 3 }
+		} )
+		.then( newEditor => {
+			editor = newEditor;
+			doc = editor.document;
+			viewDocument = editor.editing.view;
+
+			boldView = editor.ui.componentFactory.create( 'bold' );
+			italicView = editor.ui.componentFactory.create( 'italic' );
+		} );
+	} );
+
+	afterEach( () => {
+		return editor.destroy();
+	} );
+
+	function expectOutput( modelOutput, viewOutput ) {
+		expect( getModelData( editor.document ) ).to.equal( modelOutput );
+		expect( getViewData( viewDocument ) ).to.equal( viewOutput );
+	}
+
+	function simulateTyping( text ) {
+		// While typing, every character is an atomic change.
+		text.split( '' ).forEach( ( character ) => {
+			editor.execute( 'input', {
+				text: character
+			} );
+		} );
+	}
+
+	function simulateBatches( batches ) {
+		// Use longer text at once in input command.
+		batches.forEach( ( batch ) => {
+			editor.execute( 'input', {
+				text: batch
+			} );
+		} );
+	}
+
+	function setSelection( pathA, pathB ) {
+		doc.selection.setRanges( [ new Range( new Position( doc.getRoot(), pathA ), new Position( doc.getRoot(), pathB ) ) ] );
+	}
+
+	describe( 'InputCommand integration', () => {
+		it( 'resets the buffer on typing respecting typing.undoStep', () => {
+			setModelData( doc, '<paragraph>0[]</paragraph>' );
+
+			simulateTyping( '123456789' );
+
+			expectOutput( '<paragraph>0123456789[]</paragraph>', '<p>0123456789{}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>0123456[]</paragraph>', '<p>0123456{}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>0123[]</paragraph>', '<p>0123{}</p>' );
+
+			editor.execute( 'redo' );
+
+			expectOutput( '<paragraph>0123456[]</paragraph>', '<p>0123456{}</p>' );
+		} );
+
+		it( 'resets the buffer on text insertion respecting typing.undoStep', () => {
+			setModelData( doc, '<paragraph>0[]</paragraph>' );
+
+			simulateBatches( [ '1234', '5', '678', '9' ] );
+
+			expectOutput( '<paragraph>0123456789[]</paragraph>', '<p>0123456789{}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>012345678[]</paragraph>', '<p>012345678{}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>01234[]</paragraph>', '<p>01234{}</p>' );
+
+			editor.execute( 'redo' );
+
+			expectOutput( '<paragraph>012345678[]</paragraph>', '<p>012345678{}</p>' );
+		} );
+
+		it( 'resets the buffer when selection changes', () => {
+			setModelData( doc, '<paragraph>Foo[] Bar</paragraph>' );
+
+			setSelection( [ 0, 5 ], [ 0, 5 ] );
+			simulateTyping( '1' );
+
+			setSelection( [ 0, 7 ], [ 0, 8 ] );
+			simulateTyping( '2' );
+
+			expectOutput( '<paragraph>Foo B1a2[]</paragraph>', '<p>Foo B1a2{}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>Foo B1a[r]</paragraph>', '<p>Foo B1a{r}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>Foo B[]ar</paragraph>', '<p>Foo B{}ar</p>' );
+
+			editor.execute( 'redo' );
+
+			expectOutput( '<paragraph>Foo B1[]ar</paragraph>', '<p>Foo B1{}ar</p>' );
+		} );
+
+		it( 'resets the buffer when selection changes (with enter)', () => {
+			setModelData( doc, '<paragraph>Foo[]Bar</paragraph>' );
+
+			simulateTyping( '1' );
+			editor.execute( 'enter' );
+
+			setSelection( [ 1, 3 ], [ 1, 3 ] );
+			simulateTyping( '2' );
+			editor.execute( 'enter' );
+
+			simulateTyping( 'Baz' );
+
+			expectOutput( '<paragraph>Foo1</paragraph><paragraph>Bar2</paragraph><paragraph>Baz[]</paragraph>',
+				'<p>Foo1</p><p>Bar2</p><p>Baz{}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>Foo1</paragraph><paragraph>Bar2</paragraph><paragraph>[]</paragraph>',
+				'<p>Foo1</p><p>Bar2</p><p>[]</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>Foo1</paragraph><paragraph>Bar2[]</paragraph>',
+				'<p>Foo1</p><p>Bar2{}</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>Foo1</paragraph><paragraph>Bar[]</paragraph>',
+				'<p>Foo1</p><p>Bar{}</p>' );
+
+			editor.execute( 'redo' );
+
+			expectOutput( '<paragraph>Foo1</paragraph><paragraph>Bar2[]</paragraph>',
+				'<p>Foo1</p><p>Bar2{}</p>' );
+		} );
+
+		it( 'resets the buffer when attribute changes', () => {
+			setModelData( doc, '<paragraph>Foo[] Bar</paragraph>' );
+
+			simulateTyping( ' ' );
+
+			boldView.fire( 'execute' );
+			simulateTyping( 'B' );
+
+			italicView.fire( 'execute' );
+			simulateTyping( 'a' );
+
+			boldView.fire( 'execute' );
+			italicView.fire( 'execute' );
+			simulateTyping( 'z' );
+
+			expectOutput( '<paragraph>Foo <$text bold="true">B</$text><$text italic="true"><$text bold="true">a</$text></$text>z[] Bar</paragraph>',
+				'<p>Foo <strong>B</strong><em><strong>a</strong></em>z{} Bar</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>Foo <$text bold="true">B</$text><$text italic="true"><$text bold="true">a</$text></$text><$text bold="true" italic="true">[]</$text> Bar</paragraph>',
+				'<p>Foo <strong>B</strong><em><strong>a{}</strong></em> Bar</p>' );
+
+			editor.execute( 'undo' );
+
+			expectOutput( '<paragraph>Foo <$text bold="true">B[]</$text> Bar</paragraph>',
+				'<p>Foo <strong>B{}</strong> Bar</p>' );
+		} );
+	} );
+} );