fix(Dropdown): fic missing .show class on dropdown toggle when active (…

…#6508)
react-bootstrap · Nov 30, 2022 · eaa4bb9 · eaa4bb9
1 parent a15da05
commit eaa4bb9
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 7 deletions.
diff --git a/src/DropdownToggle.tsx b/src/DropdownToggle.tsx
@@ -1,15 +1,14 @@
+import useMergedRefs from '@restart/hooks/useMergedRefs';
+import DropdownContext from '@restart/ui/DropdownContext';
+import { useDropdownToggle } from '@restart/ui/DropdownToggle';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import * as React from 'react';
 import { useContext } from 'react';
-import { useDropdownToggle } from '@restart/ui/DropdownToggle';
-import DropdownContext from '@restart/ui/DropdownContext';
-import useMergedRefs from '@restart/hooks/useMergedRefs';
 import Button, { ButtonProps, CommonButtonProps } from './Button';
-import InputGroupContext from './InputGroupContext';
+import { BsPrefixRefForwardingComponent } from './helpers';
 import { useBootstrapPrefix } from './ThemeProvider';
 import useWrappedRefWithWarning from './useWrappedRefWithWarning';
-import { BsPrefixRefForwardingComponent } from './helpers';
 
 export interface DropdownToggleProps extends Omit<ButtonProps, 'as'> {
   as?: React.ElementType;
@@ -64,7 +63,6 @@ const DropdownToggle: DropdownToggleComponent = React.forwardRef(
   ) => {
     const prefix = useBootstrapPrefix(bsPrefix, 'dropdown-toggle');
     const dropdownContext = useContext(DropdownContext);
-    const isInputGroup = useContext(InputGroupContext);
 
     if (childBsPrefix !== undefined) {
       (props as any).bsPrefix = childBsPrefix;
@@ -85,7 +83,7 @@ const DropdownToggle: DropdownToggleComponent = React.forwardRef(
           className,
           prefix,
           split && `${prefix}-split`,
-          !!isInputGroup && dropdownContext?.show && 'show',
+          dropdownContext?.show && 'show',
         )}
         {...toggleProps}
         {...props}

diff --git a/test/DropdownSpec.tsx b/test/DropdownSpec.tsx
@@ -230,6 +230,13 @@ describe('<Dropdown>', () => {
       onToggleSpy.getCall(0).args[0].should.equal(true);
       onToggleSpy.getCall(0).args[1].source.should.equal('keydown');
     });
+
+    it('Should render .show on the dropdown toggle when outside an InputGroup', () => {
+      const { getByText } = render(
+        <Dropdown show>{dropdownChildren}</Dropdown>,
+      );
+      getByText('Child Title').classList.contains('show').should.be.true;
+    });
   });
 
   it('should use each components bsPrefix', () => {