Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

core(full-page-screenshot): do not render zero size rects #11853

Merged
merged 7 commits into from
Dec 29, 2020

Conversation

connorjclark
Copy link
Collaborator

avoids silly things like this:

image

at some point during implementation there was a size check here, which would not set node.boundingRect if zero sized. got lost/replaced by just a size check in the FPS gatherer, but that only covers the "shifted" rect...

the intention the entire time was to have boundingRect be undefined if zero sized. that way usage code can just do if (rect) ..., and not if (rect && rect.width && rect.height) ...

@connorjclark connorjclark requested a review from a team as a code owner December 17, 2020 22:54
@connorjclark connorjclark requested review from Beytoven and removed request for a team December 17, 2020 22:54
@google-cla google-cla bot added the cla: yes label Dec 17, 2020
*/
/* istanbul ignore next */
function getBoundingClientRect(element) {
// The protocol does not serialize getters, so extract the values explicitly.
const rect = element.getBoundingClientRect();
if (rect.width === 0 || rect.height === 0) return;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

other places use this function and might expect a 0x0 rect returned, though...

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

darn @ts-expect-error and stringification! I'll look closer.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nope, this is only used in two places: page-function getNodeDetails, and the FPS gatherer.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can the silliness be avoided through other means like ignoring head contents?

I agree that doing this for all elements that happen to not have size might be a mistake. The location can often still provide value in hidden element cases.

Copy link
Member

@brendankenny brendankenny Dec 17, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah, I guess I meant a function called getBoundingClientRect seems like the wrong place to determine if it's worth keeping the rect from the element or not. getBoundingClientRectIfItHasSize, maybe :)

Agreed it is a little weird that all the uses of NodeDetails keep their boundingRect, though. e.g. LinkElements didn't have any before #11405. Maybe we need an easy way for callers of getNodeDetails to indicate that they know that 0x0 bounding rects aren't important and can be discarded?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

points well taken! I've reversed the approach here.

const rect =
(item.lhId ? this._fullPageScreenshot.nodes[item.lhId] : null) || item.boundingRect;
if (!rect) return element;
const rect = item.lhId ? this._fullPageScreenshot.nodes[item.lhId] : item.boundingRect;
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm thinking the fallback of item.boundingRect doesn't make sense... should we remove?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why doesn't it make sense? It's not obvious to me what the issue is.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think the idea here was to show something in case the node doesn't show in _fullPageScreenshot.nodes, which could happen if LH registered an element but then it is deleted by the time the full page screenshot gatherer runs. So the user might get an idea of where the element was. Could that be more confusing than helpful?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think the idea here was to show something in case the node doesn't show in _fullPageScreenshot.nodes, which could happen if LH registered an element but then it is deleted by the time the full page screenshot gatherer runs. So the user might get an idea of where the element was. Could that be more confusing than helpful?

I think you're right. In theory if it's not in fullPageScreenshot.nodes, it didn't exist in the DOM anymore when the screenshot was taken, so what's the point in trying to show a spot where it wasn't in the screenshot? That could still be wrong (removed during the screenshot taking so not around when nodes are gathered?) but it seems better to miss a few corner case nodes that could have had a screenshot than to show confusing/misleading element screenshots.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see. In that case, I agree as well that it doesn't make sense.

@connorjclark connorjclark changed the title core(full-page-screenshot): do not collect zero size bounding rects core(full-page-screenshot): do not render zero size bounding rects Dec 21, 2020
@connorjclark connorjclark changed the title core(full-page-screenshot): do not render zero size bounding rects core(full-page-screenshot): do not render zero size rects Dec 29, 2020
@connorjclark connorjclark merged commit 6fa1b4a into master Dec 29, 2020
@connorjclark connorjclark deleted the bounding-rect-zero branch December 29, 2020 21:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants