[autocomplete] Fix ArrowLeft crash when value is not set with single-value rendering

packages/mui-material/src/Autocomplete/Autocomplete.test.js

@@ -3709,4 +3709,47 @@ describe('<Autocomplete />', () => {
 
     expect(screen.getByTestId('label')).to.have.attribute('data-shrink', 'false');
   });
+
+  it('should not throw error on pressing left key with no value in single value rendering', () => {
+    render(
+      <Autocomplete
+        options={['one', 'two', 'three']}
+        renderValue={(value, getItemProps) => {
+          return value ? <Chip label={value} {...getItemProps()} /> : null;
+        }}
+        renderInput={(params) => <TextField {...params} autoFocus />}
+      />,
+    );
+
+    const textbox = screen.getByRole('combobox');
+
+    expect(() => {
+      fireEvent.keyDown(textbox, { key: 'ArrowLeft' });
+    }).not.to.throw();
+
+    expect(textbox).toHaveFocus();
+  });
+
+  it('should not throw error on pressing left key with input text but no value in single value rendering', () => {
+    render(
+      <Autocomplete
+        options={['one', 'two', 'three']}
+        renderValue={(value, getItemProps) => {
+          return value ? <Chip label={value} {...getItemProps()} /> : null;
+        }}
+        renderInput={(params) => <TextField {...params} autoFocus />}
+      />,
+    );
+
+    const textbox = screen.getByRole('combobox');
+
+    fireEvent.change(textbox, { target: { value: 'on' } });
+
+    expect(() => {
+      fireEvent.keyDown(textbox, { key: 'ArrowLeft' });
+    }).not.to.throw();
+
+    expect(textbox).to.have.property('value', 'on');
+    expect(textbox).toHaveFocus();
+  });
 });

packages/mui-material/src/useAutocomplete/useAutocomplete.js

@@ -270,7 +270,7 @@ function useAutocomplete(props) {
     } else {
       // Using `data-tag-index` for deprecated `renderTags`. Remove when `renderTags` is gone.
       const indexType = renderValue ? 'data-item-index' : 'data-tag-index';
-      anchorEl.querySelector(`[${indexType}="${itemToFocus}"]`).focus();
+      anchorEl.querySelector(`[${indexType}="${itemToFocus}"]`)?.focus();
     }
   });