Bug 1599606 - Don't interleave a non-scrolled canvas background color item and a fixed canvas background image with a scrolled background-color item. r=mattwoodrow

Differential Revision: https://phabricator.services.mozilla.com/D54855

--HG--
extra : moz-landing-system : lando

layout/generic/nsCanvasFrame.cpp

@@ -485,8 +485,6 @@ void nsCanvasFrame::BuildDisplayList(nsDisplayListBuilder* aBuilder,
         dependentFrame = nullptr;
       }
     }
-    aLists.BorderBackground()->AppendNewToTop<nsDisplayCanvasBackgroundColor>(
-        aBuilder, this);
 
     if (isThemed) {
       aLists.BorderBackground()
@@ -498,13 +496,27 @@ void nsCanvasFrame::BuildDisplayList(nsDisplayListBuilder* aBuilder,
       return;
     }
 
+    const nsStyleImageLayers& layers = bg->StyleBackground()->mImage;
+    if (layers.mImageCount == 0 ||
+        layers.mLayers[0].mAttachment != StyleImageLayerAttachment::Fixed) {
+      // Put a scrolled background color item in place. The color of this item
+      // will be filled in during PresShell::AddCanvasBackgroundColorItem.
+      // Do not add this item if there's a fixed background image at the bottom;
+      // in that case, it's better to allow the fixed background image to
+      // combine itself with a non-scrolled background color directly
+      // underneath, rather than interleaving the two with a scrolled background
+      // color. PresShell::AddCanvasBackgroundColorItem makes sure there always
+      // is a non-scrolled background color item at the bottom.
+      aLists.BorderBackground()->AppendNewToTop<nsDisplayCanvasBackgroundColor>(
+          aBuilder, this);
+    }
+
     const ActiveScrolledRoot* asr = aBuilder->CurrentActiveScrolledRoot();
 
     bool needBlendContainer = false;
     nsDisplayListBuilder::AutoContainerASRTracker contASRTracker(aBuilder);
 
     // Create separate items for each background layer.
-    const nsStyleImageLayers& layers = bg->StyleBackground()->mImage;
     NS_FOR_VISIBLE_IMAGE_LAYERS_BACK_TO_FRONT(i, layers) {
       if (layers.mLayers[i].mImage.IsEmpty()) {
         continue;