Bug 1441154 - Start the PanelMultiview sliding transition together with the height transition. r=Gijs
This fixes an issue where the two transition are not simultaneous.
MozReview-Commit-ID: 8JKunQV3MDI
--- a/browser/components/customizableui/PanelMultiView.jsm
+++ b/browser/components/customizableui/PanelMultiView.jsm
@@ -937,28 +937,28 @@ var PanelMultiView = class extends this.
// Somehow, putting these properties in PanelUI.css doesn't work for newly
// shown nodes in a XUL parent node.
this._viewStack.style.transition = "transform var(--animation-easing-function)" +
" var(--panelui-subview-transition-duration)";
this._viewStack.style.willChange = "transform";
// Use an outline instead of a border so that the size is not affected.
deepestNode.style.outline = "1px solid var(--panel-separator-color)";
+ await window.promiseDocumentFlushed(() => {});
+
// Now set the viewContainer dimensions to that of the new view, which
// kicks of the height animation.
this._viewContainer.style.height = viewRect.height + "px";
this._viewContainer.style.width = viewRect.width + "px";
this._panel.removeAttribute("width");
this._panel.removeAttribute("height");
// We're setting the width property to prevent flickering during the
// sliding animation with smaller views.
viewNode.style.width = viewRect.width + "px";
- await window.promiseDocumentFlushed(() => {});
-
// For proper bookkeeping, mark the view that is about to scrolled out of
// the visible area as inactive, because it won't be possible to simulate
// mouse events on it properly. In practice this isn't important, because we
// use the separate "transitioning" attribute on the panel to suppress
// pointer events. This allows mouse events to be available for the main
// view in regression tests that wait for the "popupshown" event.
prevPanelView.active = false;