DOMRect update (#1973)

* Compare using left/top rather than x/y

* Simplify

* Update Popup*.getFrameRect to return a custom structure

* Don't use x/y on DOMRect
This commit is contained in:
toasted-nutbread 2021-09-30 21:05:34 -04:00 committed by GitHub
parent 6cf01555e7
commit 19eb990aeb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 25 additions and 30 deletions

View File

@ -543,12 +543,13 @@ class Frontend {
} }
_showPopupContent(textSource, optionsContext, details=null) { _showPopupContent(textSource, optionsContext, details=null) {
const {left, top, width, height} = textSource.getRect();
this._lastShowPromise = ( this._lastShowPromise = (
this._popup !== null ? this._popup !== null ?
this._popup.showContent( this._popup.showContent(
{ {
optionsContext, optionsContext,
elementRect: textSource.getRect(), elementRect: {x: left, y: top, width, height, valid: true},
writingMode: textSource.getWritingMode() writingMode: textSource.getWritingMode()
}, },
details details

View File

@ -230,7 +230,7 @@ class PopupFactory {
const {elementRect} = details; const {elementRect} = details;
if (typeof elementRect !== 'undefined') { if (typeof elementRect !== 'undefined') {
details.elementRect = this._convertJsonRectToDOMRect(popup, elementRect); [elementRect.x, elementRect.y] = this._convertPopupPointToRootPagePoint(popup, elementRect.x, elementRect.y);
} }
return await popup.showContent(details, displayDetails); return await popup.showContent(details, displayDetails);
@ -281,18 +281,15 @@ class PopupFactory {
return popup; return popup;
} }
_convertJsonRectToDOMRect(popup, jsonRect) {
const [x, y] = this._convertPopupPointToRootPagePoint(popup, jsonRect.x, jsonRect.y);
return new DOMRect(x, y, jsonRect.width, jsonRect.height);
}
_convertPopupPointToRootPagePoint(popup, x, y) { _convertPopupPointToRootPagePoint(popup, x, y) {
const parent = popup.parent; const {parent} = popup;
if (parent !== null) { if (parent !== null) {
const popupRect = parent.getFrameRect(); const popupRect = parent.getFrameRect();
if (popupRect.valid) {
x += popupRect.x; x += popupRect.x;
y += popupRect.y; y += popupRect.y;
} }
}
return [x, y]; return [x, y];
} }

View File

@ -104,13 +104,9 @@ class PopupProxy extends EventDispatcher {
async showContent(details, displayDetails) { async showContent(details, displayDetails) {
const {elementRect} = details; const {elementRect} = details;
if (typeof elementRect !== 'undefined') { if (typeof elementRect !== 'undefined' && this._frameOffsetForwarder !== null) {
let {x, y, width, height} = elementRect;
if (this._frameOffsetForwarder !== null) {
await this._updateFrameOffset(); await this._updateFrameOffset();
[x, y] = this._applyFrameOffset(x, y); [elementRect.x, elementRect.y] = this._applyFrameOffset(elementRect.x, elementRect.y);
}
details.elementRect = {x, y, width, height};
} }
return await this._invokeSafe('showContent', {id: this._id, details, displayDetails}); return await this._invokeSafe('showContent', {id: this._id, details, displayDetails});
} }
@ -140,7 +136,7 @@ class PopupProxy extends EventDispatcher {
} }
getFrameRect() { getFrameRect() {
return new DOMRect(0, 0, 0, 0); return {x: 0, y: 0, width: 0, height: 0, valid: false};
} }
getFrameSize() { getFrameSize() {

View File

@ -123,7 +123,7 @@ class PopupWindow extends EventDispatcher {
} }
getFrameRect() { getFrameRect() {
return new DOMRect(0, 0, 0, 0); return {x: 0, y: 0, width: 0, height: 0, valid: false};
} }
async getFrameSize() { async getFrameSize() {

View File

@ -142,7 +142,7 @@ class Popup extends EventDispatcher {
async containsPoint(x, y) { async containsPoint(x, y) {
for (let popup = this; popup !== null && popup.isVisibleSync(); popup = popup.child) { for (let popup = this; popup !== null && popup.isVisibleSync(); popup = popup.child) {
const rect = popup.getFrameRect(); const rect = popup.getFrameRect();
if (x >= rect.left && y >= rect.top && x < rect.right && y < rect.bottom) { if (rect.valid && x >= rect.x && y >= rect.y && x < rect.x + rect.width && y < rect.y + rect.height) {
return true; return true;
} }
} }
@ -203,12 +203,13 @@ class Popup extends EventDispatcher {
} }
getFrameRect() { getFrameRect() {
return this._frame.getBoundingClientRect(); const {left, top, width, height} = this._frame.getBoundingClientRect();
return {x: left, y: top, width, height, valid: true};
} }
async getFrameSize() { async getFrameSize() {
const rect = this._frame.getBoundingClientRect(); const {width, height} = this._frame.getBoundingClientRect();
return {width: rect.width, height: rect.height, valid: true}; return {width, height, valid: true};
} }
async setFrameSize(width, height) { async setFrameSize(width, height) {
@ -535,16 +536,16 @@ class Popup extends EventDispatcher {
const verticalOffset = optionsGeneral.popupVerticalOffset * offsetScale; const verticalOffset = optionsGeneral.popupVerticalOffset * offsetScale;
const [x, w] = this._getConstrainedPosition( const [x, w] = this._getConstrainedPosition(
elementRect.right - horizontalOffset, elementRect.x + elementRect.width - horizontalOffset,
elementRect.left + horizontalOffset, elementRect.x + horizontalOffset,
width, width,
viewport.left, viewport.left,
viewport.right, viewport.right,
true true
); );
const [y, h, below] = this._getConstrainedPositionBinary( const [y, h, below] = this._getConstrainedPositionBinary(
elementRect.top - verticalOffset, elementRect.y - verticalOffset,
elementRect.bottom + verticalOffset, elementRect.y + elementRect.height + verticalOffset,
height, height,
viewport.top, viewport.top,
viewport.bottom, viewport.bottom,

View File

@ -63,7 +63,7 @@ class FrameOffsetForwarder {
const frameElement = this._frameAncestryHandler.getChildFrameElement(frameId); const frameElement = this._frameAncestryHandler.getChildFrameElement(frameId);
if (frameElement === null) { return null; } if (frameElement === null) { return null; }
const {x, y, width, height} = frameElement.getBoundingClientRect(); const {left, top, width, height} = frameElement.getBoundingClientRect();
return {x, y, width, height}; return {x: left, y: top, width, height};
} }
} }

View File

@ -408,7 +408,7 @@ class DocumentUtil {
this._setImposterStyle(imposterStyle, 'width', `${width}px`); this._setImposterStyle(imposterStyle, 'width', `${width}px`);
this._setImposterStyle(imposterStyle, 'height', `${height}px`); this._setImposterStyle(imposterStyle, 'height', `${height}px`);
} }
if (imposterRect.x !== elementRect.x || imposterRect.y !== elementRect.y) { if (imposterRect.left !== elementRect.left || imposterRect.top !== elementRect.top) {
left += (elementRect.left - imposterRect.left); left += (elementRect.left - imposterRect.left);
top += (elementRect.top - imposterRect.top); top += (elementRect.top - imposterRect.top);
this._setImposterStyle(imposterStyle, 'left', `${left}px`); this._setImposterStyle(imposterStyle, 'left', `${left}px`);