Merge pull request #1800 from exadel-inc/fix/togglable-attr-change

fix(esl-togglable): open attribute change behavior
exadel-inc · Jul 25, 2023 · a921763 · a921763
2 parents 8fbae0b + 1a13082
commit a921763
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/src/modules/esl-toggleable/core/esl-toggleable-dispatcher.ts b/src/modules/esl-toggleable/core/esl-toggleable-dispatcher.ts
@@ -18,7 +18,7 @@ export class ESLToggleableDispatcher extends ESLBaseElement {
    * Uses esl-toggleable-dispatcher tag and document body root by default
    */
   public static init(root: HTMLElement = document.body, tagName: string = this.is): void {
-    if (!root) throw new Error('Root element should be specified');
+    if (!root) throw new Error('[ESL]: Root element should be specified');
     const instances = root.getElementsByTagName(tagName);
     if (instances.length) return;
     this.register(tagName);

diff --git a/src/modules/esl-toggleable/core/esl-toggleable.ts b/src/modules/esl-toggleable/core/esl-toggleable.ts
@@ -148,10 +148,12 @@ export class ESLToggleable extends ESLBaseElement {
   protected override attributeChangedCallback(attrName: string, oldVal: string, newVal: string): void {
     if (!this.connected || newVal === oldVal) return;
     switch (attrName) {
-      case 'open':
-        if (this.open === this.hasAttribute('open')) return;
-        this.toggle(this.open, {initiator: 'attribute', showDelay: 0, hideDelay: 0});
+      case 'open': {
+        const isOpen = this.hasAttribute('open');
+        if (this.open === isOpen) return;
+        this.toggle(isOpen, {initiator: 'attribute', showDelay: 0, hideDelay: 0});
         break;
+      }
       case 'group':
         this.$$fire(this.GROUP_CHANGED_EVENT, {
           detail: {oldGroupName: oldVal, newGroupName: newVal}