Преглед изворни кода

Tests: Added manual test for the automatic dropdown panel placement.

Aleksander Nowodzinski пре 7 година
родитељ
комит
114a40bf09

+ 28 - 0
packages/ckeditor5-ui/tests/dropdown/manual/panelposition.html

@@ -0,0 +1,28 @@
+<style>
+	div[id^="dropdown-"].ck {
+		position: fixed;
+	}
+
+	#dropdown-nw {
+		top: 20px;
+	}
+
+	#dropdown-ne {
+		top: 20px;
+		right: 20px;
+	}
+
+	#dropdown-sw {
+		bottom: 20px;
+	}
+
+	#dropdown-se {
+		bottom: 20px;
+		right: 20px;
+	}
+</style>
+
+<div id="dropdown-nw" class="ck ck-reset_all"></div>
+<div id="dropdown-ne" class="ck ck-reset_all"></div>
+<div id="dropdown-se" class="ck ck-reset_all"></div>
+<div id="dropdown-sw" class="ck ck-reset_all"></div>

+ 49 - 0
packages/ckeditor5-ui/tests/dropdown/manual/panelposition.js

@@ -0,0 +1,49 @@
+/**
+ * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+import Model from '../../../src/model';
+import Collection from '@ckeditor/ckeditor5-utils/src/collection';
+import testUtils from '../../_utils/utils';
+import { createDropdown, addListToDropdown } from '../../../src/dropdown/utils';
+
+const ui = testUtils.createTestUIView( {
+	dropdownNW: '#dropdown-nw',
+	dropdownNE: '#dropdown-ne',
+	dropdownSE: '#dropdown-se',
+	dropdownSW: '#dropdown-sw'
+} );
+
+function createPositionedDropdown( position ) {
+	const collection = new Collection( { idProperty: 'label' } );
+
+	[
+		'long label of a first item of the list',
+		'long label of a second item of the list',
+		'long label of a third item of the list'
+	].forEach( label => {
+		collection.add( {
+			type: 'button',
+			model: new Model( { label, withText: true } )
+		} );
+	} );
+
+	const dropdownView = createDropdown( {} );
+
+	dropdownView.buttonView.set( {
+		label: `Dropdown ${ position }`,
+		isEnabled: true,
+		isOn: false,
+		withText: true
+	} );
+
+	addListToDropdown( dropdownView, collection );
+
+	ui[ `dropdown${ position }` ].add( dropdownView );
+}
+
+createPositionedDropdown( 'NW' );
+createPositionedDropdown( 'NE' );
+createPositionedDropdown( 'SW' );
+createPositionedDropdown( 'SE' );

+ 5 - 0
packages/ckeditor5-ui/tests/dropdown/manual/panelposition.md

@@ -0,0 +1,5 @@
+## Automatic position of the dropdown panel
+
+1. Open a dropdown located in the corner of the page.
+2. Check if the panel shows up fully visible in the viewport.
+3. Repeat for the rest of dropdowns. Panels should appear above, below, right and left to the button.