diff --git a/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js b/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js
index a05934961fac2a..af7e296af8cda1 100644
--- a/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js
+++ b/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js
@@ -432,22 +432,67 @@ describe('', () => {
expect(textbox).toHaveFocus();
});
- it('should not be required if a value is selected', () => {
- const { getByRole, setProps } = render(
+ it('has no textbox value', () => {
+ render(
}
multiple
- options={['one', 'two']}
- renderInput={(params) => }
- value={[]}
+ value={['one', 'two']}
/>,
);
- const textbox = getByRole('textbox');
- expect(textbox.hasAttribute('required')).to.equal(true);
+ expect(screen.getByRole('textbox')).to.have.property('value', '');
+ });
+
+ it('should fail validation if a required field has no value', function test() {
+ if (/jsdom/.test(window.navigator.userAgent)) {
+ // Enable once https://github.com/jsdom/jsdom/issues/2898 is resolved
+ this.skip();
+ }
+
+ const handleSubmit = spy((event) => event.preventDefault());
+ render(
+ ,
+ );
+
+ screen.getByRole('button', { name: 'Submit' }).click();
+
+ expect(handleSubmit.callCount).to.equal(0);
+ });
+
+ it('should fail validation if a required field has a value', function test() {
+ // Unclear how native Constraint validation can be enabled for `multiple`
+ if (/jsdom/.test(window.navigator.userAgent)) {
+ // Enable once https://github.com/jsdom/jsdom/issues/2898 is resolved
+ // The test is passing in JSDOM but form validation is buggy in JSDOM so we rather skip than have false confidence
+ this.skip();
+ }
- setProps({ value: ['one'] });
- expect(textbox.hasAttribute('required')).to.equal(false);
+ const handleSubmit = spy((event) => event.preventDefault());
+ render(
+ ,
+ );
+
+ screen.getByRole('button', { name: 'Submit' }).click();
+
+ expect(handleSubmit.callCount).to.equal(0);
});
});
diff --git a/packages/material-ui-lab/src/useAutocomplete/useAutocomplete.js b/packages/material-ui-lab/src/useAutocomplete/useAutocomplete.js
index 069fc19791761f..feea18c89fb067 100644
--- a/packages/material-ui-lab/src/useAutocomplete/useAutocomplete.js
+++ b/packages/material-ui-lab/src/useAutocomplete/useAutocomplete.js
@@ -962,7 +962,6 @@ export default function useAutocomplete(props) {
ref: inputRef,
autoCapitalize: 'none',
spellCheck: 'false',
- ...(multiple && value.length > 0 ? { required: null } : {}),
}),
getClearProps: () => ({
tabIndex: -1,