Skip to content
Permalink
Browse files
[css-ui] Remove media-play-button and media-volume-slider-mute appear…
…ance values

https://bugs.webkit.org/show_bug.cgi?id=240760

Reviewed by Antti Koivisto.

These are unimplemented/no-op on all platforms.

* LayoutTests/fast/css-generated-content/empty-first-letter-with-columns-crash.html:
* LayoutTests/fast/multicol/readjust-first-child-on-attach.html:
Stop using these appearance values in crashtests.

* LayoutTests/imported/blink/fast/css-generated-content/empty-first-letter-with-columns-crash.html: Removed.
Remove duplicate test.

* LayoutTests/imported/blink/media/video-webkit-appearance-expected.html: Removed.
* LayoutTests/imported/blink/media/video-webkit-appearance.html: Removed.
Remove no longer relevant crashtest.

* LayoutTests/imported/w3c/web-platform-tests/css/css-ui/appearance-cssom-001-expected.txt:
* LayoutTests/platform/gtk/imported/w3c/web-platform-tests/css/css-ui/appearance-cssom-001-expected.txt:
Marked subtests as passing.

* Source/WebCore/css/CSSPrimitiveValueMappings.h:
(WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
* Source/WebCore/css/CSSProperties.json:
* Source/WebCore/css/CSSValueKeywords.in:
* Source/WebCore/css/mediaControls.css:
Clean up stylesheet and stop using unsupported appearance values.
(:is(audio, video)::-webkit-media-controls-panel):
(video:-webkit-full-page-media):
(:is(audio, video)::-webkit-media-controls-mute-button,):
(:is(audio, video)::-webkit-media-controls-overlay-play-button):
(:is(audio, video)::-webkit-media-controls-timeline-container):
(:is(audio, video)::-webkit-media-controls-current-time-display,):
(:is(audio, video)::-webkit-media-controls-timeline):
(:is(audio, video)::-webkit-media-controls-volume-slider):
(:is(audio, video)::-webkit-media-controls-seek-back-button,):
(:is(audio, video)::-webkit-media-controls-rewind-button,):
(:is(audio, video)::-webkit-media-controls-closed-captions-container,):
(:is(audio, video)::-webkit-media-controls-volume-slider-mute-button):
(audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel): Deleted.
(audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-button): Deleted.
(audio::-webkit-media-controls-overlay-play-button, video::-webkit-media-controls-overlay-play-button): Deleted.
(audio::-webkit-media-controls-play-button, video::-webkit-media-controls-play-button): Deleted.
(audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container): Deleted.
(audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display): Deleted.
(audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display): Deleted.
(audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline): Deleted.
(audio::-webkit-media-controls-volume-slider, video::-webkit-media-controls-volume-slider): Deleted.
(audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button): Deleted.
(audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button): Deleted.
(audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button): Deleted.
(audio::-webkit-media-controls-rewind-button, video::-webkit-media-controls-rewind-button): Deleted.
(audio::-webkit-media-controls-return-to-realtime-button, video::-webkit-media-controls-return-to-realtime-button): Deleted.
(audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button): Deleted.
(audio::-webkit-media-controls-closed-captions-container, video::-webkit-media-controls-closed-captions-container): Deleted.
(audio::-webkit-media-controls-closed-captions-track-list, video::-webkit-media-controls-closed-captions-track-list): Deleted.
(audio::-webkit-media-controls-volume-slider-mute-button, video::-webkit-media-controls-volume-slider-mute-button): Deleted.
(audio::-webkit-media-controls-fullscreen-volume-slider, video::-webkit-media-controls-fullscreen-volume-slider): Deleted.
(audio::-webkit-media-controls-fullscreen-volume-min-button, video::-webkit-media-controls-fullscreen-volume-min-button): Deleted.
(audio::-webkit-media-controls-fullscreen-volume-max-button, video::-webkit-media-controls-fullscreen-volume-max-button): Deleted.
* Source/WebCore/platform/ThemeTypes.cpp:
(WebCore::operator<<):
* Source/WebCore/platform/ThemeTypes.h:
* Source/WebCore/rendering/RenderTheme.cpp:
(WebCore::RenderTheme::adjustStyle):
(WebCore::RenderTheme::paint):
(WebCore::RenderTheme::adjustMediaControlStyle const): Deleted.
* Source/WebCore/rendering/RenderTheme.h:
(WebCore::RenderTheme::paintMediaPlayButton): Deleted.
(WebCore::RenderTheme::paintMediaMuteButton): Deleted.
* Source/WebInspectorUI/UserInterface/External/CSSDocumentation/CSSDocumentation-overrides.json:
* Source/WebInspectorUI/UserInterface/External/CSSDocumentation/CSSDocumentation.js:

Canonical link: https://commits.webkit.org/250855@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@294629 268f45cc-cd09-0410-ab3c-d52691b4dbfc
  • Loading branch information
nt1m committed May 23, 2022
1 parent 91439ea commit b143b0e5c6096227426284a5dc9dec87bb8e846d
Showing 17 changed files with 33 additions and 181 deletions.
@@ -1,6 +1,6 @@
<!DOCTYPE html>
<style>
.slider { -webkit-appearance: media-volume-slider-mute-button; }
.slider { -webkit-appearance: slider-horizontal; }
*:first-letter { pointer-events: fill; }
</style>
<body style="-webkit-column-count: 2">
@@ -1,7 +1,6 @@
<style>
ruby {
columns: 1px;
-webkit-appearance: media-play-button;
}
ruby::before {
display: block;

This file was deleted.

This file was deleted.

This file was deleted.

@@ -51,7 +51,7 @@ FAIL -webkit-appearance: media-fullscreen-volume-slider (invalid) assert_equals:
FAIL -webkit-appearance: media-fullscreen-volume-slider-thumb (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-fullscreen-volume-slider-thumb"
PASS -webkit-appearance: media-mute-button (invalid)
PASS -webkit-appearance: media-overlay-play-button (invalid)
FAIL -webkit-appearance: media-play-button (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-play-button"
PASS -webkit-appearance: media-play-button (invalid)
PASS -webkit-appearance: media-return-to-realtime-button (invalid)
PASS -webkit-appearance: media-rewind-button (invalid)
PASS -webkit-appearance: media-seek-back-button (invalid)
@@ -62,7 +62,7 @@ PASS -webkit-appearance: media-time-remaining-display (invalid)
PASS -webkit-appearance: media-toggle-closed-captions-button (invalid)
FAIL -webkit-appearance: media-volume-slider (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-volume-slider"
PASS -webkit-appearance: media-volume-slider-container (invalid)
FAIL -webkit-appearance: media-volume-slider-mute-button (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-volume-slider-mute-button"
PASS -webkit-appearance: media-volume-slider-mute-button (invalid)
FAIL -webkit-appearance: media-volume-sliderthumb (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-volume-sliderthumb"
PASS -webkit-appearance: menuarrow (invalid)
PASS -webkit-appearance: menubar (invalid)
@@ -214,7 +214,7 @@ FAIL appearance: media-fullscreen-volume-slider (invalid) assert_equals: style.a
FAIL appearance: media-fullscreen-volume-slider-thumb (invalid) assert_equals: style.appearance expected "" but got "media-fullscreen-volume-slider-thumb"
PASS appearance: media-mute-button (invalid)
PASS appearance: media-overlay-play-button (invalid)
FAIL appearance: media-play-button (invalid) assert_equals: style.appearance expected "" but got "media-play-button"
PASS appearance: media-play-button (invalid)
PASS appearance: media-return-to-realtime-button (invalid)
PASS appearance: media-rewind-button (invalid)
PASS appearance: media-seek-back-button (invalid)
@@ -225,7 +225,7 @@ PASS appearance: media-time-remaining-display (invalid)
PASS appearance: media-toggle-closed-captions-button (invalid)
FAIL appearance: media-volume-slider (invalid) assert_equals: style.appearance expected "" but got "media-volume-slider"
PASS appearance: media-volume-slider-container (invalid)
FAIL appearance: media-volume-slider-mute-button (invalid) assert_equals: style.appearance expected "" but got "media-volume-slider-mute-button"
PASS appearance: media-volume-slider-mute-button (invalid)
FAIL appearance: media-volume-sliderthumb (invalid) assert_equals: style.appearance expected "" but got "media-volume-sliderthumb"
PASS appearance: menuarrow (invalid)
PASS appearance: menubar (invalid)
@@ -51,7 +51,7 @@ FAIL -webkit-appearance: media-fullscreen-volume-slider (invalid) assert_equals:
FAIL -webkit-appearance: media-fullscreen-volume-slider-thumb (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-fullscreen-volume-slider-thumb"
PASS -webkit-appearance: media-mute-button (invalid)
PASS -webkit-appearance: media-overlay-play-button (invalid)
FAIL -webkit-appearance: media-play-button (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-play-button"
PASS -webkit-appearance: media-play-button (invalid)
PASS -webkit-appearance: media-return-to-realtime-button (invalid)
PASS -webkit-appearance: media-rewind-button (invalid)
PASS -webkit-appearance: media-seek-back-button (invalid)
@@ -62,7 +62,7 @@ PASS -webkit-appearance: media-time-remaining-display (invalid)
PASS -webkit-appearance: media-toggle-closed-captions-button (invalid)
FAIL -webkit-appearance: media-volume-slider (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-volume-slider"
PASS -webkit-appearance: media-volume-slider-container (invalid)
FAIL -webkit-appearance: media-volume-slider-mute-button (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-volume-slider-mute-button"
PASS -webkit-appearance: media-volume-slider-mute-button (invalid)
FAIL -webkit-appearance: media-volume-sliderthumb (invalid) assert_equals: style.WebkitAppearance (uppercase W) expected "" but got "media-volume-sliderthumb"
PASS -webkit-appearance: menuarrow (invalid)
PASS -webkit-appearance: menubar (invalid)
@@ -214,7 +214,7 @@ FAIL appearance: media-fullscreen-volume-slider (invalid) assert_equals: style.a
FAIL appearance: media-fullscreen-volume-slider-thumb (invalid) assert_equals: style.appearance expected "" but got "media-fullscreen-volume-slider-thumb"
PASS appearance: media-mute-button (invalid)
PASS appearance: media-overlay-play-button (invalid)
FAIL appearance: media-play-button (invalid) assert_equals: style.appearance expected "" but got "media-play-button"
PASS appearance: media-play-button (invalid)
PASS appearance: media-return-to-realtime-button (invalid)
PASS appearance: media-rewind-button (invalid)
PASS appearance: media-seek-back-button (invalid)
@@ -225,7 +225,7 @@ PASS appearance: media-time-remaining-display (invalid)
PASS appearance: media-toggle-closed-captions-button (invalid)
FAIL appearance: media-volume-slider (invalid) assert_equals: style.appearance expected "" but got "media-volume-slider"
PASS appearance: media-volume-slider-container (invalid)
FAIL appearance: media-volume-slider-mute-button (invalid) assert_equals: style.appearance expected "" but got "media-volume-slider-mute-button"
PASS appearance: media-volume-slider-mute-button (invalid)
FAIL appearance: media-volume-sliderthumb (invalid) assert_equals: style.appearance expected "" but got "media-volume-sliderthumb"
PASS appearance: menuarrow (invalid)
PASS appearance: menubar (invalid)
@@ -472,9 +472,6 @@ template<> inline CSSPrimitiveValue::CSSPrimitiveValue(ControlPart e)
case ListboxPart:
m_value.valueID = CSSValueListbox;
break;
case MediaPlayButtonPart:
m_value.valueID = CSSValueMediaPlayButton;
break;
case MediaSliderPart:
m_value.valueID = CSSValueMediaSlider;
break;
@@ -484,9 +481,6 @@ template<> inline CSSPrimitiveValue::CSSPrimitiveValue(ControlPart e)
case MediaVolumeSliderPart:
m_value.valueID = CSSValueMediaVolumeSlider;
break;
case MediaVolumeSliderMuteButtonPart:
m_value.valueID = CSSValueMediaVolumeSliderMuteButton;
break;
case MediaVolumeSliderThumbPart:
m_value.valueID = CSSValueMediaVolumeSliderthumb;
break;
@@ -5170,11 +5170,9 @@
"media-controls-light-bar-background",
"media-fullscreen-volume-slider",
"media-fullscreen-volume-slider-thumb",
"media-play-button",
"media-slider",
"media-sliderthumb",
"media-volume-slider",
"media-volume-slider-mute-button",
"media-volume-sliderthumb",
"menulist",
"menulist-button",
@@ -845,11 +845,9 @@ media-controls-dark-bar-background
media-controls-light-bar-background
media-fullscreen-volume-slider
media-fullscreen-volume-slider-thumb
media-play-button
media-slider
media-sliderthumb
media-volume-slider
media-volume-slider-mute-button
media-volume-sliderthumb
menulist
menulist-button
@@ -41,7 +41,7 @@ audio {
flex-direction: column;
}

audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel {
:is(audio, video)::-webkit-media-controls-panel {
display: flex;
direction: ltr;
flex-direction: row;
@@ -59,18 +59,15 @@ audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel {
video:-webkit-full-page-media {
margin: auto;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
inset: 0;
}

video:-webkit-full-page-media::-webkit-media-controls-panel {
bottom: 0px;
}

audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-button {
-webkit-appearance: media-mute-button;
:is(audio, video)::-webkit-media-controls-mute-button,
:is(audio, video)::-webkit-media-controls-play-button {
display: flex;
width: 16px;
height: 16px;
@@ -79,22 +76,11 @@ audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-bu
color: inherit;
}

audio::-webkit-media-controls-overlay-play-button, video::-webkit-media-controls-overlay-play-button {
:is(audio, video)::-webkit-media-controls-overlay-play-button {
display: none;
}

audio::-webkit-media-controls-play-button, video::-webkit-media-controls-play-button {
-webkit-appearance: media-play-button;
display: flex;
width: 16px;
height: 16px;
background-color: initial;
border: initial;
color: inherit;
}

audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container {
-webkit-appearance: media-controls-background;
:is(audio, video)::-webkit-media-controls-timeline-container {
display: flex;
flex-direction: row;
align-items: center;
@@ -105,15 +91,12 @@ audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-
min-width: 0;
}

audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display {
:is(audio, video)::-webkit-media-controls-current-time-display,
:is(audio, video)::-webkit-media-controls-time-remaining-display {
display: none;
}

audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display {
display: none;
}

audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline {
:is(audio, video)::-webkit-media-controls-timeline {
-webkit-appearance: media-slider;
display: flex;
flex: 1 1;
@@ -126,35 +109,17 @@ audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline {
min-width: 0;
}

audio::-webkit-media-controls-volume-slider, video::-webkit-media-controls-volume-slider {
:is(audio, video)::-webkit-media-controls-volume-slider {
background-color: initial !important;
border: initial !important;
color: inherit !important;
margin: initial !important;
}

audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button {
-webkit-appearance: media-seek-back-button;
display: flex;
width: 16px;
height: 16px;
background-color: initial;
border: initial;
color: inherit;
}

audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button {
-webkit-appearance: media-seek-forward-button;
display: flex;
width: 16px;
height: 16px;
background-color: initial;
border: initial;
color: inherit;
}

audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button {
-webkit-appearance: media-enter-fullscreen-button;
:is(audio, video)::-webkit-media-controls-seek-back-button,
:is(audio, video)::-webkit-media-controls-seek-forward-button,
:is(audio, video)::-webkit-media-controls-fullscreen-button,
:is(audio, video)::-webkit-media-controls-toggle-closed-captions-button {
display: flex;
width: 16px;
height: 16px;
@@ -163,58 +128,29 @@ audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-f
color: inherit;
}

audio::-webkit-media-controls-rewind-button, video::-webkit-media-controls-rewind-button {
:is(audio, video)::-webkit-media-controls-rewind-button,
:is(audio, video)::-webkit-media-controls-return-to-realtime-button {
display: none;
background-color: initial;
border: initial;
color: inherit;
}

audio::-webkit-media-controls-return-to-realtime-button, video::-webkit-media-controls-return-to-realtime-button {
:is(audio, video)::-webkit-media-controls-closed-captions-container,
:is(audio, video)::-webkit-media-controls-closed-captions-track-list,
:is(audio, video)::-webkit-media-controls-fullscreen-volume-slider,
:is(audio, video)::-webkit-media-controls-fullscreen-volume-min-button,
:is(audio, video)::-webkit-media-controls-fullscreen-volume-max-button {
display: none;
background-color: initial;
border: initial;
color: inherit;
}

audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button {
-webkit-appearance: media-toggle-closed-captions-button;
display: flex;
width: 16px;
height: 16px;
background-color: initial;
border: initial;
color: inherit;
}

audio::-webkit-media-controls-closed-captions-container, video::-webkit-media-controls-closed-captions-container {
display: none;
}

audio::-webkit-media-controls-closed-captions-track-list, video::-webkit-media-controls-closed-captions-track-list {
display: none;
}

audio::-webkit-media-controls-volume-slider-mute-button, video::-webkit-media-controls-volume-slider-mute-button {
-webkit-appearance: media-volume-slider-mute-button !important;
:is(audio, video)::-webkit-media-controls-volume-slider-mute-button {
display: none !important;
background-color: initial !important;
border: initial !important;
color: inherit !important;
}

audio::-webkit-media-controls-fullscreen-volume-slider, video::-webkit-media-controls-fullscreen-volume-slider {
display: none;
}

audio::-webkit-media-controls-fullscreen-volume-min-button, video::-webkit-media-controls-fullscreen-volume-min-button {
display: none;
}

audio::-webkit-media-controls-fullscreen-volume-max-button, video::-webkit-media-controls-fullscreen-volume-max-button {
display: none;
}

video::-webkit-media-text-track-container {
position: relative;
width: 100%;
@@ -47,11 +47,9 @@ TextStream& operator<<(TextStream& ts, ControlPart controlPart)
case MediaControlsLightBarBackgroundPart: ts << "media-controls-light-bar-background-part"; break;
case MediaFullScreenVolumeSliderPart: ts << "media-full-screen-volume-slider-part"; break;
case MediaFullScreenVolumeSliderThumbPart: ts << "media-full-screen-volume-slider-thumb-part"; break;
case MediaPlayButtonPart: ts << "media-play-button-part"; break;
case MediaSliderPart: ts << "media-slider-part"; break;
case MediaSliderThumbPart: ts << "media-slider-thumb-part"; break;
case MediaVolumeSliderPart: ts << "media-volume-slider-part"; break;
case MediaVolumeSliderMuteButtonPart: ts << "media-volume-slider-mute-button-part"; break;
case MediaVolumeSliderThumbPart: ts << "media-volume-slider-thumb-part"; break;
case MenulistPart: ts << "menulist-part"; break;
case MenulistButtonPart: ts << "menulist-button-part"; break;
@@ -46,11 +46,9 @@ enum ControlPart {
MediaControlsLightBarBackgroundPart,
MediaFullScreenVolumeSliderPart,
MediaFullScreenVolumeSliderThumbPart,
MediaPlayButtonPart,
MediaSliderPart,
MediaSliderThumbPart,
MediaVolumeSliderPart,
MediaVolumeSliderMuteButtonPart,
MediaVolumeSliderThumbPart,
MenulistPart,
MenulistButtonPart,

0 comments on commit b143b0e

Please sign in to comment.