diff --git a/src/ec/packages/ec-component-accordion/__snapshots__/accordion.test.js.snap b/src/ec/packages/ec-component-accordion/__snapshots__/accordion.test.js.snap
index fad5fd2f4..671511f66 100644
--- a/src/ec/packages/ec-component-accordion/__snapshots__/accordion.test.js.snap
+++ b/src/ec/packages/ec-component-accordion/__snapshots__/accordion.test.js.snap
@@ -21,6 +21,7 @@ exports[`EC - Accordion renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -59,6 +60,7 @@ exports[`EC - Accordion renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -97,6 +99,7 @@ exports[`EC - Accordion renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -146,6 +149,7 @@ exports[`EC - Accordion renders correctly with extra attributes 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -184,6 +188,7 @@ exports[`EC - Accordion renders correctly with extra attributes 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -222,6 +227,7 @@ exports[`EC - Accordion renders correctly with extra attributes 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -269,6 +275,7 @@ exports[`EC - Accordion renders correctly with extra class names 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -307,6 +314,7 @@ exports[`EC - Accordion renders correctly with extra class names 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -345,6 +353,7 @@ exports[`EC - Accordion renders correctly with extra class names 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--before"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
diff --git a/src/ec/packages/ec-component-accordion/ecl-accordion.html.twig b/src/ec/packages/ec-component-accordion/ecl-accordion.html.twig
index bcd94e49b..d39b90b39 100644
--- a/src/ec/packages/ec-component-accordion/ecl-accordion.html.twig
+++ b/src/ec/packages/ec-component-accordion/ecl-accordion.html.twig
@@ -66,6 +66,7 @@
             { name: 'data-ecl-accordion-toggle' },
           ]
         } only %}
+        
       </h{{ _item.level|default(3) }}>
       <div
         class="ecl-accordion__content"
diff --git a/src/ec/packages/ec-component-button/__snapshots__/button.test.js.snap b/src/ec/packages/ec-component-button/__snapshots__/button.test.js.snap
index f6c619cde..6469bffa1 100644
--- a/src/ec/packages/ec-component-button/__snapshots__/button.test.js.snap
+++ b/src/ec/packages/ec-component-button/__snapshots__/button.test.js.snap
@@ -17,6 +17,7 @@ exports[`EC - Button CTA button - icon after renders correctly 1`] = `
     <svg
       aria-hidden="true"
       class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+      data-ecl-icon=""
       focusable="false"
     >
       <use
@@ -46,6 +47,7 @@ exports[`EC - Button CTA button - icon after renders correctly with extra attrib
     <svg
       aria-hidden="true"
       class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+      data-ecl-icon=""
       focusable="false"
     >
       <use
@@ -73,6 +75,7 @@ exports[`EC - Button CTA button - icon after renders correctly with extra class
     <svg
       aria-hidden="true"
       class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+      data-ecl-icon=""
       focusable="false"
     >
       <use
@@ -94,6 +97,7 @@ exports[`EC - Button CTA button - icon before renders correctly 1`] = `
     <svg
       aria-hidden="true"
       class="ecl-icon ecl-icon--fluid ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--before"
+      data-ecl-icon=""
       focusable="false"
     >
       <use
@@ -127,6 +131,7 @@ exports[`EC - Button CTA renders correctly 1`] = `
     <svg
       aria-hidden="true"
       class="ecl-icon ecl-icon--fluid ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after"
+      data-ecl-icon=""
       focusable="false"
     >
       <use
diff --git a/src/ec/packages/ec-component-button/ecl-button.html.twig b/src/ec/packages/ec-component-button/ecl-button.html.twig
index b7031a6ce..3ab39a6e5 100644
--- a/src/ec/packages/ec-component-button/ecl-button.html.twig
+++ b/src/ec/packages/ec-component-button/ecl-button.html.twig
@@ -61,14 +61,20 @@
       {% if _icon_position == 'before' %}
         {% include '@ecl-twig/ec-component-icon/ecl-icon.html.twig' with {
           icon: _icon,
-          extra_classes: 'ecl-button__icon ecl-button__icon--before'
+          extra_classes: 'ecl-button__icon ecl-button__icon--before',
+          extra_attributes: [
+            { name: 'data-ecl-icon' }
+          ]
         } only %}
       {% endif %}
       <span class="ecl-button__label" data-ecl-label="true">{% block label _label|raw %}</span>
       {% if _icon_position == 'after' %}
         {% include '@ecl-twig/ec-component-icon/ecl-icon.html.twig' with {
           icon: _icon,
-          extra_classes: 'ecl-button__icon ecl-button__icon--after'
+          extra_classes: 'ecl-button__icon ecl-button__icon--after',
+          extra_attributes: [
+            { name: 'data-ecl-icon' }
+          ]
         } only %}
       {% endif %}
     </span>
diff --git a/src/ec/packages/ec-component-contextual-navigation/__snapshots__/contextual-navigation.test.js.snap b/src/ec/packages/ec-component-contextual-navigation/__snapshots__/contextual-navigation.test.js.snap
index f966c6d45..8329d43de 100644
--- a/src/ec/packages/ec-component-contextual-navigation/__snapshots__/contextual-navigation.test.js.snap
+++ b/src/ec/packages/ec-component-contextual-navigation/__snapshots__/contextual-navigation.test.js.snap
@@ -95,6 +95,7 @@ exports[`EC - Contextual Navigation renders correctly 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -205,6 +206,7 @@ exports[`EC - Contextual Navigation renders correctly with extra attributes 1`]
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -313,6 +315,7 @@ exports[`EC - Contextual Navigation renders correctly with extra class names 1`]
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
diff --git a/src/ec/packages/ec-component-dropdown-legacy/__snapshots__/dropdown-legacy.test.js.snap b/src/ec/packages/ec-component-dropdown-legacy/__snapshots__/dropdown-legacy.test.js.snap
index f3e740d34..cade0c11b 100644
--- a/src/ec/packages/ec-component-dropdown-legacy/__snapshots__/dropdown-legacy.test.js.snap
+++ b/src/ec/packages/ec-component-dropdown-legacy/__snapshots__/dropdown-legacy.test.js.snap
@@ -23,6 +23,7 @@ exports[`EC - Dropdown legacy Default renders correctly 1`] = `
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -99,6 +100,7 @@ exports[`EC - Dropdown legacy Default renders correctly with extra attributes 1`
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -173,6 +175,7 @@ exports[`EC - Dropdown legacy Default renders correctly with extra class names 1
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
diff --git a/src/ec/packages/ec-component-expandable/__snapshots__/expandable.test.js.snap b/src/ec/packages/ec-component-expandable/__snapshots__/expandable.test.js.snap
index 3f679e4c2..e916f6579 100644
--- a/src/ec/packages/ec-component-expandable/__snapshots__/expandable.test.js.snap
+++ b/src/ec/packages/ec-component-expandable/__snapshots__/expandable.test.js.snap
@@ -27,6 +27,7 @@ exports[`EC - Expandable Collapsed renders correctly 1`] = `
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -74,6 +75,7 @@ exports[`EC - Expandable Collapsed renders correctly with extra attributes 1`] =
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -119,6 +121,7 @@ exports[`EC - Expandable Collapsed renders correctly with extra class names 1`]
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -164,6 +167,7 @@ exports[`EC - Expandable Expanded renders correctly 1`] = `
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -211,6 +215,7 @@ exports[`EC - Expandable Expanded renders correctly with extra attributes 1`] =
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -256,6 +261,7 @@ exports[`EC - Expandable Expanded renders correctly with extra class names 1`] =
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
diff --git a/src/ec/packages/ec-component-file/__snapshots__/file.test.js.snap b/src/ec/packages/ec-component-file/__snapshots__/file.test.js.snap
index df78340fc..e51856802 100644
--- a/src/ec/packages/ec-component-file/__snapshots__/file.test.js.snap
+++ b/src/ec/packages/ec-component-file/__snapshots__/file.test.js.snap
@@ -80,6 +80,7 @@ exports[`EC - File With translation renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -306,6 +307,7 @@ exports[`EC - File With translation renders correctly with extra attributes 1`]
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -530,6 +532,7 @@ exports[`EC - File With translation renders correctly with extra class names 1`]
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--fluid ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
diff --git a/src/ec/packages/ec-component-gallery/__snapshots__/gallery.test.js.snap b/src/ec/packages/ec-component-gallery/__snapshots__/gallery.test.js.snap
index a702b7266..5a14fc818 100644
--- a/src/ec/packages/ec-component-gallery/__snapshots__/gallery.test.js.snap
+++ b/src/ec/packages/ec-component-gallery/__snapshots__/gallery.test.js.snap
@@ -439,6 +439,7 @@ exports[`EC - Gallery Default renders correctly 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -466,6 +467,7 @@ exports[`EC - Gallery Default renders correctly 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--l ecl-icon--rotate-270 ecl-button__icon ecl-button__icon--before"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -497,6 +499,7 @@ exports[`EC - Gallery Default renders correctly 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--l ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1030,6 +1033,7 @@ exports[`EC - Gallery Default renders correctly with extra attributes 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1057,6 +1061,7 @@ exports[`EC - Gallery Default renders correctly with extra attributes 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--l ecl-icon--rotate-270 ecl-button__icon ecl-button__icon--before"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1088,6 +1093,7 @@ exports[`EC - Gallery Default renders correctly with extra attributes 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--l ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1619,6 +1625,7 @@ exports[`EC - Gallery Default renders correctly with extra class names 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1646,6 +1653,7 @@ exports[`EC - Gallery Default renders correctly with extra class names 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--l ecl-icon--rotate-270 ecl-button__icon ecl-button__icon--before"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1677,6 +1685,7 @@ exports[`EC - Gallery Default renders correctly with extra class names 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--l ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
diff --git a/src/ec/packages/ec-component-language-list/__snapshots__/language-list.test.js.snap b/src/ec/packages/ec-component-language-list/__snapshots__/language-list.test.js.snap
index 26759f359..56484b0a2 100644
--- a/src/ec/packages/ec-component-language-list/__snapshots__/language-list.test.js.snap
+++ b/src/ec/packages/ec-component-language-list/__snapshots__/language-list.test.js.snap
@@ -31,6 +31,7 @@ exports[`EC - Language List Overlay renders correctly 1`] = `
             <svg
               aria-hidden="true"
               class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+              data-ecl-icon=""
               focusable="false"
             >
               <use
@@ -430,6 +431,7 @@ exports[`EC - Language List Overlay renders correctly with extra attributes 1`]
             <svg
               aria-hidden="true"
               class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+              data-ecl-icon=""
               focusable="false"
             >
               <use
@@ -827,6 +829,7 @@ exports[`EC - Language List Overlay renders correctly with extra class names 1`]
             <svg
               aria-hidden="true"
               class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+              data-ecl-icon=""
               focusable="false"
             >
               <use
diff --git a/src/ec/packages/ec-component-message/__snapshots__/message.test.js.snap b/src/ec/packages/ec-component-message/__snapshots__/message.test.js.snap
index 46e6664fb..331d0caa9 100644
--- a/src/ec/packages/ec-component-message/__snapshots__/message.test.js.snap
+++ b/src/ec/packages/ec-component-message/__snapshots__/message.test.js.snap
@@ -36,6 +36,7 @@ exports[`EC - Message Error renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -94,6 +95,7 @@ exports[`EC - Message Info renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -154,6 +156,7 @@ exports[`EC - Message Info renders correctly with extra attributes 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -212,6 +215,7 @@ exports[`EC - Message Info renders correctly with extra class names 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -270,6 +274,7 @@ exports[`EC - Message Success renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -328,6 +333,7 @@ exports[`EC - Message Warning renders correctly 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
diff --git a/src/ec/packages/ec-component-search-form/__snapshots__/search-form.test.js.snap b/src/ec/packages/ec-component-search-form/__snapshots__/search-form.test.js.snap
index 82a13f5f1..9e40888b2 100644
--- a/src/ec/packages/ec-component-search-form/__snapshots__/search-form.test.js.snap
+++ b/src/ec/packages/ec-component-search-form/__snapshots__/search-form.test.js.snap
@@ -31,6 +31,7 @@ exports[`EC - Search Form Default renders correctly 1`] = `
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -75,6 +76,7 @@ exports[`EC - Search Form Default renders correctly with extra attributes 1`] =
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -117,6 +119,7 @@ exports[`EC - Search Form Default renders correctly with extra class names 1`] =
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
@@ -159,6 +162,7 @@ exports[`EC - Search Form Default renders correctly with extra form elements 1`]
       <svg
         aria-hidden="true"
         class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+        data-ecl-icon=""
         focusable="false"
       >
         <use
diff --git a/src/ec/packages/ec-component-site-header-core/__snapshots__/site-header-core.test.js.snap b/src/ec/packages/ec-component-site-header-core/__snapshots__/site-header-core.test.js.snap
index 3ee9b8aae..bcf2eb117 100644
--- a/src/ec/packages/ec-component-site-header-core/__snapshots__/site-header-core.test.js.snap
+++ b/src/ec/packages/ec-component-site-header-core/__snapshots__/site-header-core.test.js.snap
@@ -130,6 +130,7 @@ exports[`EC - Site Header Core Default renders correctly 1`] = `
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -176,6 +177,7 @@ exports[`EC - Site Header Core Default renders correctly 1`] = `
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -705,6 +707,7 @@ exports[`EC - Site Header Core Default renders correctly when logged in 1`] = `
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -751,6 +754,7 @@ exports[`EC - Site Header Core Default renders correctly when logged in 1`] = `
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -1250,6 +1254,7 @@ exports[`EC - Site Header Core Default renders correctly with extra attributes 1
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -1296,6 +1301,7 @@ exports[`EC - Site Header Core Default renders correctly with extra attributes 1
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -1793,6 +1799,7 @@ exports[`EC - Site Header Core Default renders correctly with extra class names
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -1839,6 +1846,7 @@ exports[`EC - Site Header Core Default renders correctly with extra class names
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -2336,6 +2344,7 @@ exports[`EC - Site Header Core Translated renders correctly 1`] = `
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -2382,6 +2391,7 @@ exports[`EC - Site Header Core Translated renders correctly 1`] = `
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -2881,6 +2891,7 @@ exports[`EC - Site Header Core Translated renders correctly with extra attribute
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -2927,6 +2938,7 @@ exports[`EC - Site Header Core Translated renders correctly with extra attribute
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -3424,6 +3436,7 @@ exports[`EC - Site Header Core Translated renders correctly with extra class nam
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -3470,6 +3483,7 @@ exports[`EC - Site Header Core Translated renders correctly with extra class nam
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
diff --git a/src/ec/packages/ec-component-site-header-harmonised/__snapshots__/site-header-harmonised.test.js.snap b/src/ec/packages/ec-component-site-header-harmonised/__snapshots__/site-header-harmonised.test.js.snap
index bf3bbe7d3..f5b96b470 100644
--- a/src/ec/packages/ec-component-site-header-harmonised/__snapshots__/site-header-harmonised.test.js.snap
+++ b/src/ec/packages/ec-component-site-header-harmonised/__snapshots__/site-header-harmonised.test.js.snap
@@ -131,6 +131,7 @@ exports[`EC - Site Header Harmonised Group 1 renders correctly 1`] = `
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -1596,6 +1597,7 @@ exports[`EC - Site Header Harmonised Group 1 renders correctly 1`] = `
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -2096,6 +2098,7 @@ exports[`EC - Site Header Harmonised Group 1 renders correctly with extra attrib
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -3561,6 +3564,7 @@ exports[`EC - Site Header Harmonised Group 1 renders correctly with extra attrib
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -4059,6 +4063,7 @@ exports[`EC - Site Header Harmonised Group 1 renders correctly with extra class
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -5524,6 +5529,7 @@ exports[`EC - Site Header Harmonised Group 1 renders correctly with extra class
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -6003,6 +6009,7 @@ exports[`EC - Site Header Harmonised Group 2 renders correctly 1`] = `
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -7449,6 +7456,7 @@ exports[`EC - Site Header Harmonised Group 2 renders correctly 1`] = `
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -7930,6 +7938,7 @@ exports[`EC - Site Header Harmonised Group 2 renders correctly with extra attrib
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -9376,6 +9385,7 @@ exports[`EC - Site Header Harmonised Group 2 renders correctly with extra attrib
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -9855,6 +9865,7 @@ exports[`EC - Site Header Harmonised Group 2 renders correctly with extra class
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -11301,6 +11312,7 @@ exports[`EC - Site Header Harmonised Group 2 renders correctly with extra class
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
diff --git a/src/ec/packages/ec-component-site-header-standardised/__snapshots__/site-header-standardised.test.js.snap b/src/ec/packages/ec-component-site-header-standardised/__snapshots__/site-header-standardised.test.js.snap
index 54c276041..d6bf25191 100644
--- a/src/ec/packages/ec-component-site-header-standardised/__snapshots__/site-header-standardised.test.js.snap
+++ b/src/ec/packages/ec-component-site-header-standardised/__snapshots__/site-header-standardised.test.js.snap
@@ -131,6 +131,7 @@ exports[`EC - Site Header Standardised Default renders correctly 1`] = `
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -1596,6 +1597,7 @@ exports[`EC - Site Header Standardised Default renders correctly 1`] = `
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -2126,6 +2128,7 @@ exports[`EC - Site Header Standardised Default renders correctly when logged in
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -3591,6 +3594,7 @@ exports[`EC - Site Header Standardised Default renders correctly when logged in
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -4091,6 +4095,7 @@ exports[`EC - Site Header Standardised Default renders correctly with extra attr
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -5556,6 +5561,7 @@ exports[`EC - Site Header Standardised Default renders correctly with extra attr
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -6054,6 +6060,7 @@ exports[`EC - Site Header Standardised Default renders correctly with extra clas
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -7519,6 +7526,7 @@ exports[`EC - Site Header Standardised Default renders correctly with extra clas
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -8017,6 +8025,7 @@ exports[`EC - Site Header Standardised Translated renders correctly 1`] = `
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -9482,6 +9491,7 @@ exports[`EC - Site Header Standardised Translated renders correctly 1`] = `
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -9982,6 +9992,7 @@ exports[`EC - Site Header Standardised Translated renders correctly with extra a
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -11447,6 +11458,7 @@ exports[`EC - Site Header Standardised Translated renders correctly with extra a
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
@@ -11945,6 +11957,7 @@ exports[`EC - Site Header Standardised Translated renders correctly with extra c
                 <svg
                   aria-hidden="true"
                   class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+                  data-ecl-icon=""
                   focusable="false"
                 >
                   <use
@@ -13410,6 +13423,7 @@ exports[`EC - Site Header Standardised Translated renders correctly with extra c
               <svg
                 aria-hidden="true"
                 class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                data-ecl-icon=""
                 focusable="false"
               >
                 <use
diff --git a/src/ec/packages/ec-component-site-header/__snapshots__/site-header.test.js.snap b/src/ec/packages/ec-component-site-header/__snapshots__/site-header.test.js.snap
index 41d05c490..8c2ed6d6d 100644
--- a/src/ec/packages/ec-component-site-header/__snapshots__/site-header.test.js.snap
+++ b/src/ec/packages/ec-component-site-header/__snapshots__/site-header.test.js.snap
@@ -85,6 +85,7 @@ exports[`EC - Site Header Default renders correctly 1`] = `
                     <svg
                       aria-hidden="true"
                       class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                      data-ecl-icon=""
                       focusable="false"
                     >
                       <use
@@ -487,6 +488,7 @@ exports[`EC - Site Header Default renders correctly 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -587,6 +589,7 @@ exports[`EC - Site Header Default renders correctly with extra attributes 1`] =
                     <svg
                       aria-hidden="true"
                       class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                      data-ecl-icon=""
                       focusable="false"
                     >
                       <use
@@ -989,6 +992,7 @@ exports[`EC - Site Header Default renders correctly with extra attributes 1`] =
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1087,6 +1091,7 @@ exports[`EC - Site Header Default renders correctly with extra class names 1`] =
                     <svg
                       aria-hidden="true"
                       class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                      data-ecl-icon=""
                       focusable="false"
                     >
                       <use
@@ -1489,6 +1494,7 @@ exports[`EC - Site Header Default renders correctly with extra class names 1`] =
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -1587,6 +1593,7 @@ exports[`EC - Site Header Translated renders correctly 1`] = `
                     <svg
                       aria-hidden="true"
                       class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                      data-ecl-icon=""
                       focusable="false"
                     >
                       <use
@@ -1989,6 +1996,7 @@ exports[`EC - Site Header Translated renders correctly 1`] = `
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -2089,6 +2097,7 @@ exports[`EC - Site Header Translated renders correctly with extra attributes 1`]
                     <svg
                       aria-hidden="true"
                       class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                      data-ecl-icon=""
                       focusable="false"
                     >
                       <use
@@ -2491,6 +2500,7 @@ exports[`EC - Site Header Translated renders correctly with extra attributes 1`]
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
@@ -2589,6 +2599,7 @@ exports[`EC - Site Header Translated renders correctly with extra class names 1`
                     <svg
                       aria-hidden="true"
                       class="ecl-icon ecl-icon--s ecl-button__icon ecl-button__icon--after"
+                      data-ecl-icon=""
                       focusable="false"
                     >
                       <use
@@ -2991,6 +3002,7 @@ exports[`EC - Site Header Translated renders correctly with extra class names 1`
           <svg
             aria-hidden="true"
             class="ecl-icon ecl-icon--fluid ecl-button__icon ecl-button__icon--after"
+            data-ecl-icon=""
             focusable="false"
           >
             <use
diff --git a/src/ec/packages/ec-component-timeline/__snapshots__/timeline.test.js.snap b/src/ec/packages/ec-component-timeline/__snapshots__/timeline.test.js.snap
index b5b0ba233..e9a51b488 100644
--- a/src/ec/packages/ec-component-timeline/__snapshots__/timeline.test.js.snap
+++ b/src/ec/packages/ec-component-timeline/__snapshots__/timeline.test.js.snap
@@ -612,6 +612,7 @@ exports[`EC - Timeline renders correctly with extra attributes 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -1275,6 +1276,7 @@ exports[`EC - Timeline renders correctly with extra class names 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -1938,6 +1940,7 @@ exports[`EC - Timeline renders correctly with hidden items 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -2642,6 +2645,7 @@ exports[`EC - Timeline renders correctly with hidden items but no items after bu
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -2956,6 +2960,7 @@ exports[`EC - Timeline renders correctly with positive hide.to 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -3927,6 +3932,7 @@ exports[`EC - Timeline renders correctly without hidden items 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -5222,6 +5228,7 @@ exports[`EC - Timeline renders correctly without hide.from or hide.to 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use
@@ -5885,6 +5892,7 @@ exports[`EC - Timeline renders correctly without hide.to 1`] = `
         <svg
           aria-hidden="true"
           class="ecl-icon ecl-icon--xs ecl-icon--rotate-180 ecl-button__icon ecl-button__icon--after"
+          data-ecl-icon=""
           focusable="false"
         >
           <use