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

Merge branch 'master' into t/ckeditor5-paste-from-office/14

Piotrek Koszuliński пре 6 година
родитељ
комит
d6ad3f2093

+ 3 - 3
packages/ckeditor5-utils/.travis.yml

@@ -1,9 +1,11 @@
 sudo: required
-dist: trusty
+dist: xenial
 addons:
   chrome: stable
   firefox: latest
 language: node_js
+services:
+- xvfb
 node_js:
 - '8'
 cache:
@@ -13,8 +15,6 @@ branches:
   - stable
 before_install:
 - export START_TIME=$( date +%s )
-- export DISPLAY=:99.0
-- sh -e /etc/init.d/xvfb start
 - npm i -g yarn
 install:
 - yarn add @ckeditor/ckeditor5-dev-tests

+ 0 - 1
packages/ckeditor5-utils/README.md

@@ -1,7 +1,6 @@
 CKEditor 5 utilities
 ========================================
 
-[![Join the chat at https://gitter.im/ckeditor/ckeditor5](https://badges.gitter.im/ckeditor/ckeditor5.svg)](https://gitter.im/ckeditor/ckeditor5?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
 [![npm version](https://badge.fury.io/js/%40ckeditor%2Fckeditor5-utils.svg)](https://www.npmjs.com/package/@ckeditor/ckeditor5-utils)
 [![Build Status](https://travis-ci.org/ckeditor/ckeditor5-utils.svg?branch=master)](https://travis-ci.org/ckeditor/ckeditor5-utils)
 [![Coverage Status](https://coveralls.io/repos/github/ckeditor/ckeditor5-utils/badge.svg?branch=master)](https://coveralls.io/github/ckeditor/ckeditor5-utils?branch=master)

+ 1 - 1
packages/ckeditor5-utils/docs/api/utils.md

@@ -26,5 +26,5 @@ The source code of this package is available on GitHub in https://github.com/cke
 
 * [`@ckeditor/ckeditor5-utils` on npm](https://www.npmjs.com/package/@ckeditor/ckeditor5-utils)
 * [`ckeditor/ckeditor5-utils` on GitHub](https://github.com/ckeditor/ckeditor5-utils)
-* [Issue tracker](https://github.com/ckeditor/ckeditor5-utils/issues)
+* [Issue tracker](https://github.com/ckeditor/ckeditor5/issues)
 * [Changelog](https://github.com/ckeditor/ckeditor5-utils/blob/master/CHANGELOG.md)

+ 17 - 6
packages/ckeditor5-utils/src/dom/rect.js

@@ -310,23 +310,34 @@ export default class Rect {
 	 */
 	excludeScrollbarsAndBorders() {
 		const source = this._source;
-		let scrollBarWidth, scrollBarHeight;
+		let scrollBarWidth, scrollBarHeight, direction;
 
 		if ( isWindow( source ) ) {
 			scrollBarWidth = source.innerWidth - source.document.documentElement.clientWidth;
 			scrollBarHeight = source.innerHeight - source.document.documentElement.clientHeight;
+			direction = source.getComputedStyle( source.document.documentElement ).direction;
 		} else {
 			const borderWidths = getBorderWidths( this._source );
 
-			scrollBarWidth = source.offsetWidth - source.clientWidth;
-			scrollBarHeight = source.offsetHeight - source.clientHeight;
+			scrollBarWidth = source.offsetWidth - source.clientWidth - borderWidths.left - borderWidths.right;
+			scrollBarHeight = source.offsetHeight - source.clientHeight - borderWidths.top - borderWidths.bottom;
+			direction = source.ownerDocument.defaultView.getComputedStyle( source ).direction;
 
-			this.moveBy( borderWidths.left, borderWidths.top );
+			this.left += borderWidths.left;
+			this.top += borderWidths.top;
+			this.right -= borderWidths.right;
+			this.bottom -= borderWidths.bottom;
+			this.width = this.right - this.left;
+			this.height = this.bottom - this.top;
 		}
 
-		// Assuming LTR scrollbars. TODO: RTL.
 		this.width -= scrollBarWidth;
-		this.right -= scrollBarWidth;
+
+		if ( direction === 'ltr' ) {
+			this.right -= scrollBarWidth;
+		} else {
+			this.left += scrollBarWidth;
+		}
 
 		this.height -= scrollBarHeight;
 		this.bottom -= scrollBarHeight;

+ 104 - 15
packages/ckeditor5-utils/tests/dom/rect.js

@@ -792,18 +792,21 @@ describe( 'Rect', () => {
 	} );
 
 	describe( 'excludeScrollbarsAndBorders()', () => {
-		it( 'should exclude scrollbars and borders of a HTMLElement', () => {
+		it( 'should exclude scrollbars and borders of a HTMLElement (dir="ltr")', () => {
 			const element = document.createElement( 'div' );
 
 			sinon.stub( element, 'getBoundingClientRect' ).returns( geometry );
-			sinon.stub( window, 'getComputedStyle' ).returns( {
-				borderTopWidth: '5px',
-				borderRightWidth: '10px',
-				borderLeftWidth: '5px',
-				borderBottomWidth: '10px'
-			} );
+			sinon.stub( window, 'getComputedStyle' )
+				.withArgs( element )
+				.returns( {
+					borderTopWidth: '5px',
+					borderRightWidth: '10px',
+					borderLeftWidth: '5px',
+					borderBottomWidth: '10px',
+					direction: 'ltr'
+				} );
 
-			// Simulate 5px srollbars.
+			// Simulate 5px scrollbars.
 			Object.defineProperties( element, {
 				offsetWidth: {
 					value: 20
@@ -812,24 +815,65 @@ describe( 'Rect', () => {
 					value: 20
 				},
 				clientWidth: {
-					value: 10
+					value: 0
 				},
 				clientHeight: {
-					value: 10
+					value: 0
 				}
 			} );
 
 			assertRect( new Rect( element ).excludeScrollbarsAndBorders(), {
 				top: 15,
-				right: 35,
-				bottom: 25,
+				right: 25,
+				bottom: 15,
 				left: 25,
-				width: 10,
-				height: 10
+				width: 0,
+				height: 0
+			} );
+		} );
+
+		it( 'should exclude scrollbars and borders of a HTMLElement (dir="rtl")', () => {
+			const element = document.createElement( 'div' );
+
+			element.setAttribute( 'dir', 'rtl' );
+			sinon.stub( element, 'getBoundingClientRect' ).returns( geometry );
+			sinon.stub( window, 'getComputedStyle' )
+				.withArgs( element )
+				.returns( {
+					borderTopWidth: '5px',
+					borderRightWidth: '10px',
+					borderLeftWidth: '5px',
+					borderBottomWidth: '10px',
+					direction: 'rtl'
+				} );
+
+			// Simulate 5px scrollbars.
+			Object.defineProperties( element, {
+				offsetWidth: {
+					value: 20
+				},
+				offsetHeight: {
+					value: 20
+				},
+				clientWidth: {
+					value: 0
+				},
+				clientHeight: {
+					value: 0
+				}
+			} );
+
+			assertRect( new Rect( element ).excludeScrollbarsAndBorders(), {
+				top: 15,
+				right: 30,
+				bottom: 15,
+				left: 30,
+				width: 0,
+				height: 0
 			} );
 		} );
 
-		it( 'should exclude scrollbars from viewport\'s rect', () => {
+		it( 'should exclude scrollbars from viewport\'s rect (dir="ltr")', () => {
 			sinon.stub( window, 'innerWidth' ).value( 1000 );
 			sinon.stub( window, 'innerHeight' ).value( 500 );
 			sinon.stub( window, 'scrollX' ).value( 100 );
@@ -840,6 +884,12 @@ describe( 'Rect', () => {
 				clientHeight: 490
 			} );
 
+			sinon.stub( window, 'getComputedStyle' )
+				.withArgs( document.documentElement )
+				.returns( {
+					direction: 'ltr'
+				} );
+
 			assertRect( new Rect( window ).excludeScrollbarsAndBorders(), {
 				top: 0,
 				right: 990,
@@ -850,6 +900,33 @@ describe( 'Rect', () => {
 			} );
 		} );
 
+		it( 'should exclude scrollbars from viewport\'s rect (dir="rtl")', () => {
+			sinon.stub( window, 'innerWidth' ).value( 1000 );
+			sinon.stub( window, 'innerHeight' ).value( 500 );
+			sinon.stub( window, 'scrollX' ).value( 100 );
+			sinon.stub( window, 'scrollY' ).value( 200 );
+
+			sinon.stub( document, 'documentElement' ).value( {
+				clientWidth: 990,
+				clientHeight: 490
+			} );
+
+			sinon.stub( window, 'getComputedStyle' )
+				.withArgs( document.documentElement )
+				.returns( {
+					direction: 'rtl'
+				} );
+
+			assertRect( new Rect( window ).excludeScrollbarsAndBorders(), {
+				top: 0,
+				right: 1000,
+				bottom: 490,
+				left: 10,
+				width: 990,
+				height: 490
+			} );
+		} );
+
 		it( 'should work for a window in an iframe', done => {
 			const iframe = document.createElement( 'iframe' );
 
@@ -864,6 +941,12 @@ describe( 'Rect', () => {
 				clientHeight: 490
 			} );
 
+			sinon.stub( window, 'getComputedStyle' )
+				.withArgs( document.documentElement )
+				.returns( {
+					direction: 'ltr'
+				} );
+
 			iframe.addEventListener( 'load', () => {
 				const iframeWindow = iframe.contentWindow;
 
@@ -877,6 +960,12 @@ describe( 'Rect', () => {
 					clientHeight: 230
 				} );
 
+				sinon.stub( iframeWindow, 'getComputedStyle' )
+					.withArgs( iframeWindow.document.documentElement )
+					.returns( {
+						direction: 'ltr'
+					} );
+
 				assertRect( new Rect( iframeWindow ).excludeScrollbarsAndBorders(), {
 					top: 0,
 					right: 480,

+ 6 - 3
packages/ckeditor5-utils/tests/dom/scroll.js

@@ -28,7 +28,8 @@ describe( 'scrollAncestorsToShowTarget()', () => {
 			borderTopWidth: '0px',
 			borderRightWidth: '0px',
 			borderBottomWidth: '0px',
-			borderLeftWidth: '0px'
+			borderLeftWidth: '0px',
+			direction: 'ltr'
 		} );
 
 		stubRect( firstAncestor, {
@@ -169,7 +170,8 @@ describe( 'scrollViewportToShowTarget()', () => {
 			borderTopWidth: '0px',
 			borderRightWidth: '0px',
 			borderBottomWidth: '0px',
-			borderLeftWidth: '0px'
+			borderLeftWidth: '0px',
+			direction: 'ltr'
 		} );
 
 		// Assuming 20px v- and h-scrollbars here.
@@ -228,7 +230,8 @@ describe( 'scrollViewportToShowTarget()', () => {
 					borderTopWidth: '0px',
 					borderRightWidth: '0px',
 					borderBottomWidth: '0px',
-					borderLeftWidth: '0px'
+					borderLeftWidth: '0px',
+					direction: 'ltr'
 				} );
 
 				// Assuming 20px v- and h-scrollbars here.