Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-23 02:05:42 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1434376 - Switch over all uses of BrowserUtils.promiseLayoutFlushed to window.promiseDocumentFlushed. r=Paolo

Browse Source 
window.promiseDocumentFlushed will call a callback as soon as a style or layout
flush is not required for the document (which might be immediately). This is a
new ChromeOnly API introduced in an earlier patch in this series.

This patch also removes the now-unneeded BrowserUtils.promiseLayoutFlushed and
BrowserUtils.promiseReflowed methods and infrastructure.

MozReview-Commit-ID: Jv7KoxBXhHG

--HG--
extra : rebase_source : cae6a58d3992b2e587b1fff90954f36c2f81e2ee
This commit is contained in:
Mike Conley 2018-02-11 20:15:11 -05:00
parent 46e89021f1
commit 2b1d67d232
5 changed files with 13 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
browser/base/content/tabbrowser.xml
View File

@ -283,7 +283,7 @@
<parameter name="aTab"/>
<body>
<![CDATA[
BrowserUtils.promiseLayoutFlushed(aTab.ownerDocument, "style", () => {
aTab.ownerGlobal.promiseDocumentFlushed(() => {
if (!aTab.parentNode) {
return;
}

9
browser/components/customizableui/CustomizeMode.jsm
View File

@ -569,11 +569,7 @@ CustomizeMode.prototype = {
}
// Wait until the next frame before setting the class to ensure
// we do start the animation. We cannot use promiseLayoutFlushed
// here because callback is only invoked when any actual reflow
// happens, while that may not happen soonish enough. If we have
// an observer for style flush, we may be able to replace the
// nested rAFs with that.
// we do start the animation.
this.window.requestAnimationFrame(() => {
this.window.requestAnimationFrame(() => {
animationNode.classList.add("animate-out");
@ -2421,7 +2417,8 @@ CustomizeMode.prototype = {
panelOnTheLeft = true;
}
} else {
await BrowserUtils.promiseLayoutFlushed(doc, "display", () => {});
await this.window.promiseDocumentFlushed(() => {});
if (!this._customizing || !this._wantToBeInCustomizeMode) {
return;
}

12
browser/components/customizableui/PanelMultiView.jsm
View File

@ -495,8 +495,8 @@ this.PanelMultiView = class extends this.AssociatedToNode {
// binding for the <panelmultiview> element may still be disconnected.
// In this case, give the layout code a chance to run.
if (!this.connected) {
await BrowserUtils.promiseLayoutFlushed(this.document, "layout",
() => {});
await this.window.promiseDocumentFlushed(() => {});
// The XBL binding must be connected at this point. If this is not the
// case, the calling code should be updated to unhide the panel.
if (!this.connected) {
@ -788,7 +788,7 @@ this.PanelMultiView = class extends this.AssociatedToNode {
return;
}
const {window, document} = this;
const { window } = this;
let nextPanelView = PanelView.forNode(viewNode);
let prevPanelView = PanelView.forNode(previousViewNode);
@ -847,7 +847,7 @@ this.PanelMultiView = class extends this.AssociatedToNode {
// description elements it contains.
nextPanelView.descriptionHeightWorkaround();
viewRect = await BrowserUtils.promiseLayoutFlushed(this.document, "layout", () => {
viewRect = await window.promiseDocumentFlushed(() => {
return this._dwu.getBoundsWithoutFlushing(viewNode);
});
@ -894,7 +894,7 @@ this.PanelMultiView = class extends this.AssociatedToNode {
// sliding animation with smaller views.
viewNode.style.width = viewRect.width + "px";
await BrowserUtils.promiseLayoutFlushed(document, "layout", () => {});
await window.promiseDocumentFlushed(() => {});
// Kick off the transition!
details.phase = TRANSITION_PHASES.TRANSITION;
@ -1000,7 +1000,7 @@ this.PanelMultiView = class extends this.AssociatedToNode {
// We force 'display: none' on the previous view node to make sure that it
// doesn't cause an annoying flicker whilst resetting the styles above.
previousViewNode.style.display = "none";
await BrowserUtils.promiseLayoutFlushed(this.document, "layout", () => {});
await this.window.promiseDocumentFlushed(() => {});
previousViewNode.style.removeProperty("display");
}
}

6
browser/components/places/content/browserPlacesViews.js
View File

@ -1608,10 +1608,8 @@ PlacesToolbar.prototype = {
notify: function PT_notify(aTimer) {
if (aTimer == this._updateNodesVisibilityTimer) {
this._updateNodesVisibilityTimer = null;
// TODO: This should use promiseLayoutFlushed("layout"), so that
// _updateNodesVisibilityTimerCallback can use getBoundsWithoutFlush. But
// for yet unknown reasons doing that causes intermittent failures,
// apparently due the flush not happening in a meaningful time.
// Bug 1440070: This should use promiseDocumentFlushed, so that
// _updateNodesVisibilityTimerCallback can use getBoundsWithoutFlush.
window.requestAnimationFrame(this._updateNodesVisibilityTimerCallback.bind(this));
} else if (aTimer == this._ibTimer) {
// * Timer to turn off indicator bar.

104
toolkit/modules/BrowserUtils.jsm
View File

@ -14,48 +14,6 @@ ChromeUtils.defineModuleGetter(this, "PlacesUtils",
Cu.importGlobalProperties(["URL"]);
let reflowObservers = new WeakMap();
function ReflowObserver(doc) {
this._doc = doc;
doc.docShell.addWeakReflowObserver(this);
reflowObservers.set(this._doc, this);
this.callbacks = [];
}
ReflowObserver.prototype = {
QueryInterface: XPCOMUtils.generateQI(["nsIReflowObserver", "nsISupportsWeakReference"]),
_onReflow() {
reflowObservers.delete(this._doc);
this._doc.docShell.removeWeakReflowObserver(this);
for (let callback of this.callbacks) {
try {
callback();
} catch (e) {
Cu.reportError(e);
}
}
},
reflow() {
this._onReflow();
},
reflowInterruptible() {
this._onReflow();
},
};
const FLUSH_TYPES = {
"style": Ci.nsIDOMWindowUtils.FLUSH_STYLE,
"layout": Ci.nsIDOMWindowUtils.FLUSH_LAYOUT,
"display": Ci.nsIDOMWindowUtils.FLUSH_DISPLAY,
};
this.BrowserUtils = {
/**
@ -428,8 +386,7 @@ this.BrowserUtils = {
}
let bounds = dwu.getBoundsWithoutFlushing(toolbarItem);
if (!bounds.height) {
let document = element.ownerDocument;
await BrowserUtils.promiseLayoutFlushed(document, "layout", () => {
await window.promiseDocumentFlushed(() => {
bounds = dwu.getBoundsWithoutFlushing(toolbarItem);
});
}
@ -687,65 +644,6 @@ this.BrowserUtils = {
return [url, postData];
},
/**
* Calls the given function when the given document has just reflowed,
* and returns a promise which resolves to its return value after it
* has been called.
*
* The function *must not trigger any reflows*, or make any changes
* which would require a layout flush.
*
* @param {Document} doc
* @param {function} callback
* @returns {Promise}
*/
promiseReflowed(doc, callback) {
let observer = reflowObservers.get(doc);
if (!observer) {
observer = new ReflowObserver(doc);
reflowObservers.set(doc, observer);
}
return new Promise((resolve, reject) => {
observer.callbacks.push(() => {
try {
resolve(callback());
} catch (e) {
reject(e);
}
});
});
},
/**
* Calls the given function as soon as a layout flush of the given
* type is not necessary, and returns a promise which resolves to the
* callback's return value after it executes.
*
* The function *must not trigger any reflows*, or make any changes
* which would require a layout flush.
*
* @param {Document} doc
* @param {string} flushType
* The flush type required. Must be one of:
*
* - "style"
* - "layout"
* - "display"
* @param {function} callback
* @returns {Promise}
*/
async promiseLayoutFlushed(doc, flushType, callback) {
let utils = doc.defaultView.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIDOMWindowUtils);
if (!utils.needsFlush(FLUSH_TYPES[flushType])) {
return callback();
}
return this.promiseReflowed(doc, callback);
},
/**
* Generate a document fragment for a localized string that has DOM
* node replacements. This avoids using getFormattedString followed