| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102 |
- /**
- * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
- /* globals window */
- import Model from '../../../src/model';
- import Collection from '@ckeditor/ckeditor5-utils/src/collection';
- import createDropdown from '../../../src/dropdown/createdropdown';
- import createListDropdown from '../../../src/dropdown/list/createlistdropdown';
- import '@ckeditor/ckeditor5-theme-lark/theme/theme.scss';
- import testUtils from '@ckeditor/ckeditor5-ui/tests/_utils/utils';
- const ui = testUtils.createTestUIView( {
- dropdown: '#dropdown',
- listDropdown: '#list-dropdown',
- dropdownShared: '#dropdown-shared',
- dropdownLabel: '#dropdown-label'
- } );
- function testEmpty() {
- const dropdownView = createDropdown( new Model( {
- label: 'Dropdown',
- isEnabled: true,
- isOn: false,
- withText: true
- } ) );
- ui.dropdown.add( dropdownView );
- dropdownView.panelView.element.innerHTML = 'Empty panel. There is no child view in this DropdownPanelView.';
- }
- function testList() {
- const collection = new Collection( { idProperty: 'label' } );
- [ '0.8em', '1em', '1.2em', '1.5em', '2.0em', '3.0em' ].forEach( font => {
- collection.add( new Model( {
- label: font,
- style: `font-size: ${ font }`
- } ) );
- } );
- const model = new Model( {
- label: 'ListDropdown',
- isEnabled: true,
- isOn: false,
- withText: true,
- items: collection
- } );
- const dropdownView = createListDropdown( model );
- dropdownView.on( 'execute', evt => {
- /* global console */
- console.log( 'List#execute:', evt.source.label );
- } );
- ui.listDropdown.add( dropdownView );
- window.listDropdownModel = model;
- window.listDropdownCollection = collection;
- window.Model = Model;
- }
- function testSharedModel() {
- const model = new Model( {
- label: 'Shared Model',
- isEnabled: true,
- isOn: false,
- withText: true
- } );
- const dropdownView1 = createDropdown( model );
- const dropdownView2 = createDropdown( model );
- ui.dropdownShared.add( dropdownView1 );
- ui.dropdownShared.add( dropdownView2 );
- dropdownView1.panelView.element.innerHTML = dropdownView2.panelView.element.innerHTML = 'Empty panel.';
- }
- function testLongLabel() {
- const dropdownView = createDropdown( new Model( {
- label: 'Dropdown with a very long label',
- isEnabled: true,
- isOn: false,
- withText: true
- } ) );
- ui.dropdownLabel.add( dropdownView );
- dropdownView.panelView.element.innerHTML = 'Empty panel. There is no child view in this DropdownPanelView.';
- }
- testEmpty();
- testList();
- testSharedModel();
- testLongLabel();
|