fix(ComboBox): fix fully controlled story and delete test story (#18680)

Author: adamalston

packages/react/src/components/ComboBox/ComboBox-test.js

@@ -330,7 +330,7 @@ describe('ComboBox', () => {
       expect(findInputNode()).toHaveDisplayValue(mockProps.items[1]);
     });
 
-    it('should not revert to initialSelectedItem after clearing selection in uncontrolled mode', async () => {
+    it('should not revert to `initialSelectedItem` after clearing selection in uncontrolled mode', async () => {
       // Render a non-fully controlled `ComboBox` using `initialSelectedItem`.
       render(
         <ComboBox {...mockProps} initialSelectedItem={mockProps.items[0]} />
@@ -348,7 +348,7 @@ describe('ComboBox', () => {
       expect(findInputNode()).toHaveDisplayValue('');
     });
 
-    it('should ignore updates to initialSelectedItem after initial render in uncontrolled mode', async () => {
+    it('should ignore updates to `initialSelectedItem` after initial render in uncontrolled mode', async () => {
       // Render a non-fully controlled `ComboBox` using `initialSelectedItem`.
       const { rerender } = render(
         <ComboBox {...mockProps} initialSelectedItem={mockProps.items[0]} />

packages/react/src/components/ComboBox/ComboBox.stories.js

@@ -384,14 +384,14 @@ export const _fullyControlled = (args) => {
   return (
     <div>
       <ComboBox
+        {...args}
         onChange={onChange}
         id="carbon-combobox"
         items={options}
         selectedItem={value}
         itemToString={(item) => (item ? item.text : '')}
         titleText="Fully Controlled ComboBox title"
         helperText="Combobox helper text"
-        {...args}
       />
       <div
         style={{
@@ -410,32 +410,6 @@ export const _fullyControlled = (args) => {
 
 _fullyControlled.argTypes = { ...sharedArgTypes };
 
-export const _fullyControlled2 = () => {
-  const [selectedItem, setSelectedItem] = useState(null);
-
-  return (
-    <div
-      style={{
-        display: 'flex',
-        flexDirection: 'column',
-        gap: '1rem',
-        width: '256px',
-      }}>
-      <ComboBox
-        id="carbon-combobox"
-        items={['1', '2', '3']}
-        onChange={({ selectedItem }) => setSelectedItem(selectedItem)}
-        selectedItem={selectedItem}
-        titleText="Fully Controlled ComboBox title"
-      />
-      <Button kind="danger" onClick={() => setSelectedItem(null)} size="md">
-        Reset
-      </Button>
-      <p>Selected value: {`${selectedItem}`}</p>
-    </div>
-  );
-};
-
 AutocompleteWithTypeahead.argTypes = {
   onChange: { action: 'onChange' },
 };