Issue #2227435 by mariancalinro, mdrummond: Remove noscript from picture element markup.

core/modules/responsive_image/lib/Drupal/responsive_image/Tests/ResponsiveImageFieldDisplayTest.php

@@ -172,6 +172,9 @@ public function _testResponsiveImageFieldFormatters($scheme) {
 
     // Use the responsive image formatter with a responsive image mapping.
     $display_options['settings']['responsive_image_mapping'] = 'mapping_one';
+    $display_options['settings']['image_link'] = '';
+    // Also set the fallback image style.
+    $display_options['settings']['fallback_image_style'] = 'large';
     $display->setComponent($field_name, $display_options)
       ->save();
 
@@ -185,22 +188,13 @@ public function _testResponsiveImageFieldFormatters($scheme) {
     $this->assertRaw('media="(min-width: 600px)"');
 
     // Test the fallback image style.
-    $display_options['settings']['image_link'] = '';
-    $display_options['settings']['fallback_image_style'] = 'large';
-    $display->setComponent($field_name, $display_options)
-      ->save();
-
     $large_style = entity_load('image_style', 'large');
-    $this->drupalGet($large_style->buildUrl($image_uri));
-    $image_style = array(
-      '#theme' => 'image_style',
-      '#uri' => $image_uri,
-      '#width' => 480,
-      '#height' => 240,
-      '#style_name' => 'large',
+    $fallback_image = array(
+      '#theme' => 'responsive_image_source',
+      '#src' => $large_style->buildUrl($image_uri),
+      '#dimensions' => array('width' => 480, 'height' => 240),
     );
-    $default_output = '<noscript>' . drupal_render($image_style) . '</noscript>';
-    $this->drupalGet('node/' . $nid);
+    $default_output = drupal_render($fallback_image);
     $this->assertRaw($default_output, 'Image style thumbnail formatter displaying correctly on full node view.');
 
     if ($scheme == 'private') {

core/modules/responsive_image/responsive_image.module

@@ -202,6 +202,7 @@ function theme_responsive_image_formatter($variables) {
  *   - alt: The alternative text for text-based browsers.
  *   - title: The title text is displayed when the image is hovered in some
  *     popular browsers.
+ *   - style_name: The name of the style to be used as a fallback image.
  *   - breakpoints: An array containing breakpoints.
  *
  * @ingroup themeable
@@ -282,19 +283,6 @@ function theme_responsive_image($variables) {
       $output[] = drupal_render($responsive_image_source);
     }
 
-    // Output the fallback image.
-    $image_style = array(
-      '#theme' => 'image_style',
-      '#style_name' => $variables['style_name'],
-      '#width' => $variables['width'],
-      '#height' => $variables['height'],
-    );
-    foreach (array('uri', 'alt', 'title', 'attributes') as $key) {
-      if (isset($variables[$key])) {
-        $image_style["#$key"] = $variables[$key];
-      }
-    }
-    $output[] = '  <noscript>' . drupal_render($image_style) . '</noscript>';
     $output[] = '</picture>';
     return implode("\n", $output);
   }