# This tests a clip chain (clipid=6) that is composed of two clips (clipid=3
# and clipid=4) with a parent clip chain (composed of two more clips (clipid=1
# and clipid=2). This effectively  tests a "complex" clip chain that includes
# and is applied to multiple non-hierarchical reference frames as well as
# having a similarly complicated parent. Each clip is a rounded corner which,
# when rotated, clips a box with all corners rounded.
root:
  items:
    -
      bounds: [0, 0, 200, 200]
      type: stacking-context
      transform: rotate(180)
      items:
       - type: clip
         id: 10
         bounds: [0, 0, 200, 200]
         complex:
           - rect: [0, 0, 200, 200]
             radius: {
               top-left: 20,
             }
       - type: clip
         id: 2
         bounds: [0, 0, 200, 200]
         complex:
           - rect: [0, 0, 200, 200]
             radius: {
               top-right: 20,
             }
    -
      bounds: [0, 0, 200, 200]
      type: stacking-context
      transform: rotate(-90)
      items:
       - type: clip
         id: 3
         bounds: [0, 0, 200, 200]
         complex:
           - rect: [0, 0, 200, 200]
             radius: {
               bottom-left: 20,
             }
       - type: clip
         id: 4
         bounds: [0, 0, 200, 200]
         complex:
           - rect: [0, 0, 200, 200]
             radius: {
               top-left: 20,
             }

    - type: clip-chain
      id: 5
      clips: [10, 2]
    - type: clip-chain
      id: 6
      parent: 5
      clips: [3, 4]
    - type: rect
      bounds: [0, 0, 200, 200]
      color: green
      clip-and-scroll: [root-scroll-node, 6]