Skip to content

Conversation

ugur-vaadin
Copy link
Contributor

Description

Under some conditions, the dimension updates for the details are not completed when the new layout mode is determined. This PR wraps the call in queueMicrotask in order to defer it until all the dimensions are updated.

Fixes #8969

Type of change

  • Bugfix
  • Feature

Checklist

  • I have read the contribution guide: https://vaadin.com/docs/latest/contributing/pr
  • I have added a description following the guideline.
  • The issue is created in the corresponding repository and I have referenced it.
  • I have added tests to ensure my change is effective and works as intended.
  • New and existing tests are passing locally with my change.
  • I have performed self-review and corrected misspellings.

@@ -524,7 +524,7 @@ class MasterDetailLayout extends SlotStylesMixin(ResizeMixin(ElementMixin(Themab
*/
async _finishTransition() {
// Detect new layout mode after DOM has been updated
this.__detectLayoutMode();
queueMicrotask(() => this.__detectLayoutMode());
Copy link
Contributor

Choose a reason for hiding this comment

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

The delay is a bit concerning, as the promise resolved below triggers the view transition to start, at which point we want the attributes set by __detectLayoutMode to be present. However the timing seems to work out at the moment in both Chrome and Safari, so I'm fine with it. Might be of interest in case view transitions stop working properly at some point.

Copy link

sonarqubecloud bot commented Aug 6, 2025

Copy link
Contributor

@sissbruecker sissbruecker left a comment

Choose a reason for hiding this comment

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

Let's also cherry pick this to 24.8

@ugur-vaadin ugur-vaadin merged commit 9f70cc5 into main Aug 6, 2025
9 checks passed
@ugur-vaadin ugur-vaadin deleted the fix-defer-detect-layout-mode-until-updates-are-done branch August 6, 2025 08:06
vaadin-bot pushed a commit that referenced this pull request Aug 6, 2025
* fix: defer detect layout mode until updates are done

* chore: add comment on why the calculation is deferred

* test: specify litelement in test name
web-padawan pushed a commit that referenced this pull request Aug 6, 2025
Co-authored-by: Ugur Saglam <106508695+ugur-vaadin@users.noreply.github.com>
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.

[master-detail-layout] Overlay mode isn't triggered on first render
3 participants