Add support for <noscript><picture><source>. (#18996)

Resolves the noscript parts of #18965

validator/testdata/feature_tests/leaks.out

@@ -141,16 +141,12 @@ feature_tests/leaks.html:93:0 The tag 'image' may only appear as a descendant of
 |
 |  <picture>
 >> ^~~~~~~~~
-feature_tests/leaks.html:95:0 The tag 'picture' is disallowed. [DISALLOWED_HTML]
+feature_tests/leaks.html:95:0 The parent tag of tag 'picture' is 'image', but it can only be 'noscript'. (see https://www.ampproject.org/docs/reference/components/amp-img) [DISALLOWED_HTML]
 |      <source srcset="https://leaking.via/picture-source-srcset">
->>     ^~~~~~~~~
-feature_tests/leaks.html:96:4 The parent tag of tag 'amp-ima-video > source' is 'picture', but it can only be 'amp-ima-video'. (see https://www.ampproject.org/docs/reference/components/amp-ima-video) [AMP_TAG_PROBLEM]
->>     ^~~~~~~~~
-feature_tests/leaks.html:96:4 The tag 'amp-ima-video > source' requires including the 'amp-ima-video' extension JavaScript. (see https://www.ampproject.org/docs/reference/components/amp-ima-video) [MANDATORY_AMP_TAG_MISSING_OR_INCORRECT]
 |  </picture>
 |  <picture>
 >> ^~~~~~~~~
-feature_tests/leaks.html:98:0 The tag 'picture' is disallowed. [DISALLOWED_HTML]
+feature_tests/leaks.html:98:0 The parent tag of tag 'picture' is 'image', but it can only be 'noscript'. (see https://www.ampproject.org/docs/reference/components/amp-img) [DISALLOWED_HTML]
 |      <img srcset="https://leaking.via/picture-img-srcset">
 >>     ^~~~~~~~~
 feature_tests/leaks.html:99:4 The tag 'img' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-img'? (see https://www.ampproject.org/docs/reference/components/amp-img) [DISALLOWED_HTML_WITH_AMP_EQUIVALENT]
@@ -388,4 +384,4 @@ feature_tests/leaks.html:215:0 The tag 'vmlframe' is disallowed. [DISALLOWED_HTM
 |  </vmlframe>
 |
 |  </body>
-|  </html>
+|  </html>

validator/testdata/feature_tests/noscript.html

@@ -37,6 +37,14 @@
       <source src="https://example.com/island-of-lemurs.mp4" type="video/mp4">
     </video>
   </noscript>
+  <!-- Valid: noscript with picture element -->
+  <noscript>
+    <picture>
+      <source type="image/webp" srcset="images/lemur.webp">
+      <source type="image/jpeg" srcset="images/lemur.jpg">
+      <img alt="Lemur sleeping" width=1200 height=800 src="images/lemur.jpg">
+    </picture>
+  </noscript>
   <!-- Invalid: audio's source must have src and type; controls are optional -->
   <noscript>
     <audio>

validator/testdata/feature_tests/noscript.out

@@ -38,41 +38,49 @@ FAIL
 |        <source src="https://example.com/island-of-lemurs.mp4" type="video/mp4">
 |      </video>
 |    </noscript>
+|    <!-- Valid: noscript with picture element -->
+|    <noscript>
+|      <picture>
+|        <source type="image/webp" srcset="images/lemur.webp">
+|        <source type="image/jpeg" srcset="images/lemur.jpg">
+|        <img alt="Lemur sleeping" width=1200 height=800 src="images/lemur.jpg">
+|      </picture>
+|    </noscript>
 |    <!-- Invalid: audio's source must have src and type; controls are optional -->
 |    <noscript>
 |      <audio>
 |        <source>
 >>       ^~~~~~~~~
-feature_tests/noscript.html:43:6 The mandatory attribute 'src' is missing in tag 'audio > source'. (see https://www.ampproject.org/docs/reference/components/amp-audio) [DISALLOWED_HTML]
+feature_tests/noscript.html:51:6 The mandatory attribute 'src' is missing in tag 'audio > source'. (see https://www.ampproject.org/docs/reference/components/amp-audio) [DISALLOWED_HTML]
 >>       ^~~~~~~~~
-feature_tests/noscript.html:43:6 The mandatory attribute 'type' is missing in tag 'audio > source'. (see https://www.ampproject.org/docs/reference/components/amp-audio) [DISALLOWED_HTML]
+feature_tests/noscript.html:51:6 The mandatory attribute 'type' is missing in tag 'audio > source'. (see https://www.ampproject.org/docs/reference/components/amp-audio) [DISALLOWED_HTML]
 |      </audio>
 |    </noscript>
 |    <!-- Invalid: img must have src; alt, height and width are optional -->
 |    <noscript>
 |      <img alt="Iconic Lemurs">
 >>     ^~~~~~~~~
-feature_tests/noscript.html:48:4 The mandatory attribute 'src' is missing in tag 'img'. (see https://www.ampproject.org/docs/reference/components/amp-img) [DISALLOWED_HTML]
+feature_tests/noscript.html:56:4 The mandatory attribute 'src' is missing in tag 'img'. (see https://www.ampproject.org/docs/reference/components/amp-img) [DISALLOWED_HTML]
 |    </noscript>
 |    <!-- Invalid: audio must be in a noscript tag -->
 |    <audio controls>
 >>   ^~~~~~~~~
-feature_tests/noscript.html:51:2 The tag 'audio' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-audio'? (see https://www.ampproject.org/docs/reference/components/amp-audio) [DISALLOWED_HTML_WITH_AMP_EQUIVALENT]
+feature_tests/noscript.html:59:2 The tag 'audio' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-audio'? (see https://www.ampproject.org/docs/reference/components/amp-audio) [DISALLOWED_HTML_WITH_AMP_EQUIVALENT]
 |      <source src="https://example.com/howl-of-the-lemur.mp3" type="audio/mpeg">
 |    </audio>
 |    <!-- Invalid: img must be in a noscript tag -->
 |    <img alt="Iconic Lemurs" height="200" src="https://example.com/lemurs.png" width="80">
 >>   ^~~~~~~~~
-feature_tests/noscript.html:55:2 The tag 'img' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-img'? (see https://www.ampproject.org/docs/reference/components/amp-img) [DISALLOWED_HTML_WITH_AMP_EQUIVALENT]
+feature_tests/noscript.html:63:2 The tag 'img' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-img'? (see https://www.ampproject.org/docs/reference/components/amp-img) [DISALLOWED_HTML_WITH_AMP_EQUIVALENT]
 |    <!-- Invalid: video must be in a noscript tag -->
 |    <video controls height="480" width="640">
 >>   ^~~~~~~~~
-feature_tests/noscript.html:57:2 The tag 'video' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-video'? (see https://www.ampproject.org/docs/reference/components/amp-video) [DISALLOWED_HTML_WITH_AMP_EQUIVALENT]
+feature_tests/noscript.html:65:2 The tag 'video' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-video'? (see https://www.ampproject.org/docs/reference/components/amp-video) [DISALLOWED_HTML_WITH_AMP_EQUIVALENT]
 |      <source src="https://example.com/island-of-lemurs.mp4" type="video/mp4">
 |    </video>
 |    <!-- Invalid: nested noscript tags don't correctly parse. -->
 |    <noscript> <noscript> </noscript> </noscript>
 >>              ^~~~~~~~~
-feature_tests/noscript.html:61:13 The parent tag of tag 'noscript enclosure for boilerplate' is 'noscript', but it can only be 'head'. (see https://github.com/ampproject/amphtml/blob/master/spec/amp-boilerplate.md) [DISALLOWED_HTML]
+feature_tests/noscript.html:69:13 The parent tag of tag 'noscript enclosure for boilerplate' is 'noscript', but it can only be 'head'. (see https://github.com/ampproject/amphtml/blob/master/spec/amp-boilerplate.md) [DISALLOWED_HTML]
 |  </body>
-|  </html>
+|  </html>

validator/validator-main.protoascii

@@ -2079,7 +2079,35 @@ tags: {
   }
   spec_url: "https://www.ampproject.org/docs/reference/components/amp-audio"
 }
+# 4.7.7 The picture element
+# Only allowed in noscript tags which support img tags.
+tags: {
+  html_format: AMP
+  tag_name: "PICTURE"
+  mandatory_parent: "NOSCRIPT"
+  spec_url: "https://www.ampproject.org/docs/reference/components/amp-img"
+}
 # 4.7.8 The source element
+tags: {
+  html_format: AMP
+  tag_name: "SOURCE"
+  spec_name: "picture > source"
+  mandatory_parent: "PICTURE"  # PICTURE is only allowed inside NOSCRIPT
+  attrs: { name: "media" }
+  attrs: { name: "sizes" }
+  attrs: {
+    name: "srcset"
+    value_url: {
+      protocol: "data"
+      protocol: "http"
+      protocol: "https"
+      allow_relative: true
+    }
+    blacklisted_value_regex: "__amp_source_origin"
+  }
+  attrs: { name: "type" }
+  spec_url: "https://www.ampproject.org/docs/reference/components/amp-img"
+}
 tags: {
   html_format: AMP
   html_format: AMP4ADS