EWPP-3652: Add favicon in ico, svg and png formats based on component library.

.gitignore

@@ -23,6 +23,7 @@ docker-compose.*.yml
 # Ignore all files in the images folder other than listed below.
 
 /images/*
+!/images/favicons
 !/images/required.svg
 !/images/user_icon.svg
 /.gitattributes

oe_theme.theme

@@ -2388,3 +2388,34 @@ function oe_theme_preprocess_select(&$variables) {
     ];
   }
 }
+
+/**
+ * Implements hook_page_attachments_alter().
+ */
+function oe_theme_page_attachments_alter(array &$attachments) {
+  // Use different favicon based on theme component library.
+  $active_theme = \Drupal::theme()->getActiveTheme();
+  if ($active_theme->getName() === 'oe_theme' || array_key_exists('oe_theme', $active_theme->getBaseThemeExtensions())) {
+    $component_library = theme_get_setting('component_library') ?? 'ec';
+    foreach ($attachments['#attached']['html_head_link'] as &$link) {
+      if ($link[0]['rel'] !== 'icon') {
+        continue;
+      }
+      $link[0]['href'] = base_path() . $active_theme->getPath() . "/images/favicons/$component_library/favicon.ico";
+    }
+    // Add the svg and png favicons.
+    $attachments['#attached']['html_head_link'][] = [
+      [
+        'rel' => 'icon',
+        'href' => base_path() . $active_theme->getPath() . "/images/favicons/$component_library/favicon.svg",
+        'type' => 'image/svg+xml',
+      ],
+    ];
+    $attachments['#attached']['html_head_link'][] = [
+      [
+        'rel' => 'apple-touch-icon',
+        'href' => base_path() . $active_theme->getPath() . "/images/favicons/$component_library/favicon.png",
+      ],
+    ];
+  }
+}

tests/src/Functional/ConfigurationTest.php

@@ -127,7 +127,9 @@ public function testChangeComponentLibrary(): void {
       $this->assertLinkNotContainsHref('/oe_theme/dist/eu/styles/optional/ecl-rtl.css');
 
       // Assert that the favicon provided by the theme is being used.
-      $this->assertSession()->responseContains('/' . $active_theme . '/favicon.ico');
+      $this->assertSession()->responseContains("/$active_theme/images/favicons/eu/favicon.ico");
+      $this->assertSession()->responseContains("$active_theme/images/favicons/eu/favicon.png");
+      $this->assertSession()->responseContains("/$active_theme/images/favicons/eu/favicon.svg");
 
       // Assert that we do not load the EC component library.
       $this->assertLinkNotContainsHref('/oe_theme/dist/ec/styles/ecl-ec.css');
@@ -167,7 +169,9 @@ public function testChangeComponentLibrary(): void {
       $this->assertLinkNotContainsHref('/oe_theme/dist/ec/styles/optional/ecl-rtl.css');
 
       // Assert that the favicon provided by the theme is being used.
-      $this->assertSession()->responseContains('/' . $active_theme . '/favicon.ico');
+      $this->assertSession()->responseContains("/$active_theme/images/favicons/ec/favicon.ico");
+      $this->assertSession()->responseContains("$active_theme/images/favicons/ec/favicon.png");
+      $this->assertSession()->responseContains("/$active_theme/images/favicons/ec/favicon.svg");
 
       // Assert that we do not load the EU component library by default.
       $this->assertLinkNotContainsHref('/oe_theme/dist/eu/styles/ecl-eu.css');