Repository: mui/material-ui (TypeScript)
Date: 2020-04-29 23:49:35+00:00
Task type: Bug Fix

Issue:
[Autocomplete] Missing support for limitTags={0}
In the  api document,'the maximum number of tags that will be visible when not focused. Set -1 to disable the limit'. But I set 0 also disable the limit.Dose the limitTags api support value of 0.

Thanks! 


Issue discussion:
I don't think that it matters, I'm closing, prefer -1.
@oliviertassinari  Sorry,I did not express clearly.I means, does Autocomplete support  maximum  number of tag of 0.
In other word, when I set 0, it should display none tag.
Thanks!
@tykdn Thanks for the clarification. What do you think of this fix? Do you want to submit a pull request? :)

```diff
diff --git a/packages/material-ui-lab/src/Autocomplete/Autocomplete.js b/packages/material-ui-lab/src/Autocomplete/Autocomplete.js
index f6c58d99a..cd9a300cb 100644
--- a/packages/material-ui-lab/src/Autocomplete/Autocomplete.js
+++ b/packages/material-ui-lab/src/Autocomplete/Autocomplete.js
@@ -350,7 +350,7 @@ const Autocomplete = React.forwardRef(function Autocomplete(props, ref) {

   if (limitTags > -1 && Array.isArray(startAdornment)) {
     const more = startAdornment.length - limitTags;
-    if (limitTags && !focused && more > 0) {
+    if (!focused && more > 0) {
       startAdornment = startAdornment.splice(0, limitTags);
       startAdornment.push(
         <span className={classes.tag} key={startAdornment.length}>
```
@oliviertassinari Yes, the fix looks good,I am glad to submit a pull request:).

Solution patch:
diff --git a/packages/material-ui-lab/src/Autocomplete/Autocomplete.js b/packages/material-ui-lab/src/Autocomplete/Autocomplete.js
--- a/packages/material-ui-lab/src/Autocomplete/Autocomplete.js
+++ b/packages/material-ui-lab/src/Autocomplete/Autocomplete.js
@@ -350,7 +350,7 @@ const Autocomplete = React.forwardRef(function Autocomplete(props, ref) {
 
   if (limitTags > -1 && Array.isArray(startAdornment)) {
     const more = startAdornment.length - limitTags;
-    if (limitTags && !focused && more > 0) {
+    if (!focused && more > 0) {
       startAdornment = startAdornment.splice(0, limitTags);
       startAdornment.push(
         <span className={classes.tag} key={startAdornment.length}>


Test patch:
diff --git a/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js b/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js
--- a/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js
+++ b/packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js
@@ -145,24 +145,41 @@ describe('<Autocomplete />', () => {
     it('show all items on focus', () => {
       const { container, getAllByRole, getByRole } = render(
         <Autocomplete
+          {...defaultProps}
           multiple
           limitTags={2}
-          {...defaultProps}
           options={['one', 'two', 'three']}
           defaultValue={['one', 'two', 'three']}
           renderInput={(params) => <TextField {...params} />}
         />,
       );
 
-      let tags;
-      tags = getAllByRole('button');
       expect(container.textContent).to.equal('onetwo+1');
-      expect(tags.length).to.be.equal(4);
+      expect(getAllByRole('button')).to.have.lengthOf(4);
+
+      getByRole('textbox').focus();
+      expect(container.textContent).to.equal('onetwothree');
+      expect(getAllByRole('button')).to.have.lengthOf(5);
+    });
+
+    it('show 0 item on close when set 0 to limitTags', () => {
+      const { container, getAllByRole, getByRole } = render(
+        <Autocomplete
+          {...defaultProps}
+          multiple
+          limitTags={0}
+          options={['one', 'two', 'three']}
+          defaultValue={['one', 'two', 'three']}
+          renderInput={(params) => <TextField {...params} />}
+        />,
+      );
+
+      expect(container.textContent).to.equal('+3');
+      expect(getAllByRole('button')).to.have.lengthOf(2);
 
       getByRole('textbox').focus();
-      tags = getAllByRole('button');
       expect(container.textContent).to.equal('onetwothree');
-      expect(tags.length).to.be.equal(5);
+      expect(getAllByRole('button')).to.have.lengthOf(5);
     });
   });