Web Inspector: [CSS Shapes] Highlight margin-shape for shape-outside
authorbetravis@adobe.com <betravis@adobe.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 11 Dec 2013 21:33:08 +0000 (21:33 +0000)
committerbetravis@adobe.com <betravis@adobe.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 11 Dec 2013 21:33:08 +0000 (21:33 +0000)
commit30e8d8d43779a245d47d21c2acbb045f6d6cf8e4
treecdb1a67c8a8b78c4a2b3787c5082ad671706a7b3
parent0e94adc6f55bcb7b3883f9daa167f019a43041cf
Web Inspector: [CSS Shapes] Highlight margin-shape for shape-outside
https://bugs.webkit.org/show_bug.cgi?id=125175

Reviewed by Darin Adler.

Source/WebCore:

In addition to highlighting the shape, also highlight the shape created
by shape-margin with a slightly more transparent color. This patch modifies
the shape info passed to the Inspector Overlay to include a path for both
the raw shape and the shape with margin.

Test: inspector-protocol/model/highlight-shape-outside-margin.html

* inspector/InspectorOverlay.cpp:
(WebCore::buildObjectForShapeOutside): Call Shape::buildDisplayPaths rather than
Shape::buildPath, and pass along any relevant paths to the Inspector overlay.
* inspector/InspectorOverlayPage.js:
(_drawShapeHighlight): Draw the margin shape in addition to the raw shape.
* rendering/shapes/BoxShape.cpp:
(WebCore::addRoundedRect): Add a rounded rect to the path.
(WebCore::BoxShape::buildDisplayPaths): Create the applicable [margin/padding/raw] shapes.
* rendering/shapes/BoxShape.h:
* rendering/shapes/PolygonShape.cpp:
(WebCore::addPolygon): Add a set of vertices as a polygon to the path.
(WebCore::PolygonShape::buildDisplayPaths): Create the applicable [margin/padding/raw] shapes.
* rendering/shapes/PolygonShape.h:
* rendering/shapes/RasterShape.h:
(WebCore::RasterShape::buildDisplayPaths): Ditto.
* rendering/shapes/RectangleShape.cpp:
(WebCore::RectangleShape::buildDisplayPaths): Ditto.
* rendering/shapes/RectangleShape.h:
* rendering/shapes/Shape.h:

LayoutTests:

Test that the shape and margin-shape are properly passed to the Inspector Overlay.
Arcs for rounded rectangles, circles, and ellipses are approximated using the same
bezier curve method present in Path.cpp.

* inspector-protocol/model/highlight-shape-outside-margin.html: Added.
* inspector-protocol/model/highlight-shape-outside.html: Updating shape-outside info model.
* inspector-protocol/resources/shape-info-helper.js: Adding utilities to compare alternate
  path formats.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@160451 268f45cc-cd09-0410-ab3c-d52691b4dbfc
16 files changed:
LayoutTests/ChangeLog
LayoutTests/inspector-protocol/model/highlight-shape-outside-margin-expected.txt [new file with mode: 0644]
LayoutTests/inspector-protocol/model/highlight-shape-outside-margin.html [new file with mode: 0644]
LayoutTests/inspector-protocol/model/highlight-shape-outside.html
LayoutTests/inspector-protocol/resources/shape-info-helper.js
Source/WebCore/ChangeLog
Source/WebCore/inspector/InspectorOverlay.cpp
Source/WebCore/inspector/InspectorOverlayPage.js
Source/WebCore/rendering/shapes/BoxShape.cpp
Source/WebCore/rendering/shapes/BoxShape.h
Source/WebCore/rendering/shapes/PolygonShape.cpp
Source/WebCore/rendering/shapes/PolygonShape.h
Source/WebCore/rendering/shapes/RasterShape.h
Source/WebCore/rendering/shapes/RectangleShape.cpp
Source/WebCore/rendering/shapes/RectangleShape.h
Source/WebCore/rendering/shapes/Shape.h