views:

389

answers:

2

Is there any defined behaviour if I have an HTML5 VIDEO tag but include neither a SRC attribute nor SOURCE tags inside the element? Would this still be valid HTML, and if so, what should the (HTML5 capable) browser do - ignore the element or display it's contents?

A: 

I guess the content would be displayed if the video wasn't found, and in your case it wasn't even specified. But I also assume that the src attribute is mandatory for the tag to make sense, like an img tag. So it wouldn't be valid without it, but it could default to linking an non-existing video..

It's important to remember that browsers will implement things differently, regardless of specifications, so you'll just have to wait and see.

Tor Valamo
+3  A: 

Yes, there is defined behavior; HTML5 is trying to provide defined behavior for any case in which it could make a difference between browsers, to reduce incompatibility, even when dealing with invalid documents.

From my reading of the spec, it looks like it is invalid to have no src attribute or source element:

Content model:
If the element has a src attribute: transparent, but with no media element descendants.
If the element does not have a src attribute: one or more source elements, then, transparent, but with no media element descendants.

This seems to indicate to me that it must have either a src attribute or a source child element. But both the Validator.nu and the W3C Validator seem to think this is a valid document:

<!DOCTYPE html>
<title>Video test</title>
<video></video>

Regardless of whether it's valid, the behavior is defined in the resource selection algorithm as follows:

⌛ Otherwise the media element has neither a src attribute nor a source element child: set the networkState to NETWORK_EMPTY, and abort these steps; the synchronous section ends.

This implies a ready state of HAVE_NOTHING

HAVE_NOTHING (numeric value 0)
No information regarding the media resource is available. No data for the current playback position is available. Media elements whose networkState attribute is NETWORK_EMPTY are always in the HAVE_NOTHING state.

In that state, the video is represented by its poster frame, or nothing:

When no video data is available (the element's readyState attribute is either HAVE_NOTHING, or HAVE_METADATA but no video data has yet been obtained at all), the video element represents either the poster frame, or nothing.

When it's represented by nothing, that means it appears as just a generic box; like a div, that can be styled but has no intrinsic display of its own, though it will be the width and height specified by its width and height attributes. For example:

<!DOCTYPE html>
<video width=100 height=100 
       style="border-width: 1px; border-color:black; border-style: solid; 
              background: green">
foobar
</video>

Note that it does not display its content, in browsers that support the video tag. Content within the video tag, other than the source elements, is intended to be fallback content displayed only by older browsers that don't support the video element:

Content may be provided inside the video element. User agents should not show this content to the user; it is intended for older Web browsers which do not support video, so that legacy video plugins can be tried, or to show text to the users of these older browsers informing them of how to access the video contents.

Brian Campbell
I'd add that the default size, if not set by width/height attributes or CSS, is 300x150.
foolip