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

Plot outputs incorrectly sized inside scaled outputs #4139

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

jcheng5
Copy link
Member

@jcheng5 jcheng5 commented Oct 1, 2024

Fixes #4135.

CSS zoom property affects el.getBoundingClientRect() but not el.offsetWidth/Height. When reporting sizes of outputs from client to server, we need to back out the CSS zoom because those sizes are used as CSS width/height, which will be affected by zoom.

(Note that something similar happens with CSS transforms but we don't have a good way to deal with them)

Safari doesn't support el.currentCSSZoom, but it also doesn't have the problem of el.getBoundingClientRect() and offset size not matching when zoom is applied. We're hoping that these two facts are not a coincidence and that any browser that treats those sizes as different also gives us el.currentCSSZoom.

getBoundingClientRect is also used in the coordmap for plots. @gadenbuie and I verified that coordmaps already work well even when zoom is applied. The coords_css uses el.getBoundingClientRect() without backing out the zoom; I'm convinced this is correct/how it has to be.

@jcheng5 jcheng5 requested a review from gadenbuie October 1, 2024 20:17
CSS zoom property affects el.getBoundingClientRect() but not
el.offsetWidth/Height. When reporting sizes of outputs from
client to server, we need to back out the CSS zoom because
those sizes are used as CSS width/height, which will be
affected by zoom.

(Note that something similar happens with CSS transforms but
we don't have a good way to deal with them)
Copy link
Member

@gadenbuie gadenbuie left a comment

Choose a reason for hiding this comment

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

LGTM! It seems that currentCSSZoom will be available when we update typescript to >= 5.5.2.

Comment on lines +152 to +153
// Cast to any because currentCSSZoom isn't in the type def of HTMLElement
const zoom = (el as any).currentCSSZoom || 1;
Copy link
Member

Choose a reason for hiding this comment

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

currentCSSZoom was added in typescript release 5.5.2 (here's the commit); worth adding a TODO and hope we catch this in the future.

Suggested change
// Cast to any because currentCSSZoom isn't in the type def of HTMLElement
const zoom = (el as any).currentCSSZoom || 1;
// Cast to any because currentCSSZoom isn't in the type def of HTMLElement
// TODO: typescript >= 5.5.2 added this property to the type definition
const zoom = (el as any).currentCSSZoom || 1;

@gadenbuie gadenbuie added this to the Next Release milestone Nov 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Plot outputs incorrectly sized inside scaled outputs
2 participants