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.

Sign up for GitHub

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

Jump to bottom

clientWidth may not force layout when style has changed #31195

Closed
Loirooriol opened this issue Jan 26, 2024 · 1 comment · Fixed by #31210 or #31219
Closed

clientWidth may not force layout when style has changed #31195

Loirooriol opened this issue Jan 26, 2024 · 1 comment · Fixed by #31210 or #31219
Labels
A-content/script Related to the script thread A-layout/2020 https://github.com/servo/servo/wiki/Layout-2020

Comments

@Loirooriol
Copy link
Contributor 

<!DOCTYPE html>
<div id="target"></div>
<div id="log" style="white-space: pre"></div>
<script>
target.style.cssText = "width: 5px";
log.append(target.clientWidth + "\n");

target.style.cssText = "width: 15px";
log.append(target.clientWidth + "\n");
</script>

Expected:

5
15

Actual:

5
5
@Loirooriol Loirooriol added the A-layout/2020 https://github.com/servo/servo/wiki/Layout-2020 label Jan 26, 2024
@Loirooriol Loirooriol mentioned this issue Jan 26, 2024
Merged
3 tasks
@gterzian
Copy link
Member

There appears to be some caching, which I guess should be invalidated in that case

servo/components/script/dom/element.rs

Line 3348 in 0916534

fn client_rect(&self) -> Rect<i32> {

A good place to investigate invalidated that cache is I think:

servo/components/script/dom/cssstyledeclaration.rs

Line 56 in 0916534

fn mutate_associated_block<F, R>(&self, f: F) -> R

@gterzian gterzian added the A-content/script Related to the script thread label Jan 29, 2024
Loirooriol added a commit to Loirooriol/servo that referenced this issue Jan 29, 2024
@Loirooriol
Don't use cached client_rect() when a reflow is needed
7e785aa 
Fixes servo#31195:

```js
element.style.width = "5px";
element.clientWidth; // 5
element.style.width = "15px";
element.clientWidth; // Was 5, now 15
```
@Loirooriol Loirooriol mentioned this issue Jan 29, 2024
Merged
4 tasks
Loirooriol added a commit to Loirooriol/servo that referenced this issue Jan 29, 2024
@Loirooriol
Don't use cached client_rect() when a reflow is needed
7adec45 
Fixes servo#31195:

```js
element.style.width = "5px";
element.clientWidth; // 5
element.style.width = "15px";
element.clientWidth; // Was 5, now 15
```
github-merge-queue bot pushed a commit that referenced this issue Jan 29, 2024
@Loirooriol
Don't use cached client_rect() when a reflow is needed (#31210)
38d9245 
Fixes #31195:

```js
element.style.width = "5px";
element.clientWidth; // 5
element.style.width = "15px";
element.clientWidth; // Was 5, now 15
```
@Loirooriol Loirooriol linked a pull request Jan 29, 2024 that will close this issue
Allow using cached client_rect() for paint-only reflow #31219
Merged
3 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
A-content/script Related to the script thread A-layout/2020 https://github.com/servo/servo/wiki/Layout-2020
Projects
None yet
Milestone
No milestone
2 participants
@gterzian @Loirooriol