diff --git a/tests/manual/tickets/60/1.html b/tests/manual/tickets/60/1.html new file mode 100644 index 0000000..1028ea3 --- /dev/null +++ b/tests/manual/tickets/60/1.html @@ -0,0 +1,37 @@ +
+

Hello world!

+

This is an editor instance.

+

This is an editor instance.

+

This is an editor instance.

+

This is an editor instance.

+

This is an editor instance.

+

This is an editor instance.

+
+ +
The toolbar should stick to me instead of the viewport.
+ + diff --git a/tests/manual/tickets/60/1.js b/tests/manual/tickets/60/1.js new file mode 100644 index 0000000..1af79d1 --- /dev/null +++ b/tests/manual/tickets/60/1.js @@ -0,0 +1,32 @@ +/** + * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved. + * For licensing, see LICENSE.md. + */ + +/* globals console:false, document, window */ + +import ClassicEditor from '../../../../src/classiceditor'; +import Enter from '@ckeditor/ckeditor5-enter/src/enter'; +import Typing from '@ckeditor/ckeditor5-typing/src/typing'; +import Heading from '@ckeditor/ckeditor5-heading/src/heading'; +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'; + +ClassicEditor.create( document.querySelector( '#editor' ), { + plugins: [ Enter, Typing, Paragraph, Undo, Heading, Bold, Italic ], + toolbar: { + items: [ 'headings', 'bold', 'italic', 'undo', 'redo' ], + verticalOffset: 100 + } +} ) +.then( newEditor => { + console.log( 'Editor was initialized', newEditor ); + console.log( 'You can now play with it using global `editor` and `editable` variables.' ); + + window.editor = newEditor; +} ) +.catch( err => { + console.error( err.stack ); +} ); diff --git a/tests/manual/tickets/60/1.md b/tests/manual/tickets/60/1.md new file mode 100644 index 0000000..b0e95d9 --- /dev/null +++ b/tests/manual/tickets/60/1.md @@ -0,0 +1,20 @@ +### The toolbar should support a vertical offset from the top of the web page [#60](https://github.com/ckeditor/ckeditor5-editor-classic/issues/60) + +## Focus then scroll + +1. Focus the editor. +2. Scroll the web page until the toolbar reaches the green box boundaries. + +**Expected:** + +1. The toolbar should stick to the green box instead of the viewport edge, respecting `toolbar.viewportTopOffset` configuration. +2. At some point, the toolbar should disappear below the green box, leaving some space for the last paragraph of the content to remain visible. + +## Scroll then focus + +1. Scroll the web page until the toolbar is underneath the green box. +2. Focus the editor. + +**Expected:** + +1. The toolbar should stick to the lower boundary of the green box.