Bug 1442817 - Introduce a function to observe synchronous restyling easily. r?birtles
In the subsequent patch, we want to observe animation restyles caused by
synchronous styling. If we used the original asynchronous observer for that,
we will observe restyles in normal scheduled styling, it's bit confusing.
MozReview-Commit-ID: 1V2IavKNECG
--- a/dom/animation/test/mozilla/file_restyles.html
+++ b/dom/animation/test/mozilla/file_restyles.html
@@ -47,38 +47,68 @@ div {
background-color: white;
}
</style>
</head>
<body>
<script>
'use strict';
-function observeStyling(frameCount, onFrame) {
- var docShell =
+function getDocShellForObservingRestyles() {
+ const docShell =
SpecialPowers.wrap(window)
.QueryInterface(SpecialPowers.Ci.nsIInterfaceRequestor)
.getInterface(SpecialPowers.Ci.nsIWebNavigation)
.QueryInterface(SpecialPowers.Ci.nsIDocShell);
docShell.recordProfileTimelineMarkers = true;
docShell.popProfileTimelineMarkers();
+ return docShell;
+}
+
+// Returns the animation restyle markers observed during |frameCount| refresh
+// driver ticks. This function is typically used to count the number of
+// restyles that take place as part of the style update that happens on each
+// refresh driver tick, as opposed to synchronous restyles triggered by script.
+//
+// For the latter observeAnimSyncStyling (below) should be used.
+function observeStyling(frameCount, onFrame) {
+ let docShell = getDocShellForObservingRestyles();
+
return new Promise(resolve => {
return waitForAnimationFrames(frameCount, onFrame).then(() => {
var markers = docShell.popProfileTimelineMarkers();
docShell.recordProfileTimelineMarkers = false;
var stylingMarkers = markers.filter((marker, index) => {
return marker.name == 'Styles' && marker.isAnimationOnly;
});
resolve(stylingMarkers);
});
});
}
+// Returns observed animation restyle markers when |funcToMakeRestyleHappen|
+// is called.
+// NOTE: This function is synchronous version of the above observeStyling().
+// Unlike the above observeStyling, this function takes a callback function,
+// |funcToMakeRestyleHappen|, which may be expected to trigger a synchronous
+// restyles, and returns any restyle markers produced by calling that function.
+function observeAnimSyncStyling(funcToMakeRestyleHappen) {
+ let docShell = getDocShellForObservingRestyles();
+
+ funcToMakeRestyleHappen();
+
+ let markers = docShell.popProfileTimelineMarkers();
+ docShell.recordProfileTimelineMarkers = false;
+ return markers.filter((marker, index) => {
+ return marker.name == 'Styles' && marker.isAnimationOnly;
+ });
+}
+
function ensureElementRemoval(aElement) {
return new Promise(resolve => {
aElement.remove();
waitForAllPaintsFlushed(resolve);
});
}
function waitForWheelEvent(aTarget) {