8
0
Просмотр исходного кода

Tests: More tests for produced HTML markup.

Marek Lewandowski 6 лет назад
Родитель
Сommit
4715705cf6
1 измененных файлов с 72 добавлено и 27 удалено
  1. 72 27
      packages/ckeditor5-widget/tests/widgetresize/resizer.js

+ 72 - 27
packages/ckeditor5-widget/tests/widgetresize/resizer.js

@@ -3,48 +3,93 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
+/* globals document */
+
 import Resizer from '../../src/widgetresize/resizer';
 
 import Element from '@ckeditor/ckeditor5-engine/src/model/element';
 import ContainerElement from '@ckeditor/ckeditor5-engine/src/view/containerelement';
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
 
-import View from '@ckeditor/ckeditor5-engine/src/view/view';
-import DowncastWriter from '@ckeditor/ckeditor5-engine/src/view/downcastwriter';
+import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
 
-// import {
-// 	getData as getViewData
-// } from '@ckeditor/ckeditor5-engine/src/dev-utils/view';
+describe( 'Resizer', () => {
+	let editor, editorElement;
 
-const view = new View();
-const doc = view.document;
-const writer = new DowncastWriter( doc );
+	before( () => {
+		editorElement = document.createElement( 'div' );
+		document.body.append( editorElement );
+
+		return ClassicTestEditor
+			.create( editorElement, {
+				plugins: [
+					ArticlePluginSet
+				]
+			} )
+			.then( newEditor => {
+				editor = newEditor;
+			} );
+	} );
+
+	after( () => {
+		editorElement.remove();
+		return editor.destroy();
+	} );
 
-describe( 'Resizer', () => {
 	it( 'constructs properly', () => {
-		const instance = createResizer();
+		const resizerInstance = createResizer();
 
-		expect( instance.isEnabled ).to.be.true;
+		expect( resizerInstance.isEnabled ).to.be.true;
 	} );
 
-	it( 'adds a proper markup when attached', () => {
-		const instance = createResizer();
-		instance.attach();
+	describe( 'markup', () => {
+		let resizerInstance, renderedElement;
 
-		// TODO: check output
+		before( () => {
+			resizerInstance = createResizer();
+			resizerInstance.attach();
 
-		// console.log( instance._options.viewElement );
+			renderedElement = resizerInstance._viewResizerWrapper.render( document );
+		} );
 
-		// expect( getViewData( instance._options.viewElement ) ).to.be.eql( 'foo' );
-	} );
-} );
+		after( () => {
+			renderedElement.remove();
+		} );
+
+		it( 'root element contains proper classes', () => {
+			const rootElementClasses = Array.from( renderedElement.classList );
+
+			expect( rootElementClasses ).to.include( 'ck' );
+			expect( rootElementClasses ).to.include( 'ck-reset_all' );
+			expect( rootElementClasses ).to.include( 'ck-widget__resizer' );
+		} );
+
+		it( 'includes handle for each corner', () => {
+			const handleSelectors = [
+				'.ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-right',
+				'.ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-left',
+				'.ck-widget__resizer__handle.ck-widget__resizer__handle-top-left',
+				'.ck-widget__resizer__handle.ck-widget__resizer__handle-top-right'
+			];
 
-function createResizer() {
-	const model = new Element( 'resizable' );
-	const viewElement = new ContainerElement( 'div' );
+			for ( const selector of handleSelectors ) {
+				expect( renderedElement.querySelectorAll( selector ).length, `Selector "${ selector }" matches` ).to.be.equal( 1 );
+			}
+		} );
 
-	return new Resizer( {
-		modelElement: model,
-		viewElement,
-		downcastWriter: writer
+		it( 'renders sizeUi', () => {
+			expect( renderedElement.querySelectorAll( '.ck-size-view' ).length ).to.be.equal( 1 );
+		} );
 	} );
-}
+
+	function createResizer() {
+		const model = new Element( 'resizable' );
+		const viewElement = new ContainerElement( 'div' );
+
+		return new Resizer( {
+			modelElement: model,
+			viewElement,
+			editor
+		} );
+	}
+} );