root:
  bounds: [0, 0, 1024, 10000]
  scroll-offset: [0, 100]
  items:
    - type: stacking-context
      bounds: [0, 0, 50, 50]
      items:
        # This item should not scroll out of view because it is fixed position.
        - type: rect
          bounds: [0, 0, 50, 50]
          color: green
          spatial-id: root-reference-frame
    - type: stacking-context
      bounds: [0, 0, 50, 50]
      transform: translate(60, 100)
      id: 100
      items:
        - type: stacking-context
          bounds: [0, 0, 50, 50]
          items:
            # Even though there is a custom clip-scroll ID, it should scroll,
            # because it is fixed relative to its reference frame. The reference frame
            # of this stacking context is the stacking context parent because it has
            # a transformation.
            - type: rect
              bounds: [0, 0, 50, 50]
              color: green
    - type: stacking-context
      bounds: [120, 0, 50, 200]
      transform: translate(0, 0)
      id: 101
      items:
        # This is similar to the previous case, but ensures that this still works
        # even with an identity transform.
        - type: stacking-context
          bounds: [0, 0, 50, 200]
          items:
            - type: rect
              bounds: [0, 100, 50, 50]
              color: green
    - type: stacking-context
      bounds: [180, 0, 50, 200]
      perspective: 1
      id: 102
      items:
        # This is similar to the previous case, but for perspective.
        - type: stacking-context
          bounds: [0, 0, 50, 200]
          items:
            - type: rect
              bounds: [0, 100, 50, 50]
              color: green