fix(dropdown): fix bottom position for dropdownlist (#4626)

Closes to #4545
valor-software · Dec 12, 2018 · 6e04b33 · 6e04b33 · anndyd · Apr 19, 2019
1 parent 583068a
commit 6e04b33
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 6 deletions.
diff --git a/src/dropdown/bs-dropdown.directive.ts b/src/dropdown/bs-dropdown.directive.ts
@@ -358,13 +358,19 @@ export class BsDropdownDirective implements OnInit, OnDestroy {
         'transform',
         this.dropup ? 'translateY(-101%)' : 'translateY(0)'
       );
+      this._renderer.setStyle(
+        this._inlinedMenu.rootNodes[0],
+        'bottom',
+        'auto'
+      );
     }
   }
 
   private removeDropupStyles(): void {
     if (this._inlinedMenu && this._inlinedMenu.rootNodes[0]) {
       this._renderer.removeStyle(this._inlinedMenu.rootNodes[0], 'top');
       this._renderer.removeStyle(this._inlinedMenu.rootNodes[0], 'transform');
+      this._renderer.removeStyle(this._inlinedMenu.rootNodes[0], 'bottom');
     }
   }
 }
diff --git a/src/spec/bs-dropdown.directive.spec.ts b/src/spec/bs-dropdown.directive.spec.ts
@@ -18,6 +18,7 @@ class TestDropdownComponent {
   isOpenChangeValue: Boolean = false;
   insideClick: Boolean = false;
   container: String = '';
+  placement: String = '';
 
   constructor(config: BsDropdownConfig) {
     Object.assign(this, config);
@@ -313,16 +314,17 @@ describe('Directive: Dropdown', () => {
     expect(element.querySelector('[dropdown]').classList).not.toContain('open');
   });
 
-  it('should open if isBs3 method return true', () => {
+  it('should open if isBs3 method return true', fakeAsync(() => {
+    context.placement = 'bottom';
     const tempVal = window.__theme;
     window.__theme = 'bs4';
-    expect(element.querySelector('[dropdown]').classList).not.toContain('open');
-    element.querySelector('button').click();
     fixture.detectChanges();
-    expect(element.querySelector('[dropdown]').classList).toContain('open');
     element.querySelector('button').click();
     fixture.detectChanges();
-    expect(element.querySelector('[dropdown]').classList).not.toContain('open');
+    expect(element.querySelector('[dropdown]').classList).toContain('open');
+    expect(element.querySelector('[dropdownToggle]').getAttribute('aria-expanded')).toEqual('true');
+    tick();
+    expect(element.querySelector('[dropdown]').classList).toContain('open');
     window.__theme = tempVal;
-  });
+  }));
 });