Parcourir la source

Tests: Added test for positioned element with border and scrolls.

Aleksander Nowodzinski il y a 8 ans
Parent
commit
678a6d1b42
1 fichiers modifiés avec 90 ajouts et 28 suppressions
  1. 90 28
      packages/ckeditor5-utils/tests/dom/position.js

+ 90 - 28
packages/ckeditor5-utils/tests/dom/position.js

@@ -51,41 +51,103 @@ describe( 'getOptimalPosition', () => {
 			} );
 		} );
 
-		it( 'should return coordinates (positioned element parent)', () => {
-			const positionedParent = document.createElement( 'div' );
+		describe( 'positioned element parent', () => {
+			let positionedParent;
 
-			Object.assign( windowStub, {
-				innerWidth: 10000,
-				innerHeight: 10000,
-				scrollX: 1000,
-				scrollY: 1000,
-				getComputedStyle: ( el ) => {
-					return window.getComputedStyle( el );
-				}
+			beforeEach( () => {
+				positionedParent = document.createElement( 'div' );
+				document.body.appendChild( positionedParent );
 			} );
 
-			Object.assign( positionedParent.style, {
-				position: 'absolute',
-				top: '1000px',
-				left: '1000px'
+			afterEach( () => {
+				positionedParent.remove();
 			} );
 
-			document.body.appendChild( positionedParent );
-			positionedParent.appendChild( element );
-
-			stubElementRect( positionedParent, {
-				top: 1000,
-				right: 1010,
-				bottom: 1010,
-				left: 1000,
-				width: 10,
-				height: 10
+			it( 'should return coordinates', () => {
+				Object.assign( windowStub, {
+					innerWidth: 10000,
+					innerHeight: 10000,
+					scrollX: 1000,
+					scrollY: 1000,
+					getComputedStyle: ( el ) => {
+						return window.getComputedStyle( el );
+					}
+				} );
+
+				Object.assign( positionedParent.style, {
+					position: 'absolute',
+					top: '1000px',
+					left: '1000px'
+				} );
+
+				positionedParent.appendChild( element );
+
+				stubElementRect( positionedParent, {
+					top: 1000,
+					right: 1010,
+					bottom: 1010,
+					left: 1000,
+					width: 10,
+					height: 10
+				} );
+
+				assertPosition( { element, target, positions: [ attachLeft ] }, {
+					top: -900,
+					left: -920,
+					name: 'left'
+				} );
 			} );
 
-			assertPosition( { element, target, positions: [ attachLeft ] }, {
-				top: -900,
-				left: -920,
-				name: 'left'
+			it( 'should return coordinates (scroll and border)', () => {
+				const inflaterElement = document.createElement( 'div' );
+
+				Object.assign( windowStub, {
+					innerWidth: 10000,
+					innerHeight: 10000,
+					scrollX: 1000,
+					scrollY: 1000,
+					getComputedStyle: ( el ) => {
+						return window.getComputedStyle( el );
+					}
+				} );
+
+				positionedParent.appendChild( inflaterElement );
+				positionedParent.appendChild( element );
+
+				Object.assign( positionedParent.style, {
+					position: 'absolute',
+					overflow: 'scroll',
+					height: '100px',
+					width: '100px',
+					top: '0px',
+					left: '0px',
+					border: '1px solid red',
+					borderLeftWidth: '20px',
+					borderTopWidth: '40px',
+				} );
+
+				Object.assign( inflaterElement.style, {
+					width: '500px',
+					height: '500px'
+				} );
+
+				positionedParent.scrollTop = 100;
+				positionedParent.scrollLeft = 200;
+
+				stubElementRect( positionedParent, {
+					top: 0,
+					right: 10,
+					bottom: 10,
+					left: 0,
+					width: 10,
+					height: 10
+				} );
+
+				assertPosition( { element, target, positions: [ attachLeft ] }, {
+					top: 160,
+					left: 260,
+					name: 'left'
+				} );
 			} );
 		} );
 	} );