root:
  items:
    - type: scroll-frame
      bounds: [10, 10, 100, 300]
      content-size: [100, 700]
      id: 41
      scroll-offset: [0, 50]
      items:
      # The rectangles below should stay in place even when the parent scroll area scrolls,
      # because they use the root reference frame as their scroll node (fixed position).
      # On the other hand, the clip item here will scroll with its parent scroll area. Normally
      # fixed position items  would only be clipped by their reference frame (in this case the
      # root), but since these items specify an auxiliary clip, they will be clipped by their
      # sibling clip (42).
        - type: clip
          bounds: [10, 60, 50, 50]
          id: 42
        - type: clip-chain
          id: 142
          clips: [42]
        - type: stacking-context
          bounds: [10, 10, 100, 100]
          items:
            - type: rect
              bounds: [0, 0, 100, 50]
              color: green
              clip-chain: 142
              spatial-id: root-reference-frame
            - type: rect
              bounds: [0, 50, 100, 50]
              color: red
              clip-chain: 142
              spatial-id: root-reference-frame