Bug 166946 – Remove obsolete mediaControlsApple files

• Component: CSS
• Status: RESOLVED FIXED

[Devin Rousso]

The styles added by https://webkit.org/b/148120 no longer work.  `input[type=range]::-webkit-slider-runnable-track { ... }` still works, but adding `::before` to the rule has no effect.

As an aside, neither of the two rules show up in the styles sidebar (even with Shadow DOM visible).

[Devin Rousso]

Oh forgot to mention this issue was circumvented by the changes in <https://webkit.org/b/166933> (Source/WebInspectorUI/UserInterface/Views/Main.css).

[Joseph Pecoraro]

Can you attach a reduced test case, so that there is no confusion?

[Devin Rousso]

Created attachment 298637 [details]
[HTML] Reduction

Notice that the color "green" never appears.

<style>
	input {
		-webkit-appearance: none;
	}
	input::-webkit-slider-runnable-track {
		background-color: red;
		height: 1px;
	}
	input::-webkit-slider-runnable-track::before {
		display: block;
		height: 10px;
		content: "";
		background-color: green;
	}
</style>
<input type="range">

[Joseph Pecoraro]

This started failing with the new CSS Parser.

My guess is that this is not a valid selector:

    input::-webkit-slider-runnable-track::before

This is the text from the CSS Selectors Module 3: Spec:
https://www.w3.org/TR/selectors/#pseudo-elements

> Only one pseudo-element may appear per selector, and if present
> it must appear after the sequence of simple selectors that represents
> the subjects of the selector. Note: A future version of this
> specification may allow multiple pseudo-elements per selector.

I doubt it is very common, and given you worked around it, maybe we should close this as the new correct behavior.

What do others think?

[Joseph Pecoraro]

Searching WebCore's User Agent Stylesheets, I see the following cases of multiple pseudo-element selectors.

$ find . | ack '\.css$' | xargs ack '::[^ ]+::'
Modules/mediacontrols/mediaControlsApple.css
356:video::-webkit-media-controls-volume-slider::-webkit-slider-thumb,
357:audio::-webkit-media-controls-volume-slider::-webkit-slider-thumb {
559:video::-webkit-media-controls-timeline::-webkit-slider-thumb,
560:audio::-webkit-media-controls-timeline::-webkit-slider-thumb {

Modules/mediacontrols/mediaControlsBase.css
245:video::-webkit-media-controls-volume-slider::-webkit-slider-thumb,
246:audio::-webkit-media-controls-volume-slider::-webkit-slider-thumb {
264:video::-webkit-media-controls-volume-slider::-webkit-slider-thumb::-webkit-slider-thumb:active,
265:video::-webkit-media-controls-volume-slider::-webkit-slider-thumb:active::-webkit-slider-thumb,
266:audio::-webkit-media-controls-volume-slider::-webkit-slider-thumb::-webkit-slider-thumb:active,
267:audio::-webkit-media-controls-volume-slider::-webkit-slider-thumb:active::-webkit-slider-thumb {
427:video::-webkit-media-controls-timeline::-webkit-slider-thumb,
428:audio::-webkit-media-controls-timeline::-webkit-slider-thumb {
447:video::-webkit-media-controls-timeline::-webkit-slider-thumb:active,
448:video::-webkit-media-controls-timeline:active::-webkit-slider-thumb,
449:audio::-webkit-media-controls-timeline::-webkit-slider-thumb:active,
450:audio::-webkit-media-controls-timeline:active::-webkit-slider-thumb,
609:video:-webkit-full-screen::-webkit-media-controls-volume-slider::-webkit-slider-thumb {

Modules/mediacontrols/mediaControlsiOS.css
413:audio::-webkit-media-controls-timeline::-webkit-slider-runnable-track,
414:video::-webkit-media-controls-timeline::-webkit-slider-runnable-track {
420:video::-webkit-media-controls-timeline::-webkit-slider-thumb,
421:audio::-webkit-media-controls-timeline::-webkit-slider-thumb {
434:video::-webkit-media-controls-timeline::-webkit-slider-thumb:active,
435:audio::-webkit-media-controls-timeline::-webkit-slider-thumb:active {
439:audio::-webkit-media-controls-timeline::-webkit-slider-thumb {

Maybe these work in some other way? Either way they may need to be sanity checked to make sure they are still working.

[Anne van Kesteren]

Pull request: https://github.com/WebKit/WebKit/pull/22265

[EWS]

Committed 272555@main (5444b05a5fea): <https://commits.webkit.org/272555@main>

Reviewed commits have been landed. Closing PR #22265 and removing active labels.

[Radar WebKit Bug Importer]

<rdar://problem/120343021>