Explorar o código

Tests: Added manual performance test for initializing the editor.

Marek Lewandowski %!s(int64=6) %!d(string=hai) anos
pai
achega
27ae77948f

+ 17 - 0
tests/manual/performance/editorinit.html

@@ -0,0 +1,17 @@
+<div id="test-controls">
+	Initialize editor with:
+	<button id="small-content" data-file-name="small" disabled>small</button>
+	<button id="medium-content" data-file-name="medium" disabled>medium</button>
+	<button id="large-content" data-file-name="large" disabled>large</button>
+	HTML payload.
+</div>
+
+<style>
+	.editor {
+		display: none;
+	}
+</style>
+
+<div id="editor_small" class="editor"></div>
+<div id="editor_medium" class="editor"></div>
+<div id="editor_large" class="editor"></div>

+ 69 - 0
tests/manual/performance/editorinit.js

@@ -0,0 +1,69 @@
+/**
+ * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/* globals console, window, document */
+
+import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
+import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
+import { loadPerformanceData } from '../../_utils/utils';
+
+loadPerformanceData()
+	.then( fixtures => {
+		const buttons = document.querySelectorAll( '#test-controls button' );
+
+		for ( const button of buttons ) {
+			const fixtureName = button.getAttribute( 'data-file-name' );
+			const content = fixtures[ fixtureName ];
+			const editorElement = document.querySelector( `#editor_${ fixtureName }` );
+
+			// Put the source content in editor-related elements ahead of time, so that potentially
+			// big `innerHTML` change does not affect the benchmark when pressing the button.
+			editorElement.innerHTML = content;
+
+			button.addEventListener( 'click', function() {
+				ClassicEditor
+					.create( editorElement, {
+						plugins: [ ArticlePluginSet ],
+						toolbar: [
+							'heading',
+							'|',
+							'bold',
+							'italic',
+							'link',
+							'bulletedList',
+							'numberedList',
+							'|',
+							'outdent',
+							'indent',
+							'|',
+							'blockQuote',
+							'insertTable',
+							'mediaEmbed',
+							'undo',
+							'redo'
+						],
+						image: {
+							toolbar: [ 'imageStyle:full', 'imageStyle:side', '|', 'imageTextAlternative' ]
+						},
+						table: {
+							contentToolbar: [
+								'tableColumn',
+								'tableRow',
+								'mergeTableCells'
+							]
+						}
+					} )
+					.then( editor => {
+						window.editor = editor;
+					} )
+					.catch( err => {
+						console.error( err.stack );
+					} );
+			} );
+
+			button.disabled = false;
+		}
+	} );
+

+ 8 - 0
tests/manual/performance/editorinit.md

@@ -0,0 +1,8 @@
+# Performance: editor initialization
+
+1. You might want to enable devtools profiling.
+1. (optionally) Begin performance recording in devtools.
+1. Use any button to initialize the editor with a given content.
+1. (optionally) Stop performance recording.
+
+**Note:** You should initialize editor only once. To test it again / different scenario refresh the page to have clear reference.