Changeset 145588 in webkit


Ignore:
Timestamp:
Mar 12, 2013 2:53:19 PM (11 years ago)
Author:
commit-queue@webkit.org
Message:

Mac: Incorrect rendering of <audio> controls
​https://bugs.webkit.org/show_bug.cgi?id=110913

Patch by Christian Biesinger <​cbiesinger@chromium.org> on 2013-03-12
Reviewed by Tony Chang.

Source/WebCore:

Covered by existing tests under media/.

  • css/mediaControls.css:

(audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container):
(audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline):
The timeline container and the timeline need min-width: 0 so that they can shrink if needed.

  • css/mediaControlsQuickTime.css:

(audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container):
(audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display):
(audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display):
The timeline container also needs flex-start to ensure that it never overlaps
the play/rewind buttons. The current-time and remaining-time displays need min-width: 0 so that the hack
in RenderMediaControls.cpp works correctly - otherwise, RenderFlexibleBox tries to use the preferred width
of the time displays, which is wrong when they try to hide themselves.

LayoutTests:

  • platform/mac/media/audio-controls-rendering-expected.txt:
  • platform/mac/media/controls-after-reload-expected.txt:
  • platform/mac/media/controls-strict-expected.txt:
  • platform/mac/media/controls-styling-strict-expected.txt:
  • platform/mac/media/controls-without-preload-expected.txt:
  • platform/mac/media/video-controls-rendering-expected.txt:
  • platform/mac/media/video-display-toggle-expected.txt:
  • platform/mac/media/video-no-audio-expected.txt:
  • platform/mac/media/video-playing-and-pause-expected.txt:
Location:
trunk
Files:
13 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r145577 r145588  
     12013-03-12  Christian Biesinger  <cbiesinger@chromium.org>
     2
     3        Mac: Incorrect rendering of <audio> controls
     4        https://bugs.webkit.org/show_bug.cgi?id=110913
     5
     6        Reviewed by Tony Chang.
     7
     8        * platform/mac/media/audio-controls-rendering-expected.txt:
     9        * platform/mac/media/controls-after-reload-expected.txt:
     10        * platform/mac/media/controls-strict-expected.txt:
     11        * platform/mac/media/controls-styling-strict-expected.txt:
     12        * platform/mac/media/controls-without-preload-expected.txt:
     13        * platform/mac/media/video-controls-rendering-expected.txt:
     14        * platform/mac/media/video-display-toggle-expected.txt:
     15        * platform/mac/media/video-no-audio-expected.txt:
     16        * platform/mac/media/video-playing-and-pause-expected.txt:
     17
    1182013-03-12  Ryosuke Niwa  <rniwa@webkit.org>
    219

  • trunk/LayoutTests/platform/mac/media/audio-controls-rendering-expected.txt

    r142947 r145588  
    2121    RenderButton {INPUT} at (6,3) size 18x18
    2222    RenderButton {INPUT} at (32,4) size 16x17
    23     RenderFlexibleBox {DIV} at (49,5) size 219x15
    24       RenderSlider {INPUT} at (45,2) size 129x13
    25         RenderFlexibleBox {DIV} at (0,0) size 129x13
    26           RenderBlock {DIV} at (0,2) size 129x9
     23    RenderFlexibleBox {DIV} at (49,5) size 126x15
     24      RenderSlider {INPUT} at (0,2) size 126x13
     25        RenderFlexibleBox {DIV} at (0,0) size 126x13
     26          RenderBlock {DIV} at (0,2) size 126x9
    2727            RenderBlock {DIV} at (0,0) size 10x8
    28     RenderBlock {DIV} at (268,6) size 25x13
    29 layer at (57,49) size 45x11
    30   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    31     RenderBlock (anonymous) at (9,0) size 27x11
    32       RenderText {#text} at (0,0) size 26x11
    33         text run at (0,0) width 26: "00:00"
    34 layer at (231,49) size 45x11
    35   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    36     RenderBlock (anonymous) at (7,0) size 31x11
    37       RenderText {#text} at (0,0) size 31x11
    38         text run at (0,0) width 31: "-00:07"
    39 layer at (278,49) size 14x12
     28    RenderBlock {DIV} at (175,6) size 25x13
     29layer at (185,49) size 14x12
    4030  RenderButton zI: 1 {INPUT} at (2,0) size 14x12
    4131layer at (8,85) size 320x25
    … …  
    4636    RenderButton {INPUT} at (32,4) size 16x17
    4737    RenderFlexibleBox {DIV} at (49,5) size 246x15
    48       RenderSlider {INPUT} at (45,2) size 156x13
    49         RenderFlexibleBox {DIV} at (0,0) size 156x13
    50           RenderBlock {DIV} at (0,2) size 156x9
     38      RenderSlider {INPUT} at (0,2) size 246x13
     39        RenderFlexibleBox {DIV} at (0,0) size 246x13
     40          RenderBlock {DIV} at (0,2) size 246x9
    5141            RenderBlock {DIV} at (0,0) size 10x8
    5242    RenderBlock {DIV} at (295,6) size 25x13
    53 layer at (57,92) size 45x11
    54   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    55     RenderBlock (anonymous) at (9,0) size 27x11
    56       RenderText {#text} at (0,0) size 26x11
    57         text run at (0,0) width 26: "00:00"
    58 layer at (258,92) size 45x11
    59   RenderFlexibleBox {DIV} at (201,2) size 45x11 [color=#FFFFFF]
    60     RenderBlock (anonymous) at (7,0) size 31x11
    61       RenderText {#text} at (0,0) size 31x11
    62         text run at (0,0) width 31: "-00:07"
    6343layer at (305,92) size 14x12
    6444  RenderButton zI: 1 {INPUT} at (2,0) size 14x12
    … …  
    7252    RenderButton {INPUT} at (32,4) size 16x17
    7353    RenderFlexibleBox {DIV} at (49,5) size 246x15
    74       RenderSlider {INPUT} at (45,2) size 156x13
    75         RenderFlexibleBox {DIV} at (0,0) size 156x13
    76           RenderBlock {DIV} at (0,2) size 156x9
     54      RenderSlider {INPUT} at (0,2) size 246x13
     55        RenderFlexibleBox {DIV} at (0,0) size 246x13
     56          RenderBlock {DIV} at (0,2) size 246x9
    7757            RenderBlock {DIV} at (0,0) size 10x8
    7858    RenderBlock {DIV} at (295,6) size 25x13
    79 layer at (57,210) size 45x11
    80   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    81     RenderBlock (anonymous) at (9,0) size 27x11
    82       RenderText {#text} at (0,0) size 26x11
    83         text run at (0,0) width 26: "00:00"
    84 layer at (258,210) size 45x11
    85   RenderFlexibleBox {DIV} at (201,2) size 45x11 [color=#FFFFFF]
    86     RenderBlock (anonymous) at (7,0) size 31x11
    87       RenderText {#text} at (0,0) size 31x11
    88         text run at (0,0) width 31: "-00:07"
    8959layer at (305,210) size 14x12
    9060  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/LayoutTests/platform/mac/media/controls-after-reload-expected.txt

    r142947 r145588  
    1717    RenderButton {INPUT} at (6,3) size 18x18
    1818    RenderButton {INPUT} at (32,4) size 16x17
    19     RenderFlexibleBox {DIV} at (49,5) size 219x15
    20       RenderSlider {INPUT} at (45,2) size 129x13
    21         RenderFlexibleBox {DIV} at (0,0) size 129x13
    22           RenderBlock {DIV} at (0,2) size 129x9
     19    RenderFlexibleBox {DIV} at (49,5) size 216x15
     20      RenderSlider {INPUT} at (0,2) size 216x13
     21        RenderFlexibleBox {DIV} at (0,0) size 216x13
     22          RenderBlock {DIV} at (0,2) size 216x9
    2323            RenderBlock {DIV} at (0,0) size 10x8
    24     RenderButton {INPUT} at (300,4) size 16x17
    25     RenderBlock {DIV} at (268,6) size 25x13
    26 layer at (57,264) size 45x11
    27   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    28     RenderBlock (anonymous) at (9,0) size 27x11
    29       RenderText {#text} at (0,0) size 26x11
    30         text run at (0,0) width 26: "00:00"
    31 layer at (231,264) size 45x11
    32   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    33     RenderBlock (anonymous) at (7,0) size 31x11
    34       RenderText {#text} at (0,0) size 31x11
    35         text run at (0,0) width 31: "-00:06"
    36 layer at (278,264) size 14x12
     24    RenderButton {INPUT} at (297,4) size 16x17
     25    RenderBlock {DIV} at (265,6) size 25x13
     26layer at (275,264) size 14x12
    3727  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/LayoutTests/platform/mac/media/controls-strict-expected.txt

    r142947 r145588  
    1717    RenderButton {INPUT} at (6,3) size 18x18
    1818    RenderButton {INPUT} at (32,4) size 16x17
    19     RenderFlexibleBox {DIV} at (49,5) size 219x15
    20       RenderSlider {INPUT} at (45,2) size 129x13
    21         RenderFlexibleBox {DIV} at (0,0) size 129x13
    22           RenderBlock {DIV} at (0,2) size 129x9
     19    RenderFlexibleBox {DIV} at (49,5) size 216x15
     20      RenderSlider {INPUT} at (0,2) size 216x13
     21        RenderFlexibleBox {DIV} at (0,0) size 216x13
     22          RenderBlock {DIV} at (0,2) size 216x9
    2323            RenderBlock {DIV} at (0,0) size 10x8
    24     RenderButton {INPUT} at (300,4) size 16x17
    25     RenderBlock {DIV} at (268,6) size 25x13
    26 layer at (57,272) size 45x11
    27   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    28     RenderBlock (anonymous) at (9,0) size 27x11
    29       RenderText {#text} at (0,0) size 26x11
    30         text run at (0,0) width 26: "00:00"
    31 layer at (231,272) size 45x11
    32   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    33     RenderBlock (anonymous) at (7,0) size 31x11
    34       RenderText {#text} at (0,0) size 31x11
    35         text run at (0,0) width 31: "-00:06"
    36 layer at (278,272) size 14x12
     24    RenderButton {INPUT} at (297,4) size 16x17
     25    RenderBlock {DIV} at (265,6) size 25x13
     26layer at (275,272) size 14x12
    3727  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/LayoutTests/platform/mac/media/controls-styling-strict-expected.txt

    r142947 r145588  
    2121    RenderButton {INPUT} at (6,3) size 18x18
    2222    RenderButton {INPUT} at (32,4) size 16x17
    23     RenderFlexibleBox {DIV} at (49,5) size 219x15
    24       RenderSlider {INPUT} at (45,2) size 129x13
    25         RenderFlexibleBox {DIV} at (0,0) size 129x13
    26           RenderBlock {DIV} at (0,2) size 129x9
     23    RenderFlexibleBox {DIV} at (49,5) size 216x15
     24      RenderSlider {INPUT} at (0,2) size 216x13
     25        RenderFlexibleBox {DIV} at (0,0) size 216x13
     26          RenderBlock {DIV} at (0,2) size 216x9
    2727            RenderBlock {DIV} at (0,0) size 10x8
    28     RenderButton {INPUT} at (300,4) size 16x17
    29     RenderBlock {DIV} at (268,6) size 25x13
    30 layer at (57,272) size 45x11
    31   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    32     RenderBlock (anonymous) at (9,0) size 27x11
    33       RenderText {#text} at (0,0) size 26x11
    34         text run at (0,0) width 26: "00:00"
    35 layer at (231,272) size 45x11
    36   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    37     RenderBlock (anonymous) at (7,0) size 31x11
    38       RenderText {#text} at (0,0) size 31x11
    39         text run at (0,0) width 31: "-00:06"
    40 layer at (278,272) size 14x12
     28    RenderButton {INPUT} at (297,4) size 16x17
     29    RenderBlock {DIV} at (265,6) size 25x13
     30layer at (275,272) size 14x12
    4131  RenderButton zI: 1 {INPUT} at (2,0) size 14x12
    4232layer at (332,50) size 320x240
    … …  
    4636    RenderButton {INPUT} at (6,3) size 18x18
    4737    RenderButton {INPUT} at (32,4) size 16x17
    48     RenderFlexibleBox {DIV} at (49,5) size 219x15
    49       RenderSlider {INPUT} at (45,2) size 129x13
    50         RenderFlexibleBox {DIV} at (0,0) size 129x13
    51           RenderBlock {DIV} at (0,2) size 129x9
     38    RenderFlexibleBox {DIV} at (49,5) size 216x15
     39      RenderSlider {INPUT} at (0,2) size 216x13
     40        RenderFlexibleBox {DIV} at (0,0) size 216x13
     41          RenderBlock {DIV} at (0,2) size 216x9
    5242            RenderBlock {DIV} at (0,0) size 10x8
    53     RenderButton {INPUT} at (300,4) size 16x17
    54     RenderBlock {DIV} at (268,6) size 25x13
    55 layer at (381,272) size 45x11
    56   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    57     RenderBlock (anonymous) at (9,0) size 27x11
    58       RenderText {#text} at (0,0) size 26x11
    59         text run at (0,0) width 26: "00:00"
    60 layer at (555,272) size 45x11
    61   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    62     RenderBlock (anonymous) at (7,0) size 31x11
    63       RenderText {#text} at (0,0) size 31x11
    64         text run at (0,0) width 31: "-00:06"
    65 layer at (602,272) size 14x12
     43    RenderButton {INPUT} at (297,4) size 16x17
     44    RenderBlock {DIV} at (265,6) size 25x13
     45layer at (599,272) size 14x12
    6646  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/LayoutTests/platform/mac/media/controls-without-preload-expected.txt

    r142947 r145588  
    1717    RenderButton {INPUT} at (6,3) size 18x18
    1818    RenderButton {INPUT} at (32,4) size 16x17
    19     RenderFlexibleBox {DIV} at (49,5) size 219x15
    20       RenderSlider {INPUT} at (45,2) size 129x13
    21         RenderFlexibleBox {DIV} at (0,0) size 129x13
    22           RenderBlock {DIV} at (0,2) size 129x9
     19    RenderFlexibleBox {DIV} at (49,5) size 216x15
     20      RenderSlider {INPUT} at (0,2) size 216x13
     21        RenderFlexibleBox {DIV} at (0,0) size 216x13
     22          RenderBlock {DIV} at (0,2) size 216x9
    2323            RenderBlock {DIV} at (0,0) size 10x8
    24     RenderButton {INPUT} at (300,4) size 16x17
    25     RenderBlock {DIV} at (268,6) size 25x13
    26 layer at (57,264) size 45x11
    27   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    28     RenderBlock (anonymous) at (9,0) size 27x11
    29       RenderText {#text} at (0,0) size 26x11
    30         text run at (0,0) width 26: "00:00"
    31 layer at (231,264) size 45x11
    32   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    33     RenderBlock (anonymous) at (7,0) size 31x11
    34       RenderText {#text} at (0,0) size 31x11
    35         text run at (0,0) width 31: "-00:06"
    36 layer at (278,264) size 14x12
     24    RenderButton {INPUT} at (297,4) size 16x17
     25    RenderBlock {DIV} at (265,6) size 25x13
     26layer at (275,264) size 14x12
    3727  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/LayoutTests/platform/mac/media/video-controls-rendering-expected.txt

    r142947 r145588  
    2222    RenderButton {INPUT} at (6,3) size 18x18
    2323    RenderButton {INPUT} at (32,4) size 16x17
    24     RenderFlexibleBox {DIV} at (49,5) size 219x15
    25       RenderSlider {INPUT} at (45,2) size 129x13
    26         RenderFlexibleBox {DIV} at (0,0) size 129x13
    27           RenderBlock {DIV} at (0,2) size 129x9
     24    RenderFlexibleBox {DIV} at (49,5) size 216x15
     25      RenderSlider {INPUT} at (0,2) size 216x13
     26        RenderFlexibleBox {DIV} at (0,0) size 216x13
     27          RenderBlock {DIV} at (0,2) size 216x9
    2828            RenderBlock {DIV} at (0,0) size 10x8
    29     RenderButton {INPUT} at (300,4) size 16x17
    30     RenderBlock {DIV} at (268,6) size 25x13
    31 layer at (57,264) size 45x11
    32   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    33     RenderBlock (anonymous) at (9,0) size 27x11
    34       RenderText {#text} at (0,0) size 26x11
    35         text run at (0,0) width 26: "00:00"
    36 layer at (231,264) size 45x11
    37   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    38     RenderBlock (anonymous) at (7,0) size 31x11
    39       RenderText {#text} at (0,0) size 31x11
    40         text run at (0,0) width 31: "-00:06"
    41 layer at (278,264) size 14x12
     29    RenderButton {INPUT} at (297,4) size 16x17
     30    RenderBlock {DIV} at (265,6) size 25x13
     31layer at (275,264) size 14x12
    4232  RenderButton zI: 1 {INPUT} at (2,0) size 14x12
    4333layer at (8,282) size 320x240
    … …  
    4737    RenderButton {INPUT} at (6,3) size 18x18
    4838    RenderButton {INPUT} at (32,4) size 16x17
    49     RenderFlexibleBox {DIV} at (49,5) size 219x15
    50       RenderSlider {INPUT} at (45,2) size 129x13
    51         RenderFlexibleBox {DIV} at (0,0) size 129x13
    52           RenderBlock {DIV} at (0,2) size 129x9
     39    RenderFlexibleBox {DIV} at (49,5) size 216x15
     40      RenderSlider {INPUT} at (0,2) size 216x13
     41        RenderFlexibleBox {DIV} at (0,0) size 216x13
     42          RenderBlock {DIV} at (0,2) size 216x9
    5343            RenderBlock {DIV} at (0,0) size 10x8
    54     RenderButton {INPUT} at (300,4) size 16x17
    55     RenderBlock {DIV} at (268,6) size 25x13
    56 layer at (57,504) size 45x11
    57   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    58     RenderBlock (anonymous) at (9,0) size 27x11
    59       RenderText {#text} at (0,0) size 26x11
    60         text run at (0,0) width 26: "00:00"
    61 layer at (231,504) size 45x11
    62   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    63     RenderBlock (anonymous) at (7,0) size 31x11
    64       RenderText {#text} at (0,0) size 31x11
    65         text run at (0,0) width 31: "-00:06"
    66 layer at (278,504) size 14x12
     44    RenderButton {INPUT} at (297,4) size 16x17
     45    RenderBlock {DIV} at (265,6) size 25x13
     46layer at (275,504) size 14x12
    6747  RenderButton zI: 1 {INPUT} at (2,0) size 14x12
    6848layer at (8,522) size 320x240
    … …  
    7454    RenderButton {INPUT} at (6,3) size 18x18
    7555    RenderButton {INPUT} at (32,4) size 16x17
    76     RenderFlexibleBox {DIV} at (49,5) size 219x15
    77       RenderSlider {INPUT} at (45,2) size 129x13
    78         RenderFlexibleBox {DIV} at (0,0) size 129x13
    79           RenderBlock {DIV} at (0,2) size 129x9
     56    RenderFlexibleBox {DIV} at (49,5) size 216x15
     57      RenderSlider {INPUT} at (0,2) size 216x13
     58        RenderFlexibleBox {DIV} at (0,0) size 216x13
     59          RenderBlock {DIV} at (0,2) size 216x9
    8060            RenderBlock {DIV} at (0,0) size 10x8
    81     RenderButton {INPUT} at (300,4) size 16x17
    82     RenderBlock {DIV} at (268,6) size 25x13
    83 layer at (57,744) size 45x11
    84   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    85     RenderBlock (anonymous) at (9,0) size 27x11
    86       RenderText {#text} at (0,0) size 26x11
    87         text run at (0,0) width 26: "00:00"
    88 layer at (231,744) size 45x11
    89   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    90     RenderBlock (anonymous) at (7,0) size 31x11
    91       RenderText {#text} at (0,0) size 31x11
    92         text run at (0,0) width 31: "-00:06"
    93 layer at (278,744) size 14x12
     61    RenderButton {INPUT} at (297,4) size 16x17
     62    RenderBlock {DIV} at (265,6) size 25x13
     63layer at (275,744) size 14x12
    9464  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/LayoutTests/platform/mac/media/video-display-toggle-expected.txt

    r142947 r145588  
    1616    RenderButton {INPUT} at (6,3) size 18x18
    1717    RenderButton {INPUT} at (32,4) size 16x17
    18     RenderFlexibleBox {DIV} at (49,5) size 219x15
    19       RenderSlider {INPUT} at (45,2) size 129x13
    20         RenderFlexibleBox {DIV} at (0,0) size 129x13
    21           RenderBlock {DIV} at (0,2) size 129x9
     18    RenderFlexibleBox {DIV} at (49,5) size 216x15
     19      RenderSlider {INPUT} at (0,2) size 216x13
     20        RenderFlexibleBox {DIV} at (0,0) size 216x13
     21          RenderBlock {DIV} at (0,2) size 216x9
    2222            RenderBlock {DIV} at (0,0) size 10x8
    23     RenderButton {INPUT} at (300,4) size 16x17
    24     RenderBlock {DIV} at (268,6) size 25x13
    25 layer at (57,248) size 45x11
    26   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    27     RenderBlock (anonymous) at (9,0) size 27x11
    28       RenderText {#text} at (0,0) size 26x11
    29         text run at (0,0) width 26: "00:00"
    30 layer at (231,248) size 45x11
    31   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    32     RenderBlock (anonymous) at (7,0) size 31x11
    33       RenderText {#text} at (0,0) size 31x11
    34         text run at (0,0) width 31: "-00:06"
    35 layer at (278,248) size 14x12
     23    RenderButton {INPUT} at (297,4) size 16x17
     24    RenderBlock {DIV} at (265,6) size 25x13
     25layer at (275,248) size 14x12
    3626  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/LayoutTests/platform/mac/media/video-no-audio-expected.txt

    r142947 r145588  
    1818    RenderButton {INPUT} at (32,4) size 16x17
    1919    RenderFlexibleBox {DIV} at (49,5) size 273x15
    20       RenderSlider {INPUT} at (45,2) size 183x13
    21         RenderFlexibleBox {DIV} at (0,0) size 183x13
    22           RenderBlock {DIV} at (0,2) size 183x9
     20      RenderSlider {INPUT} at (0,2) size 273x13
     21        RenderFlexibleBox {DIV} at (0,0) size 273x13
     22          RenderBlock {DIV} at (0,2) size 273x9
    2323            RenderBlock {DIV} at (0,0) size 10x8
    2424    RenderButton {INPUT} at (329,4) size 16x17
    2525    RenderBlock {DIV} at (322,12) size 0x1
    26 layer at (57,312) size 45x11
    27   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    28     RenderBlock (anonymous) at (9,0) size 27x11
    29       RenderText {#text} at (0,0) size 26x11
    30         text run at (0,0) width 26: "00:00"
    31 layer at (285,312) size 45x11
    32   RenderFlexibleBox {DIV} at (228,2) size 45x11 [color=#FFFFFF]
    33     RenderBlock (anonymous) at (7,0) size 31x11
    34       RenderText {#text} at (0,0) size 31x11
    35         text run at (0,0) width 31: "-00:09"

  • trunk/LayoutTests/platform/mac/media/video-playing-and-pause-expected.txt

    r142947 r145588  
    1818    RenderButton {INPUT} at (6,3) size 18x18
    1919    RenderButton {INPUT} at (32,4) size 16x17
    20     RenderFlexibleBox {DIV} at (49,5) size 219x15
    21       RenderSlider {INPUT} at (45,2) size 129x13
    22         RenderFlexibleBox {DIV} at (0,0) size 129x13
    23           RenderBlock {DIV} at (0,2) size 129x9
     20    RenderFlexibleBox {DIV} at (49,5) size 216x15
     21      RenderSlider {INPUT} at (0,2) size 216x13
     22        RenderFlexibleBox {DIV} at (0,0) size 216x13
     23          RenderBlock {DIV} at (0,2) size 216x9
    2424            RenderBlock {DIV} at (0,0) size 10x8
    25     RenderButton {INPUT} at (300,4) size 16x17
    26     RenderBlock {DIV} at (268,6) size 25x13
    27 layer at (57,290) size 45x11
    28   RenderFlexibleBox {DIV} at (0,2) size 45x11 [color=#FFFFFF]
    29     RenderBlock (anonymous) at (9,0) size 27x11
    30       RenderText {#text} at (0,0) size 26x11
    31         text run at (0,0) width 26: "00:00"
    32 layer at (231,290) size 45x11
    33   RenderFlexibleBox {DIV} at (174,2) size 45x11 [color=#FFFFFF]
    34     RenderBlock (anonymous) at (7,0) size 31x11
    35       RenderText {#text} at (0,0) size 31x11
    36         text run at (0,0) width 31: "-00:06"
    37 layer at (278,290) size 14x12
     25    RenderButton {INPUT} at (297,4) size 16x17
     26    RenderBlock {DIV} at (265,6) size 25x13
     27layer at (275,290) size 14x12
    3828  RenderButton zI: 1 {INPUT} at (2,0) size 14x12

  • trunk/Source/WebCore/ChangeLog

    r145581 r145588  
     12013-03-12  Christian Biesinger  <cbiesinger@chromium.org>
     2
     3        Mac: Incorrect rendering of <audio> controls
     4        https://bugs.webkit.org/show_bug.cgi?id=110913
     5
     6        Reviewed by Tony Chang.
     7
     8        Covered by existing tests under media/.
     9
     10        * css/mediaControls.css:
     11        (audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container):
     12        (audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline):
     13        The timeline container and the timeline need min-width: 0 so that they can shrink if needed.
     14        * css/mediaControlsQuickTime.css:
     15        (audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container):
     16        (audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display):
     17        (audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display):
     18        The timeline container also needs flex-start to ensure that it never overlaps
     19        the play/rewind buttons. The current-time and remaining-time displays need min-width: 0 so that the hack
     20        in RenderMediaControls.cpp works correctly - otherwise, RenderFlexibleBox tries to use the preferred width
     21        of the time displays, which is wrong when they try to hide themselves.
     22
    1232013-03-12  Alexey Proskuryakov  <ap@apple.com>
    224

  • trunk/Source/WebCore/css/mediaControls.css

    r145397 r145588  
    105105    -webkit-user-select: none;
    106106    height: 16px;
     107    min-width: 0;
    107108}
    108109
    … …  
    125126    color: inherit;
    126127    margin: initial;
     128    min-width: 0;
    127129}
    128130

  • trunk/Source/WebCore/css/mediaControlsQuickTime.css

    r142947 r145588  
    6666    -webkit-flex-direction: row;
    6767    -webkit-align-items: center;
    68     -webkit-justify-content: center;
     68    -webkit-justify-content: flex-start;
    6969    -webkit-flex: 1 1;
    7070    text-align: right;
    … …  
    8383    overflow: hidden;
    8484    width: 45px;
     85    min-width: 0; /* needed due to flexbox */
    8586    color: white;
    8687    text-shadow: black 0px 1px 1px;
    … …  
    105106    overflow: hidden;
    106107    width: 45px;
     108    min-width: 0; /* needed due to flexbox */
    107109    color: white;
    108110    text-shadow: black 0px 1px 1px;
Note: See TracChangeset for help on using the changeset viewer.