Procházet zdrojové kódy

Tests: Improved the manual test to better simulate the real world case.

Piotrek Koszuliński před 9 roky
rodič
revize
dced4a9864

+ 15 - 0
packages/ckeditor5-engine/tests/view/manual/fakeselection.html

@@ -1,2 +1,17 @@
+<style>
+	#editor {
+		padding: 5px;
+		border: solid 1px #000;
+	}
+</style>
+
+<p>Scroll down.</p>
+
+<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
+<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
+
 <div contenteditable="true" id="editor"></div>
 <button id="create-fake">Create fake selection over "bar"</button>
+
+<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
+<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

+ 15 - 2
packages/ckeditor5-engine/tests/view/manual/fakeselection.js

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md.
  */
 
-/* globals document */
+/* globals document, console */
 
 import ViewDocument from '/ckeditor5/engine/view/document.js';
 import ViewRange from '/ckeditor5/engine/view/range.js';
@@ -14,14 +14,19 @@ const domEditable = document.getElementById( 'editor' );
 const viewRoot = viewDocument.createRoot( domEditable );
 let viewStrong;
 
+// Prevent focus stealing. Simulates how editor buttons work.
+document.getElementById( 'create-fake' ).addEventListener( 'mousedown', ( evt ) => {
+	evt.preventDefault();
+} );
+
 document.getElementById( 'create-fake' ).addEventListener( 'click', () => {
 	const viewP = viewRoot.getChild( 0 );
 	viewStrong = viewP.getChild( 1 );
+
 	const range = ViewRange.createOn( viewStrong );
 	viewDocument.selection.setRanges( [ range ] );
 	viewDocument.selection.setFake( true, { label: 'fake selection over bar' } );
 	viewStrong.setStyle( 'background-color', 'yellow' );
-	viewDocument.focus();
 } );
 
 viewDocument.on( 'selectionChange', ( evt, data ) => {
@@ -35,5 +40,13 @@ viewDocument.selection.on( 'change', () => {
 	}
 } );
 
+viewDocument.on( 'focus', () => {
+	console.log( 'The document was focused' );
+} );
+
+viewDocument.on( 'blur', () => {
+	console.log( 'The document was blurred' );
+} );
+
 setData( viewDocument, '<container:p>{}foo<strong>bar</strong>baz</container:p>' );
 viewDocument.focus();

+ 9 - 4
packages/ckeditor5-engine/tests/view/manual/fakeselection.md

@@ -2,9 +2,14 @@
 @bender-tags: view
 
 ## Fake selection
+
 1. Click button to create fake selection over `bar` before each of following steps:
-   1. Press left arrow key - collapsed selection should appear before `bar`
-   1. Press up arrow key - collapsed selection should appear before `bar`
-   1. Press right arrow key - collapsed selection should appear after `bar`
-   1. Press down arrow key - collapsed selection should appear after `bar`
+   1. Press left/up arrow key - collapsed selection should appear before `bar`
+   1. Press right/down arrow key - collapsed selection should appear after `bar`
 1. Open console and check if `<div style="position: fixed; top: 0px; left: -1000px;">fake selection over bar</div>` is added to editable when fake selection is present. It should be removed when fake selection is not present.
+
+Notes:
+
+* Focus shouldn't disappear from the editable element.
+* No #blur event should be logged on the console.
+* The viewport shouldn't scroll when selecting the `bar`.