third_party/WebKit/LayoutTests/compositing/squashing/squash-above-fixed-3-expected.txt

   1 This scenario verifies that the green "container" element and lime "innerScrolling" element scroll properly even though there is a blue fixed-position element layered in between them.
   2
   3 The catch is that the squashing requirements should be computed in correct paint order, so that the green container does not accidentally position itself with respect to the wrong layer and not scroll.
   4
   5 CASE 1, original layer tree:
   6 {
   7   "bounds": [785, 4100],
   8   "children": [
   9     {
  10       "bounds": [785, 4100],
  11       "contentsOpaque": true,
  12       "drawsContent": true,
  13       "children": [
  14         {
  15           "bounds": [400, 400],
  16           "contentsOpaque": true,
  17           "drawsContent": true,
  18           "backgroundColor": "#808080"
  19         },
  20         {
  21           "position": [100, 100],
  22           "bounds": [100, 4000],
  23           "contentsOpaque": true,
  24           "drawsContent": true,
  25           "backgroundColor": "#008000",
  26           "children": [
  27             {
  28               "position": [0, 50],
  29               "bounds": [200, 100],
  30               "contentsOpaque": true,
  31               "drawsContent": true,
  32               "backgroundColor": "#0000FF"
  33             },
  34             {
  35               "position": [100, 0],
  36               "bounds": [100, 100],
  37               "contentsOpaque": true,
  38               "drawsContent": true,
  39               "backgroundColor": "#00FF00"
  40             }
  41           ]
  42         }
  43       ]
  44     }
  45   ]
  46 }
  47 CASE 2, scrolling y by 10 pixels, both the "container" and "inner" should scroll properly.
  48 {
  49   "bounds": [785, 4100],
  50   "children": [
  51     {
  52       "bounds": [785, 4100],
  53       "contentsOpaque": true,
  54       "drawsContent": true,
  55       "children": [
  56         {
  57           "position": [0, 10],
  58           "bounds": [400, 400],
  59           "contentsOpaque": true,
  60           "drawsContent": true,
  61           "backgroundColor": "#808080"
  62         },
  63         {
  64           "position": [100, 100],
  65           "bounds": [100, 4000],
  66           "contentsOpaque": true,
  67           "drawsContent": true,
  68           "backgroundColor": "#008000",
  69           "children": [
  70             {
  71               "position": [0, 60],
  72               "bounds": [200, 100],
  73               "contentsOpaque": true,
  74               "drawsContent": true,
  75               "backgroundColor": "#0000FF"
  76             },
  77             {
  78               "position": [100, 0],
  79               "bounds": [100, 100],
  80               "contentsOpaque": true,
  81               "drawsContent": true,
  82               "backgroundColor": "#00FF00"
  83             }
  84           ]
  85         }
  86       ]
  87     }
  88   ]
  89 }
  90 CASE 3, scrolling y further so that "inner" no longer overlaps the fixed-pos layer, then the stacking context of "container" includes the "innerScrolling" layer, and doubles in width:
  91 {
  92   "bounds": [785, 4100],
  93   "children": [
  94     {
  95       "bounds": [785, 4100],
  96       "contentsOpaque": true,
  97       "drawsContent": true,
  98       "children": [
  99         {
 100           "position": [0, 110],
 101           "bounds": [400, 400],
 102           "contentsOpaque": true,
 103           "drawsContent": true,
 104           "backgroundColor": "#808080"
 105         },
 106         {
 107           "position": [100, 100],
 108           "bounds": [200, 4000],
 109           "drawsContent": true,
 110           "backgroundColor": "#008000",
 111           "repaintRects": [
 112             [100, 0, 100, 100]
 113           ],
 114           "children": [
 115             {
 116               "position": [0, 160],
 117               "bounds": [200, 100],
 118               "contentsOpaque": true,
 119               "drawsContent": true,
 120               "backgroundColor": "#0000FF"
 121             }
 122           ]
 123         }
 124       ]
 125     }
 126   ]
 127 }
 128