From 87d42a3ae6ed6e72f9fdf15fa7fbcfd0863ae43e Mon Sep 17 00:00:00 2001 From: Popov Aleksey <Alekseypopow1995@yandex.ru> Date: Tue, 12 Sep 2023 04:41:05 -0700 Subject: [PATCH] refactor: removed IE leftovers from src\client\core\utils (part 2) (#7999) <!-- Thank you for your contribution. Before making a PR, please read our contributing guidelines at https://github.com/DevExpress/testcafe/blob/master/CONTRIBUTING.md#code-contribution We recommend creating a *draft* PR, so that you can mark it as 'ready for review' when you are done. --> ## Purpose _Describe the problem you want to address or the feature you want to implement._ ## Approach _Describe how your changes address the issue or implement the desired functionality in as much detail as possible._ ## References _Provide a link to the existing issue(s), if any._ ## Pre-Merge TODO - [ ] Write tests for your proposed changes - [ ] Make sure that existing tests do not fail --- src/client/core/utils/key-maps.js | 10 +- src/client/core/utils/position.ts | 3 +- src/client/core/utils/scroll.ts | 19 +--- src/client/core/utils/text-selection.js | 125 +----------------------- 4 files changed, 13 insertions(+), 144 deletions(-) diff --git a/src/client/core/utils/key-maps.js b/src/client/core/utils/key-maps.js index 243ffbc4f1e..8f6347cf7d7 100644 --- a/src/client/core/utils/key-maps.js +++ b/src/client/core/utils/key-maps.js @@ -55,10 +55,10 @@ const SPECIAL_KEYS = { }; const KEY_PROPERTY = { - left: browserUtils.isIE ? 'Left' : 'ArrowLeft', - down: browserUtils.isIE ? 'Down' : 'ArrowDown', - right: browserUtils.isIE ? 'Right' : 'ArrowRight', - up: browserUtils.isIE ? 'Up' : 'ArrowUp', + left: 'ArrowLeft', + down: 'ArrowDown', + right: 'ArrowRight', + up: 'ArrowUp', backspace: 'Backspace', capslock: 'CapsLock', delete: 'Delete', @@ -69,7 +69,7 @@ const KEY_PROPERTY = { ins: 'Insert', pagedown: 'PageDown', pageup: 'PageUp', - space: browserUtils.isIE ? 'Spacebar' : ' ', + space: ' ', tab: 'Tab', alt: 'Alt', ctrl: 'Control', diff --git a/src/client/core/utils/position.ts b/src/client/core/utils/position.ts index 11762ce3b31..717092d4aa8 100644 --- a/src/client/core/utils/position.ts +++ b/src/client/core/utils/position.ts @@ -65,8 +65,7 @@ export function getClientDimensions (target: HTMLElement): Dimensions { export function getElementFromPoint ({ x, y }: AxisValuesData<number>): Element | null { // @ts-ignore - const ieFn = document.getElementFromPoint; - const func = ieFn || document.elementFromPoint; + const func = document.elementFromPoint; let el: Element | null = null; diff --git a/src/client/core/utils/scroll.ts b/src/client/core/utils/scroll.ts index 5f8d78ef980..c6e5b50de45 100644 --- a/src/client/core/utils/scroll.ts +++ b/src/client/core/utils/scroll.ts @@ -4,22 +4,13 @@ import { utils, nativeMethods } from '../deps/hammerhead'; import * as domUtils from './dom'; import * as styleUtils from './style'; -const SCROLLABLE_OVERFLOW_STYLE_RE = /auto|scroll|hidden/i; -const DEFAULT_IE_SCROLLABLE_OVERFLOW_STYLE_VALUE = 'visible'; +const SCROLLABLE_OVERFLOW_STYLE_RE = /auto|scroll|hidden/i; function getScrollable (el: Element): AxisValues<boolean> { - const overflowX = styleUtils.get(el, 'overflowX') as string; - const overflowY = styleUtils.get(el, 'overflowY') as string; - let scrollableHorizontally = SCROLLABLE_OVERFLOW_STYLE_RE.test(overflowX); - let scrollableVertically = SCROLLABLE_OVERFLOW_STYLE_RE.test(overflowY); - - // IE11 and MS Edge bug: There are two properties: overflow-x and overflow-y. - // If one property is set so that the browser may show scrollbars (`auto` or `scroll`) and the second one is set to 'visible', - // then the second one will work as if it had the 'auto' value. - if (utils.browser.isIE) { - scrollableHorizontally = scrollableHorizontally || scrollableVertically && overflowX === DEFAULT_IE_SCROLLABLE_OVERFLOW_STYLE_VALUE; - scrollableVertically = scrollableVertically || scrollableHorizontally && overflowY === DEFAULT_IE_SCROLLABLE_OVERFLOW_STYLE_VALUE; - } + const overflowX = styleUtils.get(el, 'overflowX') as string; + const overflowY = styleUtils.get(el, 'overflowY') as string; + const scrollableHorizontally = SCROLLABLE_OVERFLOW_STYLE_RE.test(overflowX); + const scrollableVertically = SCROLLABLE_OVERFLOW_STYLE_RE.test(overflowY); return new AxisValues(scrollableHorizontally, scrollableVertically); } diff --git a/src/client/core/utils/text-selection.js b/src/client/core/utils/text-selection.js index 1ec70385033..1c5c53f1bff 100644 --- a/src/client/core/utils/text-selection.js +++ b/src/client/core/utils/text-selection.js @@ -1,133 +1,18 @@ import hammerhead from '../deps/hammerhead'; import * as domUtils from './dom'; import * as contentEditable from './content-editable'; -import * as eventUtils from './event'; const browserUtils = hammerhead.utils.browser; -const nativeMethods = hammerhead.nativeMethods; const selectionSandbox = hammerhead.eventSandbox.selection; -//NOTE: we can't determine selection direction in ie from dom api. Therefore we should listen selection changes, -// and calculate direction using it. const BACKWARD_SELECTION_DIRECTION = 'backward'; const FORWARD_SELECTION_DIRECTION = 'forward'; const NONE_SELECTION_DIRECTION = 'none'; -let selectionDirection = NONE_SELECTION_DIRECTION; -let initialLeft = 0; -let initialTop = 0; -let lastSelectionHeight = 0; -let lastSelectionLeft = 0; -let lastSelectionLength = 0; -let lastSelectionTop = 0; - -function stateChanged (left, top, height, width, selectionLength) { - if (!selectionLength) { - initialLeft = left; - initialTop = top; - selectionDirection = NONE_SELECTION_DIRECTION; - } - else { - switch (selectionDirection) { - case NONE_SELECTION_DIRECTION: - if (top === lastSelectionTop && (left === lastSelectionLeft || height > lastSelectionHeight)) - selectionDirection = FORWARD_SELECTION_DIRECTION; - else if (left < lastSelectionLeft || top < lastSelectionTop) - selectionDirection = BACKWARD_SELECTION_DIRECTION; - - break; - - case FORWARD_SELECTION_DIRECTION: - if (left === lastSelectionLeft && top === lastSelectionTop || - left < lastSelectionLeft && height > lastSelectionHeight || - top === lastSelectionTop && height === lastSelectionHeight && - selectionLength > lastSelectionLength && - left + width !== initialLeft) - break; - else if (left < lastSelectionLeft || top < lastSelectionTop) - selectionDirection = BACKWARD_SELECTION_DIRECTION; - - break; - - case BACKWARD_SELECTION_DIRECTION: - if ((left < lastSelectionLeft || top < lastSelectionTop) && selectionLength > lastSelectionLength) - break; - else if (top === initialTop && (left >= initialLeft || height > lastSelectionHeight)) - selectionDirection = FORWARD_SELECTION_DIRECTION; - - break; - } - } - - lastSelectionHeight = height; - lastSelectionLeft = left; - lastSelectionLength = selectionLength; - lastSelectionTop = top; -} - -function onSelectionChange () { - let activeElement = null; - let endSelection = null; - let range = null; - let rect = null; - let startSelection = null; - - try { - if (this.selection) - range = this.selection.createRange(); - else { - //HACK: we need do this for IE11 because otherwise we can not get TextRange properties - activeElement = nativeMethods.documentActiveElementGetter.call(this); - - if (!activeElement || !domUtils.isTextEditableElement(activeElement)) { - selectionDirection = NONE_SELECTION_DIRECTION; - - return; - } - - startSelection = getSelectionStart(activeElement); - endSelection = getSelectionEnd(activeElement); - - if (activeElement.createTextRange) { - range = activeElement.createTextRange(); - range.collapse(true); - range.moveStart('character', startSelection); - range.moveEnd('character', endSelection - startSelection); - } - else if (document.createRange) { - //NOTE: for MSEdge - range = document.createRange(); - - const textNode = hammerhead.nativeMethods.nodeFirstChildGetter.call(activeElement); - - range.setStart(textNode, startSelection); - range.setEnd(textNode, endSelection); - rect = range.getBoundingClientRect(); - } - } - } - catch (e) { - //NOTE: in ie it raises error when there are not a real selection - selectionDirection = NONE_SELECTION_DIRECTION; - - return; - } - - const rangeLeft = rect ? Math.ceil(rect.left) : range.offsetLeft; - const rangeTop = rect ? Math.ceil(rect.top) : range.offsetTop; - const rangeHeight = rect ? Math.ceil(rect.height) : range.boundingHeight; - const rangeWidth = rect ? Math.ceil(rect.width) : range.boundingWidth; - const rangeHTMLTextLength = range.htmlText ? range.htmlText.length : 0; - const rangeTextLength = rect ? range.toString().length : rangeHTMLTextLength; - - stateChanged(rangeLeft, rangeTop, rangeHeight, rangeWidth, rangeTextLength); -} - -if (browserUtils.isIE) - eventUtils.bind(document, 'selectionchange', onSelectionChange, true); +let selectionDirection = NONE_SELECTION_DIRECTION; //utils for contentEditable function selectContentEditable (el, from, to, needFocus) { @@ -212,7 +97,7 @@ function correctContentEditableSelectionBeforeDelete (el) { newEndOffset = endNode.nodeValue.length; } - if (browserUtils.isWebKit || browserUtils.isIE && browserUtils.version > 11) { + if (browserUtils.isWebKit) { if (newStartOffset !== null) { if (newStartOffset === 0) startNode.nodeValue = startNode.nodeValue.substring(startNodeFirstNonWhitespaceSymbol); @@ -369,17 +254,11 @@ export function selectByNodesAndOffsets (startPos, endPos, needFocus) { const selectionSetter = function () { selection.removeAllRanges(); - //NOTE: For IE we can't create inverse selection if (!inverse) { range.setStart(startNode, startOffset); range.setEnd(endNode, endOffset); selection.addRange(range); } - else if (browserUtils.isIE) { - range.setStart(endNode, endOffset); - range.setEnd(startNode, startOffset); - selection.addRange(range); - } else { range.setStart(startNode, startOffset); range.setEnd(startNode, startOffset);