<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body>
<p>
<div>
<b><a class="bz_bug_link
bz_status_RESOLVED bz_closed"
title="RESOLVED INVALID - REGRESSION (STP 4): Unable to target pseudo element webkit-media-controls"
href="https://bugs.webkit.org/show_bug.cgi?id=157635#c11">Comment # 11</a>
on <a class="bz_bug_link
bz_status_RESOLVED bz_closed"
title="RESOLVED INVALID - REGRESSION (STP 4): Unable to target pseudo element webkit-media-controls"
href="https://bugs.webkit.org/show_bug.cgi?id=157635">bug 157635</a>
from <span class="vcard"><a class="email" href="mailto:jer.noble@apple.com" title="Jer Noble <jer.noble@apple.com>"> <span class="fn">Jer Noble</span></a>
</span></b>
<pre>(In reply to <a href="show_bug.cgi?id=157635#c10">comment #10</a>)
<span class="quote">> (In reply to <a href="show_bug.cgi?id=157635#c9">comment #9</a>)
> > (In reply to <a href="show_bug.cgi?id=157635#c8">comment #8</a>)
> > I think you have some other, better supported techniques available for this
> > scenario. Your in-page CSS could hide (visibility:hidden) the video element
> > entirely (or cover it with a poster <img>, and only un-hide it once your
> > script clears the 'controls' attribute. The <video> poster image attribute
> > takes time to download, decode, and paint, so this wouldn't introduce any
> > additional flash that wasn't there already.
>
> I just want a style based way to say: "don't show controls", which
> apparently won't be possible anymore. I'm also not concerned about a FOUC or
> reflow, i'm specifically concerned about 50 video frames showing a
> controlbar on mobile device in nigeria that takes 70 seconds to load the
> entire page. Which would result in one video after the other then loads the
> JS player. I want to eliminate that temporary moment of controls, after
> which the user has to reset his expectations with a new set of controls. And
> I need to keep my DOM clean of non-semantic <img> elements.</span >
I think I understand; you're more concerned with the look-and-feel of the controls changing half-way through the page-load.
I mean, I'm not really trying to tell you how to redesign your page to work around this issue, but it still seems like there are options. Just off the top of my head, you could do something like this to solve the "javascript disabled" case:
<script>
document.write('<video src="foo"></video>');
</script>
<noscript>
<video controls src="foo"></video>
</noscript>
For the "external users who don't have my javascript player library", the script tag would have to look something like:
document.write('<video src="foo" ' + (hasMyJSLibrary() ? '' : 'controls') + '></video>');
<span class="quote">> I guess the only other alternative that might get me what i want is to use a
> top loading synchronous JS fragment, but i don't think our performance team
> will like that. ..</span >
Well, if you can articulate this use case to the CSS WG (or some representative thereof), the best way to do this moving forward is to convince the WG to add explicit and standardized support for showing or hiding the controls through CSS. Then WebKit can expose just that without pages mucking around with the internals of the controls.
<span class="quote">> I know, our requirements are somewhat crazy :)</span >
Crazy requirements make for the most interesting bugs. :)</pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>