Intent to prototype: width and height attributes on <source> elements

[Boris Chiou]

Summary: I'd like to implement width and height attributes on HTML source elements, and map these two attributes into the style of the <img> elements who are using this <source>. These mapped attributes override the <img>'s width and height attributes in style, and aspect-ratio as well. The width and height attributes are used only when its parent element is <picture>.

Bug: Bug 1694741

Specification: https://html.spec.whatwg.org/multipage/embedded-content.html#the-source-element

Standards Body:

The <source> element's parent is a <picture> element

=> The source element supports dimension attributes. The img element can use the width and height attributes of a source element, instead of those on the img element itself, to determine its rendered dimensions and aspect-ratio, as defined in the Rendering section.

Platform coverage: All
Preference: dom.picture_source_dimension_attributes.enabled. I'd like to enable this on nightly only for now. If it is stable for a couple of cycles, I will ship it.
DevTools bug: No sure if we need this.

Other browsers:

• Blink: shipped already in Google Chrome 90. The intent to ship mail: https://groups.google.com/a/chromium.org/g/blink-dev/c/GEjjJE0LCnM/m/0p8CJ48hAgAJ
• Webkit: shipped already. The original bug: https://bugs.webkit.org/show_bug.cgi?id=222368

web-platform-tests: https://wpt.fyi/results/html/rendering/replaced-elements/attributes-for-embedded-content-and-images/picture-aspect-ratio.html?label=master&label=experimental&aligned

Thanks,

Boris