Skip to content

fix(cdk/overlay): sub-pixel deviations throwing off positioning in some cases - #21427

Merged
mmalerba merged 1 commit into
angular:masterfrom
crisbeto:21350/zoomed-in-overlay
Jan 15, 2021
Merged

fix(cdk/overlay): sub-pixel deviations throwing off positioning in some cases#21427
mmalerba merged 1 commit into
angular:masterfrom
crisbeto:21350/zoomed-in-overlay

Conversation

@crisbeto

Copy link
Copy Markdown
Member

If the browser is zoomed in beyond the default level, it may report numbers with sub-pixel deviations to getBoundingClientRect (e.g. 100.09 vs 100) which can throw off our logic when comparing against the viewport size which is always a whole number.

These changes fix the issue by rounding down the numbers that we get from getBoundingClientRect.

Fixes #21350.

@crisbeto crisbeto added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent target: patch This PR is targeted for the next patch release labels Dec 23, 2020
@crisbeto
crisbeto requested a review from jelbourn as a code owner December 23, 2020 11:07
@google-cla google-cla Bot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Dec 23, 2020
@crisbeto
crisbeto force-pushed the 21350/zoomed-in-overlay branch 2 times, most recently from 743c39f to 13c7e47 Compare December 23, 2020 11:33
…me cases

If the browser is zoomed in beyond the default level, it may report numbers with
sub-pixel deviations to `getBoundingClientRect` (e.g. 100.09 vs 100) which can throw off
our logic when comparing against the viewport size which is always a whole number.

These changes fix the issue by rounding down the numbers that we get from `getBoundingClientRect`.

Fixes angular#21350.
@crisbeto
crisbeto force-pushed the 21350/zoomed-in-overlay branch from 13c7e47 to 19b9b4c Compare December 23, 2020 11:36

@jelbourn jelbourn left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM

* deviations in the `ClientRect` returned by the browser (e.g. when zoomed in with a percentage
* size, see #21350).
*/
function getRoundedBoundingClientRect(clientRect: ClientRect): ClientRect {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

It just rolls right off the tongue

@jelbourn jelbourn added the action: merge The PR is ready for merge by the caretaker label Jan 5, 2021
@mmalerba
mmalerba merged commit 0c8cfa7 into angular:master Jan 15, 2021
mmalerba pushed a commit that referenced this pull request Jan 15, 2021
…me cases (#21427)

If the browser is zoomed in beyond the default level, it may report numbers with
sub-pixel deviations to `getBoundingClientRect` (e.g. 100.09 vs 100) which can throw off
our logic when comparing against the viewport size which is always a whole number.

These changes fix the issue by rounding down the numbers that we get from `getBoundingClientRect`.

Fixes #21350.

(cherry picked from commit 0c8cfa7)
mmalerba pushed a commit that referenced this pull request Jan 15, 2021
…me cases (#21427)

If the browser is zoomed in beyond the default level, it may report numbers with
sub-pixel deviations to `getBoundingClientRect` (e.g. 100.09 vs 100) which can throw off
our logic when comparing against the viewport size which is always a whole number.

These changes fix the issue by rounding down the numbers that we get from `getBoundingClientRect`.

Fixes #21350.

(cherry picked from commit 0c8cfa7)
@angular-automatic-lock-bot

Copy link
Copy Markdown

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot Bot locked and limited conversation to collaborators Feb 15, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent target: patch This PR is targeted for the next patch release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug(CdkOverlay): CdkOverlay incorrectly calculates viewport bounds

3 participants