Skip to content

Transformed images with transformed rectangle clips are not clipped properly #1732

@mstange

Description

@mstange

https://bugzilla.mozilla.org/show_bug.cgi?id=1401665

>> Testcase <<

Expected vs actual rendering:
screen shot 2017-09-20 at 3 59 33 pm

It looks like the image is only clipped to the axis-aligned bounds of the rotated rectangle instead of to the actual rotated rectangle.

In the YAML recording, the image: "res/1505936895-img-59.png" item has "clip-and-scroll": 4, and the clip with id: 4 is defined inside the rotated stacking context, so I think this is a webrender bug and not a Gecko bug.

---
root: 
  items: 
    -
      bounds: [0, 0, 0, 0]
      "clip-rect": [0, 0, 0, 0]
      "clip-and-scroll": 0
      "backface-visible": true
    - 
      bounds: [0, 0, 2880, 1482]
      "clip-rect": [0, 0, 2880, 1482]
      "clip-and-scroll": 0
      "backface-visible": true
      type: rect
      color: white
    - 
      bounds: [0, 0, 2880, 1482]
      "clip-rect": [0, 0, 2880, 1482]
      "clip-and-scroll": 0
      "backface-visible": true
      type: clip
      id: 1
      "content-size": [2880, 1482]
    - 
      "clip-rect": [0, 0, 2880, 1482]
      "clip-and-scroll": 1
      "backface-visible": true
      type: "scroll-frame"
      id: 2
      "content-size": [2880, 1482]
      bounds: [0, 0, 2880, 1482]
    - 
      bounds: [0, 0, 2880, 1482]
      "clip-rect": [0, 0, 2880, 1482]
      "clip-and-scroll": 2
      "backface-visible": true
      type: clip
      id: 3
      "content-size": [2880, 1482]
    - 
      bounds: [0, 0, 2880, 1482]
      "clip-rect": [0, 0, 2880, 1482]
      "clip-and-scroll": 3
      "backface-visible": true
      type: rect
      color: white
    -
      bounds: [0, 0, 0, 0]
      "clip-rect": [0, 0, 0, 0]
      "clip-and-scroll": 3
      "backface-visible": true
      type: "stacking-context"
      "scroll-policy": scrollable
      transform: [0.42261827, 0.9063078, 0, 0, -0.9063078, 0.42261827, 0, 0, 0, 0, 1, 0, 267.33633, 66.44954, 0, 1]
      "transform-style": flat
      items: 
        - 
          bounds: [2, 2, 200, 200]
          "clip-rect": [2, 2, 200, 200]
          "clip-and-scroll": 3
          "backface-visible": true
          type: clip
          id: 4
          "content-size": [200, 200]
        - 
          bounds: [2, -182, 152, 216]
          "clip-rect": [2, 0, 152, 34]
          "clip-and-scroll": 4
          "backface-visible": true
          image: "res/1505936895-img-59.png"
          "stretch-size": [152, 216]
          "tile-spacing": [0, 0]
        - 
          bounds: [0, 0, 204, 204]
          "clip-rect": [0, 0, 204, 204]
          "clip-and-scroll": 3
          "backface-visible": true
          type: border
          width: 2
          "border-type": normal
          color: 0 0 255 1.0000
          style: solid
    - 
      bounds: [0, 0, 0, 0]
      "clip-rect": [0, 0, 0, 0]
      "clip-and-scroll": 0
      "backface-visible": true
  id: [1, 1]
pipelines: []

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions