Changeset 181691 in webkit


Ignore:
Timestamp:
Mar 18, 2015 6:47:52 AM (9 years ago)
Author:
Manuel Rego Casasnovas
Message:

Flex and grid items should be painted as inline-blocks
https://bugs.webkit.org/show_bug.cgi?id=142266

Reviewed by Darin Adler.

Source/WebCore:

Based on Blink r157004 by <cbiesinger@chromium.org>.
https://src.chromium.org/viewvc/blink?revision=157004&view=revision

Both flexbox and grid specs define that the painting order of flex/grid
items is the same as inline blocks. See
http://dev.w3.org/csswg/css-flexbox/#painting and
http://dev.w3.org/csswg/css-grid/#z-order.

Extracted inline blocks painting code from InlineElementBox and moved to
a helper method that will be reused for flexboxes and grids.

Tests: css3/flexbox/flex-item-text-background-not-interleaved.html

fast/css-grid-layout/grid-item-text-background-not-interleaved.html

  • rendering/InlineElementBox.cpp:

(WebCore::InlineElementBox::paint): Move code to
RenderElement::paintAsInlineBlock().

  • rendering/RenderBlock.cpp:

(WebCore::RenderBlock::paintChild): Add new argument to paint children
as inline blocks.

  • rendering/RenderBlock.h: Define PaintType enmu and modify paintChild()

signature to add the new argument.

  • rendering/RenderElement.cpp:

(WebCore::paintPhase): Paint element in a phase.
(WebCore::RenderElement::paintAsInlineBlock): Code extracted from
InlineElementBox::paint().

  • rendering/RenderElement.h: Add new method signature.
  • rendering/RenderFlexibleBox.cpp:

(WebCore::RenderFlexibleBox::paintChildren): Call
RenderBlock::paintChild() with the new argument.

  • rendering/RenderGrid.cpp:

(WebCore::RenderGrid::paintChildren): Ditto.

LayoutTests:

  • css3/flexbox/flex-item-text-background-not-interleaved-expected.html: Added.
  • css3/flexbox/flex-item-text-background-not-interleaved.html: Added.
  • fast/css-grid-layout/float-not-protruding-into-next-grid-item-expected.html:

Add some vertical space to avoid issues with backgrounds.

  • fast/css-grid-layout/float-not-protruding-into-next-grid-item.html:

Ditto.

  • fast/css-grid-layout/grid-item-text-background-not-interleaved-expected.html: Added.
  • fast/css-grid-layout/grid-item-text-background-not-interleaved.html: Added.
Location:
trunk
Files:
4 added
11 edited

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/ChangeLog

    r181685 r181691  
     12015-03-18  Manuel Rego Casasnovas  <rego@igalia.com>
     2
     3        Flex and grid items should be painted as inline-blocks
     4        https://bugs.webkit.org/show_bug.cgi?id=142266
     5
     6        Reviewed by Darin Adler.
     7
     8        * css3/flexbox/flex-item-text-background-not-interleaved-expected.html: Added.
     9        * css3/flexbox/flex-item-text-background-not-interleaved.html: Added.
     10        * fast/css-grid-layout/float-not-protruding-into-next-grid-item-expected.html:
     11        Add some vertical space to avoid issues with backgrounds.
     12        * fast/css-grid-layout/float-not-protruding-into-next-grid-item.html:
     13        Ditto.
     14        * fast/css-grid-layout/grid-item-text-background-not-interleaved-expected.html: Added.
     15        * fast/css-grid-layout/grid-item-text-background-not-interleaved.html: Added.
     16
    1172015-03-17  Commit Queue  <commit-queue@webkit.org>
    218
  • trunk/LayoutTests/fast/css-grid-layout/float-not-protruding-into-next-grid-item-expected.html

    r176957 r181691  
    2626<body>
    2727
    28 <div>This test checks that grid item sets a new formatting context for its content, preventing any 'float' protruding content on the adjoining grid item ('Float' text shouldn't overflow the first row).</div>
     28<p>This test checks that grid item sets a new formatting context for its content, preventing any 'float' protruding content on the adjoining grid item ('Float' text shouldn't overflow the first row).</p>
    2929
    3030<div>
  • trunk/LayoutTests/fast/css-grid-layout/float-not-protruding-into-next-grid-item.html

    r176957 r181691  
    2424<body>
    2525
    26 <div>This test checks that grid item sets a new formatting context for its content, preventing any 'float' protruding content on the adjoining grid item ('Float' text shouldn't overflow the first row).</div>
     26<p>This test checks that grid item sets a new formatting context for its content, preventing any 'float' protruding content on the adjoining grid item ('Float' text shouldn't overflow the first row).</p>
    2727
    2828<div class="grid">
  • trunk/Source/WebCore/ChangeLog

    r181689 r181691  
     12015-03-18  Manuel Rego Casasnovas  <rego@igalia.com>
     2
     3        Flex and grid items should be painted as inline-blocks
     4        https://bugs.webkit.org/show_bug.cgi?id=142266
     5
     6        Reviewed by Darin Adler.
     7
     8        Based on Blink r157004 by <cbiesinger@chromium.org>.
     9        https://src.chromium.org/viewvc/blink?revision=157004&view=revision
     10
     11        Both flexbox and grid specs define that the painting order of flex/grid
     12        items is the same as inline blocks. See
     13        http://dev.w3.org/csswg/css-flexbox/#painting and
     14        http://dev.w3.org/csswg/css-grid/#z-order.
     15
     16        Extracted inline blocks painting code from InlineElementBox and moved to
     17        a helper method that will be reused for flexboxes and grids.
     18
     19        Tests: css3/flexbox/flex-item-text-background-not-interleaved.html
     20               fast/css-grid-layout/grid-item-text-background-not-interleaved.html
     21
     22        * rendering/InlineElementBox.cpp:
     23        (WebCore::InlineElementBox::paint): Move code to
     24        RenderElement::paintAsInlineBlock().
     25        * rendering/RenderBlock.cpp:
     26        (WebCore::RenderBlock::paintChild): Add new argument to paint children
     27        as inline blocks.
     28        * rendering/RenderBlock.h: Define PaintType enmu and modify paintChild()
     29        signature to add the new argument.
     30        * rendering/RenderElement.cpp:
     31        (WebCore::paintPhase): Paint element in a phase.
     32        (WebCore::RenderElement::paintAsInlineBlock): Code extracted from
     33        InlineElementBox::paint().
     34        * rendering/RenderElement.h: Add new method signature.
     35        * rendering/RenderFlexibleBox.cpp:
     36        (WebCore::RenderFlexibleBox::paintChildren): Call
     37        RenderBlock::paintChild() with the new argument.
     38        * rendering/RenderGrid.cpp:
     39        (WebCore::RenderGrid::paintChildren): Ditto.
     40
    1412015-03-18  Chris Dumez  <cdumez@apple.com>
    242
  • trunk/Source/WebCore/rendering/InlineElementBox.cpp

    r174840 r181691  
    7373        childPoint = renderer().containingBlock()->flipForWritingModeForChild(&downcast<RenderBox>(renderer()), childPoint);
    7474
    75     // Paint all phases of replaced elements atomically, as though the replaced element established its
    76     // own stacking context.  (See Appendix E.2, section 6.4 on inline block/table elements in the CSS2.1
    77     // specification.)
    78     bool preservePhase = paintInfo.phase == PaintPhaseSelection || paintInfo.phase == PaintPhaseTextClip;
    79     PaintInfo info(paintInfo);
    80     info.phase = preservePhase ? paintInfo.phase : PaintPhaseBlockBackground;
    81     renderer().paint(info, childPoint);
    82     if (!preservePhase) {
    83         info.phase = PaintPhaseChildBlockBackgrounds;
    84         renderer().paint(info, childPoint);
    85         info.phase = PaintPhaseFloat;
    86         renderer().paint(info, childPoint);
    87         info.phase = PaintPhaseForeground;
    88         renderer().paint(info, childPoint);
    89         info.phase = PaintPhaseOutline;
    90         renderer().paint(info, childPoint);
    91     }
     75    renderer().paintAsInlineBlock(paintInfo, childPoint);
    9276}
    9377
  • trunk/Source/WebCore/rendering/RenderBlock.cpp

    r181654 r181691  
    14531453}
    14541454
    1455 bool RenderBlock::paintChild(RenderBox& child, PaintInfo& paintInfo, const LayoutPoint& paintOffset, PaintInfo& paintInfoForChild, bool usePrintRect)
     1455bool RenderBlock::paintChild(RenderBox& child, PaintInfo& paintInfo, const LayoutPoint& paintOffset, PaintInfo& paintInfoForChild, bool usePrintRect, PaintBlockType paintType)
    14561456{
    14571457    // Check for page-break-before: always, and if it's set, break and bail.
     
    14771477
    14781478    LayoutPoint childPoint = flipForWritingModeForChild(&child, paintOffset);
    1479     if (!child.hasSelfPaintingLayer() && !child.isFloating())
    1480         child.paint(paintInfoForChild, childPoint);
     1479    if (!child.hasSelfPaintingLayer() && !child.isFloating()) {
     1480        if (paintType == PaintAsInlineBlock)
     1481            child.paintAsInlineBlock(paintInfoForChild, childPoint);
     1482        else
     1483            child.paint(paintInfoForChild, childPoint);
     1484    }
    14811485
    14821486    // Check for page-break-after: always, and if it's set, break and bail.
     
    14911495    return true;
    14921496}
    1493 
    14941497
    14951498void RenderBlock::paintCaret(PaintInfo& paintInfo, const LayoutPoint& paintOffset, CaretType type)
  • trunk/Source/WebCore/rendering/RenderBlock.h

    r181500 r181691  
    326326    virtual void paintObject(PaintInfo&, const LayoutPoint&) override;
    327327    virtual void paintChildren(PaintInfo& forSelf, const LayoutPoint&, PaintInfo& forChild, bool usePrintRect);
    328     bool paintChild(RenderBox&, PaintInfo& forSelf, const LayoutPoint&, PaintInfo& forChild, bool usePrintRect);
     328    enum PaintBlockType { PaintAsBlock, PaintAsInlineBlock };
     329    bool paintChild(RenderBox&, PaintInfo& forSelf, const LayoutPoint&, PaintInfo& forChild, bool usePrintRect, PaintBlockType paintType = PaintAsBlock);
    329330   
    330331    LayoutUnit logicalRightOffsetForLine(LayoutUnit logicalTop, LayoutUnit fixedOffset, bool applyTextIndent, LayoutUnit logicalHeight = 0) const
  • trunk/Source/WebCore/rendering/RenderElement.cpp

    r181654 r181691  
    11651165}
    11661166
     1167static inline void paintPhase(RenderElement& element, PaintPhase phase, PaintInfo& paintInfo, const LayoutPoint& childPoint)
     1168{
     1169    paintInfo.phase = phase;
     1170    element.paint(paintInfo, childPoint);
     1171}
     1172
     1173void RenderElement::paintAsInlineBlock(PaintInfo& paintInfo, const LayoutPoint& childPoint)
     1174{
     1175    // Paint all phases atomically, as though the element established its own stacking context.
     1176    // (See Appendix E.2, section 6.4 on inline block/table/replaced elements in the CSS2.1 specification.)
     1177    // This is also used by other elements (e.g. flex items and grid items).
     1178    if (paintInfo.phase == PaintPhaseSelection) {
     1179        paint(paintInfo, childPoint);
     1180    } else if (paintInfo.phase == PaintPhaseForeground) {
     1181        paintPhase(*this, PaintPhaseBlockBackground, paintInfo, childPoint);
     1182        paintPhase(*this, PaintPhaseChildBlockBackgrounds, paintInfo, childPoint);
     1183        paintPhase(*this, PaintPhaseFloat, paintInfo, childPoint);
     1184        paintPhase(*this, PaintPhaseForeground, paintInfo, childPoint);
     1185        paintPhase(*this, PaintPhaseOutline, paintInfo, childPoint);
     1186
     1187        // Reset |paintInfo| to the original phase.
     1188        paintInfo.phase = PaintPhaseForeground;
     1189    }
     1190}
     1191
    11671192void RenderElement::layout()
    11681193{
  • trunk/Source/WebCore/rendering/RenderElement.h

    r181654 r181691  
    119119    virtual void paint(PaintInfo&, const LayoutPoint&) = 0;
    120120
     121    // inline-block elements paint all phases atomically. This function ensures that. Certain other elements
     122    // (grid items, flex items) require this behavior as well, and this function exists as a helper for them.
     123    // It is expected that the caller will call this function independent of the value of paintInfo.phase.
     124    void paintAsInlineBlock(PaintInfo&, const LayoutPoint&);
     125
    121126    // Recursive function that computes the size and position of this object and all its descendants.
    122127    virtual void layout();
  • trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp

    r181398 r181691  
    334334{
    335335    for (RenderBox* child = m_orderIterator.first(); child; child = m_orderIterator.next()) {
    336         if (!paintChild(*child, paintInfo, paintOffset, paintInfoForChild, usePrintRect))
     336        if (!paintChild(*child, paintInfo, paintOffset, paintInfoForChild, usePrintRect, PaintAsInlineBlock))
    337337            return;
    338338    }
  • trunk/Source/WebCore/rendering/RenderGrid.cpp

    r181141 r181691  
    10671067{
    10681068    for (RenderBox* child = m_orderIterator.first(); child; child = m_orderIterator.next())
    1069         paintChild(*child, paintInfo, paintOffset, forChild, usePrintRect);
     1069        paintChild(*child, paintInfo, paintOffset, forChild, usePrintRect, PaintAsInlineBlock);
    10701070}
    10711071
Note: See TracChangeset for help on using the changeset viewer.