diff --git a/src/dropdown/dropdown.spec.ts b/src/dropdown/dropdown.spec.ts index 88070d2f03..c83d6313c6 100644 --- a/src/dropdown/dropdown.spec.ts +++ b/src/dropdown/dropdown.spec.ts @@ -83,6 +83,21 @@ describe('ngb-dropdown', () => { expect(getDropdownEl(compiled)).toHaveCssClass('dropup'); }); + it('should have dropdown CSS class if placement is other than top', () => { + const html = ` +
+
+ dropDown item + dropDown item +
+
`; + + const fixture = createTestComponent(html); + const compiled = fixture.nativeElement; + + expect(getDropdownEl(compiled)).toHaveCssClass('dropdown'); + }); + it('should be open initially if open expression is true', () => { const html = `
diff --git a/src/dropdown/dropdown.ts b/src/dropdown/dropdown.ts index 665fceaac7..f551f2e088 100644 --- a/src/dropdown/dropdown.ts +++ b/src/dropdown/dropdown.ts @@ -35,14 +35,16 @@ export class NgbDropdownMenu { applyPlacement(_placement: Placement) { // remove the current placement classes this._renderer.removeClass(this._elementRef.nativeElement.parentElement, 'dropup'); + this._renderer.removeClass(this._elementRef.nativeElement.parentElement, 'dropdown'); this.placement = _placement; /** * apply the new placement - * change the class only in case of top to show up arrow - * or use defualt which is dropdown to show down arrow + * in case of top use up-arrow or down-arrow otherwise */ if (_placement.search('^top') !== -1) { this._renderer.addClass(this._elementRef.nativeElement.parentElement, 'dropup'); + } else { + this._renderer.addClass(this._elementRef.nativeElement.parentElement, 'dropdown'); } } }