[SPv175+] Update some layout tests

- paint/invalidation/flexbox/repaint-opacity-change-expected.html
  Previously this test changed opacity from 1 to 0.5 then to 1 in the
  same document cycle and expected full invalidation which didn't
  happen for SPv175+ because there was no actual opacity change. Now
  let the test change opacity from 0.5 to 1.

- paint/invalidation/invalidate-descendants-when-receiving-paint-layer.html
  Previously there was no visual change, and no raster invalidation
  in SPv175+. Now give the objects background to make them visible.

- paint/invalidation/media-audio-no-spurious-repaints.html
  The previous script detecting raster invalidation on VIDEO didn't work
  for SPv175+ because the VIDEO object itself paints nothing. Now detect
  raster invalidation of the thumb.

Also rebaselined several tests with different but valid result for SPv175.

Bug: 771643
Cq-Include-Trybots: master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2
Change-Id: Ic7d4e89d6308086861f905d97598f8a2077c8fd0
Reviewed-on: https://chromium-review.googlesource.com/760671Reviewed-by: Tien-Ren Chen <trchen@chromium.org>
Commit-Queue: Xianzhu Wang <wangxianzhu@chromium.org>
Cr-Commit-Position: refs/heads/master@{#515393}

third_party/WebKit/LayoutTests/FlagExpectations/enable-slimming-paint-v2

@@ -887,10 +887,8 @@ Bug(none) fast/multicol/input-with-overflow-second-column.html [ Failure ]
 Bug(none) paint/invalidation/compositing/should-invoke-deferred-compositing.html [ Failure ]
 Bug(none) paint/invalidation/css-grid-layout/grid-item-z-index-change-repaint.html [ Failure ]
 Bug(none) paint/invalidation/dont-invalidate-root-layer-when-composited-layer-becomes-visible.html [ Failure ]
-Bug(none) paint/invalidation/flexbox/repaint-opacity-change.html [ Failure ]
 Bug(none) paint/invalidation/invalidate-paint-in-iframe-in-composited-layer.html [ Failure ]
 Bug(none) paint/invalidation/japanese-rl-selection-clear.html [ Failure ]
-Bug(none) paint/invalidation/media-audio-no-spurious-repaints.html [ Failure ]
 Bug(none) paint/invalidation/overflow-changed-on-child-of-composited-layer.html [ Failure ]
 Bug(none) paint/invalidation/overflow-hidden-yet-scrolled-with-custom-scrollbar.html [ Failure ]
 Bug(none) paint/invalidation/overflow-hidden-yet-scrolled.html [ Failure ]

third_party/WebKit/LayoutTests/flag-specific/enable-slimming-paint-v175/paint/invalidation/flexbox/repaint-opacity-change-expected.txt

+{
+  "layers": [
+    {
+      "name": "LayoutView #document",
+      "bounds": [800, 600],
+      "contentsOpaque": true,
+      "backgroundColor": "#FFFFFF",
+      "paintInvalidations": [
+        {
+          "object": "LayoutBlockFlow DIV id='target' class='item'",
+          "rect": [18, 18, 764, 20],
+          "reason": "disappeared"
+        },
+        {
+          "object": "LayoutBlockFlow HTML",
+          "rect": [18, 18, 764, 20],
+          "reason": "appeared"
+        }
+      ]
+    }
+  ],
+  "objectPaintInvalidations": [
+    {
+      "object": "LayoutBlockFlow DIV id='target' class='item'",
+      "reason": "style change"
+    }
+  ]
+}
+

third_party/WebKit/LayoutTests/flag-specific/enable-slimming-paint-v175/paint/invalidation/invalidate-descendants-when-receiving-paint-layer-expected.txt

+{
+  "layers": [
+    {
+      "name": "LayoutView #document",
+      "bounds": [800, 600],
+      "contentsOpaque": true,
+      "backgroundColor": "#FFFFFF"
+    },
+    {
+      "name": "LayoutBlockFlow (positioned) DIV",
+      "position": [8, 8],
+      "contentsOpaque": true,
+      "drawsContent": false
+    },
+    {
+      "name": "Squashing Containment Layer",
+      "drawsContent": false
+    },
+    {
+      "name": "LayoutBlockFlow (relative positioned) DIV",
+      "position": [8, 8],
+      "bounds": [784, 52],
+      "paintInvalidations": [
+        {
+          "object": "LayoutBlockFlow DIV id='child'",
+          "rect": [1, 1, 100, 51],
+          "reason": "disappeared"
+        }
+      ]
+    },
+    {
+      "name": "Squashing Layer (first squashed layer: LayoutBlockFlow DIV id='target')",
+      "position": [9, 9],
+      "bounds": [100, 100]
+    }
+  ],
+  "objectPaintInvalidations": [
+    {
+      "object": "LayoutBlockFlow DIV id='target'",
+      "reason": "style change"
+    },
+    {
+      "object": "LayoutBlockFlow DIV id='child'",
+      "reason": "style change"
+    }
+  ]
+}
+

third_party/WebKit/LayoutTests/flag-specific/enable-slimming-paint-v175/paint/invalidation/layout-state-only-positioned-expected.txt

+{
+  "layers": [
+    {
+      "name": "LayoutView #document",
+      "bounds": [800, 600],
+      "contentsOpaque": true,
+      "backgroundColor": "#FFFFFF",
+      "paintInvalidations": [
+        {
+          "object": "LayoutBlockFlow (positioned) DIV",
+          "rect": [0, 50, 106, 106],
+          "reason": "paint property change"
+        },
+        {
+          "object": "LayoutBlockFlow (positioned) DIV",
+          "rect": [88, 53, 15, 100],
+          "reason": "appeared"
+        }
+      ]
+    }
+  ],
+  "objectPaintInvalidations": [
+    {
+      "object": "LayoutBlockFlow (positioned) DIV",
+      "reason": "geometry"
+    },
+    {
+      "object": "LayoutBlockFlow (positioned) DIV",
+      "reason": "geometry"
+    },
+    {
+      "object": "VerticalScrollbar",
+      "reason": "scroll control"
+    },
+    {
+      "object": "LayoutBlockFlow (positioned) DIV id='q'",
+      "reason": "geometry"
+    }
+  ]
+}
+

third_party/WebKit/LayoutTests/flag-specific/enable-slimming-paint-v2/paint/invalidation/flexbox/repaint-opacity-change-expected.txt

+{
+  "layers": [
+    {
+      "name": "LayoutView #document",
+      "bounds": [800, 600],
+      "contentsOpaque": true,
+      "backgroundColor": "#FFFFFF",
+      "paintInvalidations": [
+        {
+          "object": "LayoutBlockFlow DIV id='target' class='item'",
+          "rect": [18, 18, 764, 20],
+          "reason": "disappeared"
+        },
+        {
+          "object": "LayoutBlockFlow HTML",
+          "rect": [18, 18, 764, 20],
+          "reason": "appeared"
+        }
+      ]
+    }
+  ],
+  "objectPaintInvalidations": [
+    {
+      "object": "LayoutBlockFlow DIV id='target' class='item'",
+      "reason": "style change"
+    }
+  ]
+}
+

third_party/WebKit/LayoutTests/flag-specific/enable-slimming-paint-v2/paint/invalidation/layout-state-only-positioned-expected.txt

+{
+  "layers": [
+    {
+      "name": "LayoutView #document",
+      "bounds": [800, 600],
+      "contentsOpaque": true,
+      "backgroundColor": "#FFFFFF",
+      "paintInvalidations": [
+        {
+          "object": "LayoutBlockFlow (positioned) DIV",
+          "rect": [0, 50, 106, 106],
+          "reason": "paint property change"
+        }
+      ]
+    },
+    {
+      "name": "LayoutBlockFlow (positioned) DIV",
+      "position": [88, 3],
+      "bounds": [15, 100],
+      "transform": 1
+    }
+  ],
+  "transforms": [
+    {
+      "id": 1,
+      "transform": [
+        [1, 0, 0, 0],
+        [0, 1, 0, 0],
+        [0, 0, 1, 0],
+        [0, 50, 0, 1]
+      ]
+    }
+  ],
+  "objectPaintInvalidations": [
+    {
+      "object": "LayoutBlockFlow (positioned) DIV",
+      "reason": "geometry"
+    },
+    {
+      "object": "LayoutBlockFlow (positioned) DIV",
+      "reason": "geometry"
+    },
+    {
+      "object": "VerticalScrollbar",
+      "reason": "scroll control"
+    },
+    {
+      "object": "LayoutBlockFlow (positioned) DIV id='q'",
+      "reason": "geometry"
+    }
+  ]
+}
+

third_party/WebKit/LayoutTests/paint/invalidation/flexbox/repaint-opacity-change-expected.html

 <!DOCTYPE html>
-<html>
-<head>
 <style>
 .item {
   margin: 10px;
+  margin-top: 20px;
   padding: 10px;
-  opacity: 1;
-}
-.flex {
-  display: flex;
-  flex-direction: column;
-}
+  background: green;
 </style>
-</head>
-<body>
-<div class="flex">
-    <div class="item" id="target"></div>
-    <div class="item"></div>
-</div>
+<div class="item" style="margin-top: 18px"></div>
+<div class="item" style="opacity: 0.5; margin-top: 20px"></div>
 </body>

third_party/WebKit/LayoutTests/paint/invalidation/flexbox/repaint-opacity-change-expected.txt

@@ -24,10 +24,6 @@
       "object": "LayoutBlockFlow DIV id='target' class='item'",
       "reason": "subtree"
     },
-    {
-      "object": "LayoutBlockFlow DIV id='target' class='item'",
-      "reason": "subtree"
-    },
     {
       "object": "LayoutBlockFlow DIV id='target' class='item'",
       "reason": "subtree"

third_party/WebKit/LayoutTests/paint/invalidation/flexbox/repaint-opacity-change.html

 <!DOCTYPE html>
-<html>
-<head>
-<script src="../resources/text-based-repaint.js" type="text/javascript"></script>
+<script src="../resources/text-based-repaint.js"></script>
 <script>
-function repaintTest()
-{
-  if (window.testRunner) {
-    var targetElement = document.getElementById('target');
-    targetElement.style.opacity = '0.5';
-    document.body.offsetTop;
-    targetElement.style.opacity = '1';
-    document.body.offsetTop;
-  }
+function repaintTest() {
+  target.style.opacity = '1';
 }
+onload = runRepaintAndPixelTest;
 </script>
 <style>
 .item {
   margin: 10px;
   padding: 10px;
-  opacity: 1;
+  opacity: 0.5;
+  background: green;
 }
 .flex {
   display: flex;
   flex-direction: column;
 }
 </style>
-</head>
-<body onload="runRepaintAndPixelTest()">
 <div class="flex">
     <div class="item" id="target"></div>
     <div class="item"></div>
 </div>
-</body>

third_party/WebKit/LayoutTests/paint/invalidation/invalidate-descendants-when-receiving-paint-layer-expected.html

 <!DOCTYPE html>
-<div style="position: relative; border: 1px solid black;">  
-  <div id="target" style="opacity: 0.2; height: 50px; width: 50px;">
-    <div id="child" style="width: 100px; height: 100px"></div>
-  </div>
+<div style="border: 1px solid black; height: 50px">
+  <div style="width: 100px; height: 100px; background: black; opacity: 0.2; will-change: transform"></div>
 </div>

third_party/WebKit/LayoutTests/paint/invalidation/invalidate-descendants-when-receiving-paint-layer.html

@@ -10,8 +10,8 @@ onload = runRepaintAndPixelTest;
 and the descendants of the sublayer changes paint invalidation container. Passes if we invalidate
 the descendants of the layer on the squashing layer.-->
 <div style="will-change: transform; position: fixed"></div>
-<div style="position: relative; border: 1px solid black;">  
-  <div id="target" style="opacity: 1; height: 50px; width: 50px;">
-    <div id="child" style="width: 100px; height: 100px"></div>
+<div style="position: relative; border: 1px solid black;">
+  <div id="target" style="opacity: 1; height: 50px; width: 50px; background: red">
+    <div id="child" style="width: 100px; height: 100px; background: black"></div>
   </div>
 </div>

third_party/WebKit/LayoutTests/paint/invalidation/media-audio-no-spurious-repaints.html

@@ -2,9 +2,12 @@
 <title>Verifies there are no spurious repaints for audio in a video tag.</title>
 <script src="../../resources/testharness.js"></script>
 <script src="../../resources/testharnessreport.js"></script>
-<video></video>
+<video controls></video>
 <script>
 async_test(function(t) {
+    if (!window.internals)
+        return;
+
     var video = document.querySelector('video');
 
     video.addEventListener('canplaythrough', t.step_func(function() {
@@ -21,20 +24,21 @@ async_test(function(t) {
         // Manually verify the number of repaints instead of using a repaint
         // test since media playback is asynchronous by nature and its threading
         // will cause a variance in the number of repaints on test bots.
-        var minExpected = 5, maxExpected = 8, expectedRect = [8, 8, 300, 150];
+        var minExpected = 5, maxExpected = 15, actual = 0;
 
         t.add_cleanup(function() {
             if (t.status == t.PASS)
                 return;
-            console.log('FAIL! An unexpected number of repaints occurred;' +
-                        ' expected ' + minExpected + ' to ' + maxExpected +
-                        ' with rects of [' + expectedRect.join(', ') + '].' +
-                        ' Actual layer tree: ' + layerTree);
+            console.log('FAIL! An unexpected number of repaints occurred for the thumb;' +
+                        ' expected ' + minExpected + ' to ' + maxExpected + '; actual ' + actual +
+                        '. Actual layer tree: ' + layerTree);
         });
 
-        assert_between_inclusive(paintInvalidations.length, minExpected, maxExpected);
-        for (var i = 0; i < paintInvalidations.length; ++i)
-            assert_array_equals(paintInvalidations[i].rect, expectedRect);
+        for (var i = 0; i < paintInvalidations.length; ++i) {
+            if (paintInvalidations[i].object.includes('thumb'))
+                actual++;
+        }
+        assert_between_inclusive(actual, minExpected, maxExpected);
 
         t.done();
     }), false);