What should getBoundingClientRect() on a transform

2020-07-06 08:29发布

Today I tested what happens when you use getBoundingClientRect() on an SVG element that has been rotated.

Test: http://phrogz.net/svg/getBoundingClientRect-on-rotated-elements.html

The result is that:

  • Chrome, Safari, Opera, and IE appear to calculate the local (untransformed) bounding box of the element, and then return the client rect for that bounding box. This can result in a client rect larger than seems appropriate.

  • Firefox, on the other hand, clips the client rect to fit the element itself.

 
                          Visual appearance of the two cases;  

Which behavior is correct according to the specifications?

For what it's worth, I prefer the Firefox behavior, but (absent understanding the specs) think that Firefox's deviation should be considered a bug.

1条回答
迷人小祖宗
2楼-- · 2020-07-06 09:09

Non-firefox browsers don't seem to give useful results and don't seem to match the relevant specifications either.

The CSSOM View Module delegates to the SVG specification which says it's the tight bounding box after transforms not the tight bounding box transformed so I maintain that I implemented it correctly.

查看更多
登录 后发表回答