Changeset 217236 in webkit


Ignore:
Timestamp:
May 22, 2017 12:19:24 PM (7 years ago)
Author:
Simon Fraser
Message:

Support transform-box to switch sizing box in SVG
https://bugs.webkit.org/show_bug.cgi?id=145783

Reviewed by Dean Jackson.

Source/WebCore:

Add support for the CSS "transform-box" property, as described at
<https://drafts.csswg.org/css-transforms/#transform-box>.

This changes the behavior of percentage values in transform-origin in SVG.
When these were added in r110532, percentage values in transform-origin were made
relative to the bounding box, but absolute values relative to the view box.
<https://github.com/w3c/csswg-drafts/issues/895> has concluded that this behavior
is confusing. The new behavior is that, for SVG elements, both absolute and
percentage values are relative to the reference box, which is specified by the
new transform-box property.

The initial value for transform-box is border-box, with the svg.css UA stylesheet
supplying a default of view-box for the relevant SVG elements per
<https://www.w3.org/TR/SVG2/styling.html#UAStyleSheet>.

For non-SVG elements, the used value is always border-box, so there is no change
in behavior.

Tests: fast/css/transform-box-parsing.html

svg/transforms/svg-transform-box.html

  • css/CSSComputedStyleDeclaration.cpp:

(WebCore::ComputedStyleExtractor::propertyValue):

  • css/CSSPrimitiveValueMappings.h:

(WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
(WebCore::CSSPrimitiveValue::operator TransformBox):

  • css/CSSProperties.json:
  • css/CSSValueKeywords.in:
  • css/parser/CSSPropertyParser.cpp:

(WebCore::CSSPropertyParser::parseSingleValue):

  • css/svg.css:

(*:not(svg),):
(*): Deleted.
(html|* > svg): Deleted.

  • page/animation/AnimationBase.cpp:

(WebCore::AnimationBase::computeTransformedExtentViaTransformList):

  • rendering/style/RenderStyle.cpp:

(WebCore::RenderStyle::applyTransform): The transformOriginX().isPercent() tests
were added to support the weird "% values are relative to bounding box" in SVG. Now
it's up to the caller to pass a non-zero origin when that matters, and
SVGGraphicsElement::animatedLocalTransform() is the only caller that does so.

  • rendering/style/RenderStyle.h:

(WebCore::RenderStyle::hasTransform):
(WebCore::RenderStyle::transformBox):
(WebCore::RenderStyle::setTransformBox):
(WebCore::RenderStyle::initialTransformBox):

  • rendering/style/RenderStyleConstants.h:
  • rendering/style/StyleTransformData.cpp:

(WebCore::StyleTransformData::StyleTransformData):
(WebCore::StyleTransformData::operator==):

  • rendering/style/StyleTransformData.h:
  • svg/SVGGraphicsElement.cpp:

(WebCore::SVGGraphicsElement::animatedLocalTransform): Consult the transform-box
style to compute the reference box as the bounding box, or the view box.

Source/WebInspectorUI:

Add transform-box to the list of autocompletions.

  • UserInterface/External/CodeMirror/css.js:

LayoutTests:

Modify tests that relied on the old "% values relative to the bounding box" behavior,
and new tests for parsing and rendering with transform-box.

  • fast/css/transform-box-parsing.html: Added.
  • svg/transforms/change-transform-origin-css.xhtml:
  • svg/transforms/change-transform-origin-presentation-attribute.xhtml:
  • svg/transforms/percent-transform-values.xhtml:
  • svg/transforms/svg-transform-box-expected.html: Added.
  • svg/transforms/svg-transform-box.html: Added.
  • svg/transforms/transform-origin-css-property.xhtml:
  • transforms/svg-vs-css.xhtml:
Location:
trunk
Files:
4 added
22 edited

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/ChangeLog

    r217227 r217236  
     12017-05-22  Simon Fraser  <simon.fraser@apple.com>
     2
     3        Support transform-box to switch sizing box in SVG
     4        https://bugs.webkit.org/show_bug.cgi?id=145783
     5
     6        Reviewed by Dean Jackson.
     7
     8        Modify tests that relied on the old "% values relative to the bounding box" behavior,
     9        and new tests for parsing and rendering with transform-box.
     10
     11        * fast/css/transform-box-parsing.html: Added.
     12        * svg/transforms/change-transform-origin-css.xhtml:
     13        * svg/transforms/change-transform-origin-presentation-attribute.xhtml:
     14        * svg/transforms/percent-transform-values.xhtml:
     15        * svg/transforms/svg-transform-box-expected.html: Added.
     16        * svg/transforms/svg-transform-box.html: Added.
     17        * svg/transforms/transform-origin-css-property.xhtml:
     18        * transforms/svg-vs-css.xhtml:
     19
    1202017-05-22  Antti Koivisto  <antti@apple.com>
    221
  • trunk/LayoutTests/svg/transforms/change-transform-origin-css.xhtml

    r110532 r217236  
    1010<body>
    1111  <svg xmlns="http://www.w3.org/2000/svg" style="position: absolute; top: 0px; left: 0px;">
    12       <rect id="rect" width="50px" height="50px" x="50" y="50" fill="green" style="-webkit-transform: scale(2, 2);"/>
     12      <rect id="rect" width="50px" height="50px" x="50" y="50" fill="green" style="transform: scale(2, 2); transform-box: fill-box;"/>
    1313  </svg>
    1414
    1515  <script><![CDATA[
    16       document.getElementById('rect').style.webkitTransformOrigin = "50% 50%";
     16      document.getElementById('rect').style.transformOrigin = "50% 50%";
    1717  ]]></script>
    1818</body>
  • trunk/LayoutTests/svg/transforms/change-transform-origin-presentation-attribute.xhtml

    r110532 r217236  
    99<body>
    1010  <svg xmlns="http://www.w3.org/2000/svg" style="position: absolute; top: 0px; left: 0px;">
    11       <rect id="rect" width="50px" height="50px" x="50" y="50" fill="green" transform-origin="0 0" style="-webkit-transform: scale(2, 2);"/>
     11      <rect id="rect" width="50px" height="50px" x="50" y="50" fill="green" transform-origin="0 0" style="transform: scale(2, 2); transform-box: fill-box;"/>
    1212  </svg>
    1313
  • trunk/LayoutTests/svg/transforms/percent-transform-values.xhtml

    r124380 r217236  
    11<html xmlns="http://www.w3.org/1999/xhtml">
    22<body>
    3   <p>Test for bug <a href="">79068</a> - SVG should support transform-origin and relative values
     3  <p>Test for bug <a href="http://webkit.org/b/79068">79068</a> - SVG should support transform-origin and relative values
    44  Verify that CSS transform translate values can be specified with percentages.
    55  </p>
     
    99  </p>
    1010  <svg style="position:absolute; left:0px; top:0px;" xmlns="http://www.w3.org/2000/svg">
    11     <rect id="r1" x="10" y="200" width="80" height="60" fill="red" style="-webkit-transform: translate(50%)"/>
    12     <rect id="r2" x="90" y="260" width="80" height="60" fill="red" style="-webkit-transform: translate(-50%, -100%)"/>
    13     <rect id="r3" x="10" y="200" width="80" height="60" fill="green" style="-webkit-transform: translate(50%, 0%)"/>
     11    <rect id="r1" x="10" y="200" width="80" height="60" fill="red" style="transform-box: fill-box; transform: translate(50%)"/>
     12    <rect id="r2" x="90" y="260" width="80" height="60" fill="red" style="transform-box: fill-box; transform: translate(-50%, -100%)"/>
     13    <rect id="r3" x="10" y="200" width="80" height="60" fill="green" style="transform-box: fill-box; transform: translate(50%, 0%)"/>
    1414  </svg>
    1515  <pre id="log"></pre>
  • trunk/LayoutTests/svg/transforms/transform-origin-css-property.xhtml

    r168350 r217236  
    1111#transformOriginRect {
    1212    fill: green;
    13     -webkit-transform: rotate(90deg);
     13    transform: rotate(90deg);
    1414}
    1515</style>
     
    3131    {
    3232       var rect = document.createElementNS(svgNS, "rect");
    33        var transformOrigin = (typeof(s) == "string") ? s :  (x + s[0]) + " " + (y + s[1]);
     33       var transformOrigin = (typeof(s) == "string") ? s :  (x + s[0]) + "px " + (y + s[1]) + "px";
    3434       rect.setAttribute("id", "transformOriginRect");
    3535       rect.setAttribute("x", x);
     
    3737       rect.setAttribute("width", 30);
    3838       rect.setAttribute("height", 30);
    39        rect.setAttribute("style", "-webkit-transform-origin: " + transformOrigin + ";");
     39       rect.setAttribute("style", "transform-box: view-box; transform-origin: " + transformOrigin + ";");
    4040       document.getElementById("svgRoot").appendChild(rect);
    4141    }
  • trunk/LayoutTests/transforms/svg-vs-css.xhtml

    r58584 r217236  
    9898      <svg xmlns="http://www.w3.org/2000/svg" version="1.1" 
    9999          viewBox="0 0 200 200" style="width:200px; height:200px;">
    100           <g id="group1" x="0" y="0" width="60" height="60" transform="translate(75, 25)">
     100          <g id="group1" transform="translate(75, 25)">
    101101            <rect x="0" y="0" width="60" height="60" stroke="black" stroke-width="1px" stroke-dasharray="1 1" fill="none" />
    102             <g id="group2" x="0" y="0" width="60" height="60" transform="scale(2)" >
     102            <g id="group2" transform="scale(2)">
    103103              <rect x="0" y="0" width="60" height="60" stroke="black" stroke-dasharray="1 1" stroke-width="1px" fill="none" />
    104104              <rect id="group3" x="0" y="0" width="60" height="60" stroke="blue" fill="none" transform="rotate(45)" />
  • trunk/Source/WebCore/ChangeLog

    r217235 r217236  
     12017-05-22  Simon Fraser  <simon.fraser@apple.com>
     2
     3        Support transform-box to switch sizing box in SVG
     4        https://bugs.webkit.org/show_bug.cgi?id=145783
     5
     6        Reviewed by Dean Jackson.
     7
     8        Add support for the CSS "transform-box" property, as described at
     9        <https://drafts.csswg.org/css-transforms/#transform-box>.
     10       
     11        This changes the behavior of percentage values in transform-origin in SVG.
     12        When these were added in r110532, percentage values in transform-origin were made
     13        relative to the bounding box, but absolute values relative to the view box.
     14        <https://github.com/w3c/csswg-drafts/issues/895> has concluded that this behavior
     15        is confusing. The new behavior is that, for SVG elements, both absolute and
     16        percentage values are relative to the reference box, which is specified by the
     17        new transform-box property.
     18
     19        The initial value for transform-box is border-box, with the svg.css UA stylesheet
     20        supplying a default of view-box for the relevant SVG elements per
     21        <https://www.w3.org/TR/SVG2/styling.html#UAStyleSheet>.
     22
     23        For non-SVG elements, the used value is always border-box, so there is no change
     24        in behavior.
     25
     26        Tests: fast/css/transform-box-parsing.html
     27               svg/transforms/svg-transform-box.html
     28
     29        * css/CSSComputedStyleDeclaration.cpp:
     30        (WebCore::ComputedStyleExtractor::propertyValue):
     31        * css/CSSPrimitiveValueMappings.h:
     32        (WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
     33        (WebCore::CSSPrimitiveValue::operator TransformBox):
     34        * css/CSSProperties.json:
     35        * css/CSSValueKeywords.in:
     36        * css/parser/CSSPropertyParser.cpp:
     37        (WebCore::CSSPropertyParser::parseSingleValue):
     38        * css/svg.css:
     39        (*:not(svg),):
     40        (*): Deleted.
     41        (html|* > svg): Deleted.
     42        * page/animation/AnimationBase.cpp:
     43        (WebCore::AnimationBase::computeTransformedExtentViaTransformList):
     44        * rendering/style/RenderStyle.cpp:
     45        (WebCore::RenderStyle::applyTransform): The transformOriginX().isPercent() tests
     46        were added to support the weird "% values are relative to bounding box" in SVG. Now
     47        it's up to the caller to pass a non-zero origin when that matters, and
     48        SVGGraphicsElement::animatedLocalTransform() is the only caller that does so.
     49        * rendering/style/RenderStyle.h:
     50        (WebCore::RenderStyle::hasTransform):
     51        (WebCore::RenderStyle::transformBox):
     52        (WebCore::RenderStyle::setTransformBox):
     53        (WebCore::RenderStyle::initialTransformBox):
     54        * rendering/style/RenderStyleConstants.h:
     55        * rendering/style/StyleTransformData.cpp:
     56        (WebCore::StyleTransformData::StyleTransformData):
     57        (WebCore::StyleTransformData::operator==):
     58        * rendering/style/StyleTransformData.h:
     59        * svg/SVGGraphicsElement.cpp:
     60        (WebCore::SVGGraphicsElement::animatedLocalTransform): Consult the transform-box
     61        style to compute the reference box as the bounding box, or the view box.
     62
    1632017-05-22  Chris Dumez  <cdumez@apple.com>
    264
  • trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp

    r216829 r217236  
    232232    CSSPropertyTop,
    233233    CSSPropertyTransform,
     234    CSSPropertyTransformBox,
    234235    CSSPropertyTransformOrigin,
    235236    CSSPropertyTransformStyle,
     
    36833684        case CSSPropertyTransform:
    36843685            return computedTransform(renderer, *style);
     3686        case CSSPropertyTransformBox:
     3687            return CSSPrimitiveValue::create(style->transformBox());
    36853688        case CSSPropertyTransformOrigin: {
    36863689            auto list = CSSValueList::createSpaceSeparated();
  • trunk/Source/WebCore/css/CSSPrimitiveValueMappings.h

    r216418 r217236  
    44154415}
    44164416
     4417template<> inline CSSPrimitiveValue::CSSPrimitiveValue(TransformBox box)
     4418    : CSSValue(PrimitiveClass)
     4419{
     4420    m_primitiveUnitType = CSS_VALUE_ID;
     4421    switch (box) {
     4422    case TransformBox::BorderBox:
     4423        m_value.valueID = CSSValueBorderBox;
     4424        break;
     4425    case TransformBox::FillBox:
     4426        m_value.valueID = CSSValueFillBox;
     4427        break;
     4428    case TransformBox::ViewBox:
     4429        m_value.valueID = CSSValueViewBox;
     4430        break;
     4431    }
     4432}
     4433
     4434template<> inline CSSPrimitiveValue::operator TransformBox() const
     4435{
     4436    ASSERT(isValueID());
     4437
     4438    switch (m_value.valueID) {
     4439    case CSSValueBorderBox:
     4440        return TransformBox::BorderBox;
     4441    case CSSValueFillBox:
     4442        return TransformBox::FillBox;
     4443    case CSSValueViewBox:
     4444        return TransformBox::ViewBox;
     4445    default:
     4446        break;
     4447    }
     4448
     4449    ASSERT_NOT_REACHED();
     4450    return TransformBox::BorderBox;
     4451}
     4452
    44174453template<> inline CSSPrimitiveValue::CSSPrimitiveValue(ColumnAxis e)
    44184454    : CSSValue(PrimitiveClass)
  • trunk/Source/WebCore/css/CSSProperties.json

    r216829 r217236  
    59545954            }
    59555955        },
     5956        "transform-box": {
     5957            "values" : [
     5958                "border-box",
     5959                "fill-box",
     5960                "view-box"
     5961            ],
     5962            "codegen-properties": {
     5963            },
     5964            "specification": {
     5965                "category": "css-transforms",
     5966                "url": "https://www.w3.org/TR/css-transforms/#propdef-transform-box"
     5967            }
     5968        },
    59565969        "transform-origin": {
    59575970            "codegen-properties": {
  • trunk/Source/WebCore/css/CSSValueKeywords.in

    r216418 r217236  
    12481248translate3d
    12491249
     1250// transform-box
     1251// border-box
     1252// view-box
     1253fill-box
     1254
    12501255// motion path
    12511256path
  • trunk/Source/WebCore/css/parser/CSSPropertyParser.cpp

    r216902 r217236  
    40724072    case CSSPropertyTransform:
    40734073        return consumeTransform(m_range, m_context.mode);
     4074    case CSSPropertyTransformBox:
     4075        return consumeIdent<CSSValueBorderBox, CSSValueViewBox, CSSValueFillBox>(m_range);
    40744076    case CSSPropertyTransformOriginX:
    40754077    case CSSPropertyPerspectiveOriginX:
  • trunk/Source/WebCore/css/svg.css

    r168350 r217236  
    7373}
    7474
    75 /* CSS transform specification: "transform-origin 0 0 for SVG elements without associated CSS layout box, 50% 50% for all other elements". */
    76  
    77 * {
    78     -webkit-transform-origin: 0 0;
     75*:not(svg),
     76*:not(foreignObject) > svg {
     77    transform-origin: 0 0;
     78    transform-box: view-box;
    7979}
    80 
    81 html|* > svg {
    82     -webkit-transform-origin: 50% 50%;
    83 }
  • trunk/Source/WebCore/page/animation/AnimationBase.cpp

    r215352 r217236  
    803803    bool applyTransformOrigin = containsRotation(style.transform().operations()) || style.transform().affectedByTransformOrigin();
    804804    if (applyTransformOrigin) {
    805         float offsetX = style.transformOriginX().isPercent() ? rendererBox.x() : 0;
    806         float offsetY = style.transformOriginY().isPercent() ? rendererBox.y() : 0;
    807 
    808         transformOrigin.setX(floatValueForLength(style.transformOriginX(), rendererBox.width()) + offsetX);
    809         transformOrigin.setY(floatValueForLength(style.transformOriginY(), rendererBox.height()) + offsetY);
     805        transformOrigin.setX(rendererBox.x() + floatValueForLength(style.transformOriginX(), rendererBox.width()));
     806        transformOrigin.setY(rendererBox.y() + floatValueForLength(style.transformOriginY(), rendererBox.height()));
    810807        // Ignore transformOriginZ because we'll bail if we encounter any 3D transforms.
    811        
     808
    812809        floatBounds.moveBy(-transformOrigin);
    813810    }
  • trunk/Source/WebCore/rendering/style/RenderStyle.cpp

    r215507 r217236  
    11311131    auto& operations = m_rareNonInheritedData->transform->operations.operations();
    11321132    bool applyTransformOrigin = requireTransformOrigin(operations, applyOrigin);
    1133 
    1134     float offsetX = transformOriginX().isPercent() ? boundingBox.x() : 0;
    1135     float offsetY = transformOriginY().isPercent() ? boundingBox.y() : 0;
    1136 
     1133   
     1134    FloatPoint3D originTranslate;
    11371135    if (applyTransformOrigin) {
    1138         transform.translate3d(floatValueForLength(transformOriginX(), boundingBox.width()) + offsetX,
    1139                               floatValueForLength(transformOriginY(), boundingBox.height()) + offsetY,
    1140                               transformOriginZ());
     1136        originTranslate.setX(boundingBox.x() + floatValueForLength(transformOriginX(), boundingBox.width()));
     1137        originTranslate.setY(boundingBox.y() + floatValueForLength(transformOriginY(), boundingBox.height()));
     1138        originTranslate.setZ(transformOriginZ());
     1139        transform.translate3d(originTranslate.x(), originTranslate.y(), originTranslate.z());
    11411140    }
    11421141
     
    11441143        operation->apply(transform, boundingBox.size());
    11451144
    1146     if (applyTransformOrigin) {
    1147         transform.translate3d(-floatValueForLength(transformOriginX(), boundingBox.width()) - offsetX,
    1148                               -floatValueForLength(transformOriginY(), boundingBox.height()) - offsetY,
    1149                               -transformOriginZ());
    1150     }
     1145    if (applyTransformOrigin)
     1146        transform.translate3d(-originTranslate.x(), -originTranslate.y(), -originTranslate.z());
    11511147}
    11521148
  • trunk/Source/WebCore/rendering/style/RenderStyle.h

    r215375 r217236  
    609609
    610610    const TransformOperations& transform() const { return m_rareNonInheritedData->transform->operations; }
     611    bool hasTransform() const { return !m_rareNonInheritedData->transform->operations.operations().isEmpty(); }
    611612    const Length& transformOriginX() const { return m_rareNonInheritedData->transform->x; }
    612613    const Length& transformOriginY() const { return m_rareNonInheritedData->transform->y; }
    613614    float transformOriginZ() const { return m_rareNonInheritedData->transform->z; }
    614     bool hasTransform() const { return !m_rareNonInheritedData->transform->operations.operations().isEmpty(); }
     615    TransformBox transformBox() const { return m_rareNonInheritedData->transform->transformBox; }
    615616
    616617    TextEmphasisFill textEmphasisFill() const { return static_cast<TextEmphasisFill>(m_rareInheritedData->textEmphasisFill); }
     
    11361137    void setColumnSpan(ColumnSpan columnSpan) { SET_NESTED_VAR(m_rareNonInheritedData, multiCol, columnSpan, columnSpan); }
    11371138    void inheritColumnPropertiesFrom(const RenderStyle& parent) { m_rareNonInheritedData.access().multiCol = parent.m_rareNonInheritedData->multiCol; }
     1139
    11381140    void setTransform(const TransformOperations& ops) { SET_NESTED_VAR(m_rareNonInheritedData, transform, operations, ops); }
    11391141    void setTransformOriginX(Length&& length) { SET_NESTED_VAR(m_rareNonInheritedData, transform, x, WTFMove(length)); }
    11401142    void setTransformOriginY(Length&& length) { SET_NESTED_VAR(m_rareNonInheritedData, transform, y, WTFMove(length)); }
    11411143    void setTransformOriginZ(float f) { SET_NESTED_VAR(m_rareNonInheritedData, transform, z, f); }
     1144    void setTransformBox(TransformBox box) { SET_NESTED_VAR(m_rareNonInheritedData, transform, transformBox, box); }
     1145
    11421146    void setSpeak(ESpeak s) { SET_VAR(m_rareInheritedData, speak, s); }
    11431147    void setTextCombine(TextCombine v) { SET_VAR(m_rareNonInheritedData, textCombine, v); }
     
    15331537    static Length initialTransformOriginX() { return Length(50.0f, Percent); }
    15341538    static Length initialTransformOriginY() { return Length(50.0f, Percent); }
     1539    static TransformBox initialTransformBox() { return TransformBox::BorderBox; }
    15351540    static EPointerEvents initialPointerEvents() { return PE_AUTO; }
    15361541    static float initialTransformOriginZ() { return 0; }
  • trunk/Source/WebCore/rendering/style/RenderStyleConstants.h

    r215146 r217236  
    584584    BackfaceVisibilityVisible, BackfaceVisibilityHidden
    585585};
    586    
     586
     587enum class TransformBox {
     588    BorderBox,
     589    FillBox,
     590    ViewBox
     591};
     592
    587593enum ELineClampType { LineClampLineCount, LineClampPercentage };
    588594
  • trunk/Source/WebCore/rendering/style/StyleTransformData.cpp

    r210758 r217236  
    3232    , y(RenderStyle::initialTransformOriginY())
    3333    , z(RenderStyle::initialTransformOriginZ())
     34    , transformBox(RenderStyle::initialTransformBox())
    3435{
    3536}
     
    4142    , y(other.y)
    4243    , z(other.z)
     44    , transformBox(other.transformBox)
    4345{
    4446}
     
    5153bool StyleTransformData::operator==(const StyleTransformData& other) const
    5254{
    53     return x == other.x && y == other.y && z == other.z && operations == other.operations;
     55    return x == other.x && y == other.y && z == other.z && transformBox == other.transformBox && operations == other.operations;
    5456}
    5557
  • trunk/Source/WebCore/rendering/style/StyleTransformData.h

    r210758 r217236  
    2626
    2727#include "Length.h"
     28#include "RenderStyleConstants.h"
    2829#include "TransformOperations.h"
    2930#include <wtf/Ref.h>
     
    4950    Length y;
    5051    float z;
     52    TransformBox transformBox;
    5153
    5254private:
  • trunk/Source/WebCore/svg/SVGGraphicsElement.cpp

    r208863 r217236  
    2828#include "SVGPathData.h"
    2929#include "SVGRect.h"
     30#include "SVGSVGElement.h"
    3031#include "SVGStringList.h"
    3132#include <wtf/NeverDestroyed.h>
     
    8081    // If CSS property was set, use that, otherwise fallback to attribute (if set).
    8182    if (style && style->hasTransform()) {
     83       
     84        FloatRect boundingBox;
     85        switch (style->transformBox()) {
     86        case TransformBox::FillBox:
     87            boundingBox = renderer()->objectBoundingBox();
     88            break;
     89        case TransformBox::BorderBox:
     90            // For SVG elements without an associated CSS layout box, the used value for border-box is view-box.
     91        case TransformBox::ViewBox:
     92            if (auto *viewportElement = nearestViewportElement()) {
     93                if (is<SVGSVGElement>(*viewportElement))
     94                    boundingBox = downcast<SVGSVGElement>(*viewportElement).viewBox();
     95            }
     96            break;
     97        }
     98       
    8299        // Note: objectBoundingBox is an emptyRect for elements like pattern or clipPath.
    83100        // See the "Object bounding box units" section of http://dev.w3.org/csswg/css3-transforms/
    84101        TransformationMatrix transform;
    85         style->applyTransform(transform, renderer()->objectBoundingBox());
     102        style->applyTransform(transform, boundingBox);
    86103
    87104        // Flatten any 3D transform.
  • trunk/Source/WebInspectorUI/ChangeLog

    r217232 r217236  
     12017-05-22  Simon Fraser  <simon.fraser@apple.com>
     2
     3        Support transform-box to switch sizing box in SVG
     4        https://bugs.webkit.org/show_bug.cgi?id=145783
     5
     6        Reviewed by Dean Jackson.
     7
     8        Add transform-box to the list of autocompletions.
     9
     10        * UserInterface/External/CodeMirror/css.js:
     11
    1122017-05-22  Brian Burg  <bburg@apple.com>
    213
  • trunk/Source/WebInspectorUI/UserInterface/External/CodeMirror/css.js

    r210032 r217236  
    520520    "text-indent", "text-justify", "text-outline", "text-overflow", "text-shadow",
    521521    "text-size-adjust", "text-space-collapse", "text-transform", "text-underline-position",
    522     "text-wrap", "top", "transform", "transform-origin", "transform-style",
     522    "text-wrap", "top", "transform", "transform-box", "transform-origin", "transform-style",
    523523    "transition", "transition-delay", "transition-duration",
    524524    "transition-property", "transition-timing-function", "unicode-bidi",
Note: See TracChangeset for help on using the changeset viewer.