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

Internal: Lazy loading for table dropdown.

Marek Lewandowski пре 6 година
родитељ
комит
7df2ee13e3
2 измењених фајлова са 24 додато и 12 уклоњено
  1. 20 12
      packages/ckeditor5-table/src/tableui.js
  2. 4 0
      packages/ckeditor5-table/tests/tableui.js

+ 20 - 12
packages/ckeditor5-table/src/tableui.js

@@ -54,21 +54,29 @@ export default class TableUI extends Plugin {
 				tooltip: true
 				tooltip: true
 			} );
 			} );
 
 
-			// Prepare custom view for dropdown's panel.
-			const insertTableView = new InsertTableView( locale );
-			dropdownView.panelView.children.add( insertTableView );
+			let insertTableView;
 
 
-			insertTableView.delegate( 'execute' ).to( dropdownView );
+			dropdownView.on( 'change:isOpen', () => {
+				if ( insertTableView ) {
+					return;
+				}
 
 
-			dropdownView.buttonView.on( 'open', () => {
-				// Reset the chooser before showing it to the user.
-				insertTableView.rows = 0;
-				insertTableView.columns = 0;
-			} );
+				// Prepare custom view for dropdown's panel.
+				insertTableView = new InsertTableView( locale );
+				dropdownView.panelView.children.add( insertTableView );
+
+				insertTableView.delegate( 'execute' ).to( dropdownView );
+
+				dropdownView.buttonView.on( 'open', () => {
+					// Reset the chooser before showing it to the user.
+					insertTableView.rows = 0;
+					insertTableView.columns = 0;
+				} );
 
 
-			dropdownView.on( 'execute', () => {
-				editor.execute( 'insertTable', { rows: insertTableView.rows, columns: insertTableView.columns } );
-				editor.editing.view.focus();
+				dropdownView.on( 'execute', () => {
+					editor.execute( 'insertTable', { rows: insertTableView.rows, columns: insertTableView.columns } );
+					editor.editing.view.focus();
+				} );
 			} );
 			} );
 
 
 			return dropdownView;
 			return dropdownView;

+ 4 - 0
packages/ckeditor5-table/tests/tableui.js

@@ -75,6 +75,8 @@ describe( 'TableUI', () => {
 		it( 'should execute insertTable command on button execute event', () => {
 		it( 'should execute insertTable command on button execute event', () => {
 			const executeSpy = testUtils.sinon.spy( editor, 'execute' );
 			const executeSpy = testUtils.sinon.spy( editor, 'execute' );
 
 
+			insertTable.isOpen = true;
+
 			const tableSizeView = insertTable.panelView.children.first;
 			const tableSizeView = insertTable.panelView.children.first;
 
 
 			tableSizeView.rows = 2;
 			tableSizeView.rows = 2;
@@ -87,6 +89,8 @@ describe( 'TableUI', () => {
 		} );
 		} );
 
 
 		it( 'should reset rows & columns on dropdown open', () => {
 		it( 'should reset rows & columns on dropdown open', () => {
+			insertTable.isOpen = true;
+
 			const tableSizeView = insertTable.panelView.children.first;
 			const tableSizeView = insertTable.panelView.children.first;
 
 
 			expect( tableSizeView.rows ).to.equal( 0 );
 			expect( tableSizeView.rows ).to.equal( 0 );