chore(autoinit): Review destroy method - FRONT-3596

src/implementations/vanilla/components/accordion/accordion.js

@@ -77,17 +77,23 @@ export class Accordion {
         );
       });
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.toggles) {
       this.toggles.forEach((toggle) => {
         toggle.removeEventListener('click', this.handleClickOnToggle);
       });
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/breadcrumb-core/breadcrumb-core.js

@@ -89,18 +89,24 @@ export class BreadcrumbCore {
     );
 
     this.check();
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.ellipsisButton) {
       this.ellipsisButton.removeEventListener(
         'click',
         this.handleClickOnEllipsis
       );
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/breadcrumb-harmonised/breadcrumb-harmonised.js

@@ -66,15 +66,21 @@ export class BreadcrumbHarmonised {
     );
 
     this.check();
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.ellipsisButton) {
       this.ellipsisButton.removeEventListener(
         'click',
         this.handleClickOnEllipsis
       );
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   handleClickOnEllipsis() {

src/implementations/vanilla/components/breadcrumb-standardised/breadcrumb-standardised.js

@@ -69,15 +69,21 @@ export class BreadcrumbStandardised {
     );
 
     this.check();
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.ellipsisButton) {
       this.ellipsisButton.removeEventListener(
         'click',
         this.handleClickOnEllipsis
       );
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   handleClickOnEllipsis() {

src/implementations/vanilla/components/carousel/carousel.js

@@ -173,12 +173,15 @@ export class Carousel {
     if (this.attachResizeListener) {
       window.addEventListener('resize', this.handleResize);
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.cloneFirstSLide && this.cloneLastSLide) {
       this.cloneFirstSLide.remove();
       this.cloneLastSLide.remove();
@@ -209,6 +212,9 @@ export class Carousel {
     if (this.attachResizeListener) {
       window.removeEventListener('resize', this.handleResize);
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/category-filter/category-filter.js

@@ -62,17 +62,23 @@ export class CategoryFilter {
         item.addEventListener('click', this.handleClickExpand)
       );
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.items) {
       this.items.forEach((item) => {
         item.removeEventListener('click', this.handleClickExpand, false);
       });
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/datepicker/datepicker.js

@@ -111,6 +111,9 @@ export class Datepicker {
       },
     });
 
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
+
     return picker;
   }
 }

src/implementations/vanilla/components/expandable/expandable.js

@@ -86,15 +86,21 @@ export class Expandable {
     if (this.attachClickListener && this.toggle) {
       this.toggle.addEventListener('click', this.handleClickOnToggle);
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.toggle) {
       this.toggle.removeEventListener('click', this.handleClickOnToggle);
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/file-upload/file-upload.js

@@ -77,15 +77,21 @@ export class FileUpload {
     if (this.attachChangeListener && this.fileUploadInput) {
       this.fileUploadInput.addEventListener('change', this.handleChange);
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachChangeListener && this.fileUploadInput) {
       this.fileUploadInput.removeEventListener('change', this.handleChange);
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/file/file.js

@@ -73,18 +73,24 @@ export class FileDownload {
         this.handleClickOnToggle
       );
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.translationToggle) {
       this.translationToggle.removeEventListener(
         'click',
         this.handleClickOnToggle
       );
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/gallery/gallery.js

@@ -239,12 +239,15 @@ export class Gallery {
     if (this.count) {
       this.count.innerHTML = this.galleryItems.length;
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.closeButton) {
       this.closeButton.removeEventListener(
         'click',
@@ -286,6 +289,10 @@ export class Gallery {
     if (this.attachResizeListener) {
       window.removeEventListener('resize', this.handleResize);
     }
+
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/inpage-navigation/inpage-navigation.js

@@ -307,6 +307,9 @@ export class InpageNavigation {
       );
       toggleElement.addEventListener('click', this.handleClickOnToggler);
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
@@ -353,7 +356,7 @@ export class InpageNavigation {
   /**
    * Destroy component instance.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.toggleElement) {
       this.toggleElement.removeEventListener(
         'click',
@@ -368,6 +371,10 @@ export class InpageNavigation {
     this.destroyScrollSpy();
     this.destroySticky();
     this.destroyObserver();
+
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 }
 

src/implementations/vanilla/components/menu/menu.js

@@ -185,12 +185,15 @@ export class Menu {
     setTimeout(() => {
       this.element.classList.add('ecl-menu--transition');
     }, 500);
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.open) {
       this.open.removeEventListener('click', this.handleClickOnOpen);
     }
@@ -240,6 +243,9 @@ export class Menu {
     if (this.attachResizeListener) {
       window.removeEventListener('resize', this.handleResize);
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/message/message.js

@@ -59,15 +59,21 @@ export class Message {
     if (this.attachClickListener && this.close) {
       this.close.addEventListener('click', this.handleClickOnClose);
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.close) {
       this.close.removeEventListener('click', this.handleClickOnClose);
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/news-ticker/news-ticker.js

@@ -143,12 +143,15 @@ export class NewsTicker {
     if (this.attachResizeListener) {
       window.addEventListener('resize', this.handleResize);
     }
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     if (this.attachClickListener && this.toggle) {
       this.toggle.removeEventListener('click', this.handleClickOnToggle);
     }
@@ -167,6 +170,9 @@ export class NewsTicker {
     if (this.attachResizeListener) {
       window.removeEventListener('resize', this.handleResize);
     }
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   /**

src/implementations/vanilla/components/select/select.js

@@ -310,12 +310,15 @@ export class Select {
 
     // Respect default selected options.
     this.updateCurrentValue();
+
+    // Set ecl initialized attribute
+    this.element.setAttribute('data-ecl-auto-initialized', 'true');
   }
 
   /**
    * Destroy component.
    */
-  static destroy() {
+  destroy() {
     this.selectMultiple.removeEventListener('focusout', this.handleFocusout);
     this.input.removeEventListener('keypress', this.handleToggle);
     this.input.removeEventListener('click', this.handleToggle);
@@ -333,6 +336,10 @@ export class Select {
     }
 
     this.select.parentNode.classList.remove('ecl-select__container--hidden');
+
+    if (this.element) {
+      this.element.removeAttribute('data-ecl-auto-initialized');
+    }
   }
 
   updateCurrentValue() {