autocomplete(chips): deleting chips breaks ability to add or render new chips

[Splaktar]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

Deleting chips should not break the ability to add or render other chips.

What is the current behavior?

We support multi value with separator comma, enter, space and tab.
It works good as long as we don't delete any chip. As soon as we delete the chip, nothing works.
We made sure model looks good even after deleting but somehow md-item-template doesn't get rendered.

CodePen and steps to reproduce the issue:

CodePen Demo which shows your issue: TBD

<md-chips
      flex="100"
      md-autocomplete-snap
      class="..."
      readonly="..."
      ng-model="..."
      ng-if="..."
      md-transform-chip="..."
      md-on-remove="...">
</md-chips>

Detailed Reproduction Steps: TBD

What is the use-case or motivation for changing an existing behavior?

It worked as expected in 1.1.7.

Which versions of AngularJS, Material, OS, and browsers are affected?

AngularJS Material 1.1.7
Others TBD

Is there anything else we should know? Stack Traces, Screenshots, etc.

Verified that this is fixed by reverting #11166 in #11214.

[Splaktar]

@jelbourn the issue mentions md-item-template, but I assume that it means md-chip-template?
Do you have any details on what that template looks like?

It also appears that the custom logic within the md-transform-chip and md-on-remove expressions could be causing the problem here. If the md-transform-chip expression starts returning null, this will block chips from being created.

I tested this on the docs for HEAD and I cannot reproduce any problems related to deleting and adding more chips.

[Splaktar]

This demo is pretty close to the example that we were given and everything seems to work properly against HEAD. We need more details in order to reproduce this issue.

[Splaktar]

@jelbourn Here is a Demo where md-on-remove can cause md-transform-chip to start returning null and blocking chip creation. Is this what is happening? Is this behavior (chip being removed when it should be added) what the team is seeing?

[hetal0713]

Hi Splaktar,

@jelbourn reported issue on behalf of me. See my comments below

@jelbourn the issue mentions md-item-template, but I assume that it means md-chip-template?
Do you have any details on what that template looks like?

yes its chip template. Below is template (some info changed from original template)

    <md-chip-template
        username-chip
        class="xyz"
        ng-class="{'invalidTag': $chip.invalid}">
      <span>
         {{$chip.name}}
      </span>
      <md-tooltip>
        {{$chip.name}}
        <span ng-if="$chip.xyz">({{$chip.xyz}})</span>
        <span ng-if="$chip.abc">({{$chip.abc}})</span>
      </md-tooltip>
    </md-chip-template>

@jelbourn Here is a Demo where md-on-remove can cause md-transform-chip to start returning null and blocking chip creation. Is this what is happening? Is this behavior (chip being removed when it should be added) what the team is seeing?

Yes we are seeing issue on chip removal. As soon as we remove the chip, it starts creating new chips. I wasn't able to add chips in the demo link you gave. if i enter "abc xyz" and press tab.. it doesn't create chips. It doesn't even create for single output.