feat(chips): Add setSelectedFromChipset method

packages/mdc-chips/README.md

@@ -310,6 +310,7 @@ Method Signature | Description
 `focusPrimaryAction() => void` | Proxies to the foundation's `focusPrimaryAction` method
 `focusTrailingAction() => void` | Proxies to the foundation's `focusTrailingAction` method
 `removeFocus() => void` | Proxies to the foundation's `removeFocus` method
+`setSelectedFromChipset(selected: boolean) => void` | Proxies to the foundation's `setSelectedFromChipset` method (only called from the chip set)
 
 Property | Value Type | Description
 --- | --- | ---
@@ -392,7 +393,7 @@ Method Signature | Description
 --- | ---
 `hasClass(className: string) => boolean` | Returns whether the chip set element has the given class
 `removeChipAtIndex(index: number) => void` | Removes the chip with the given `index` from the chip set
-`selectChipAtIndex(index: string, selected: boolean) => void` | Sets the selected state of the chip at the given `index`
+`selectChipAtIndex(index: string, selected: boolean) => void` | Calls `MDCChip#setSelectedFromChipset(selected)` on the chip at the given `index`
 `getIndexOfChipById(id: string) => number` | Returns the index of the chip with the matching `id` or -1
 `focusChipPrimaryActionAtIndex(index: number) => void` | Calls `MDCChip#focusPrimaryAction()` on the chip at the given `index`
 `focusChipTrailingActionAtIndex(index: number) => void` | Calls `MDCChip#focusTrailingAction()` on the chip at the given `index`
@@ -408,6 +409,7 @@ Method Signature | Description
 --- | ---
 `isSelected() => boolean` | Returns true if the chip is selected
 `setSelected(selected: boolean) => void` | Sets the chip's selected state
+`setSelectedFromChipset(selected: boolean) => void` | Sets the chip's selected state (called from the chip set)
 `getShouldRemoveOnTrailingIconClick() => boolean` | Returns whether a trailing icon click should trigger exit/removal of the chip
 `setShouldRemoveOnTrailingIconClick(shouldRemove: boolean) => void` | Sets whether a trailing icon click should trigger exit/removal of the chip
 `getDimensions() => ClientRect` | Returns the dimensions of the chip. This is used for applying ripple to the chip.

packages/mdc-chips/chip-set/component.ts

@@ -132,7 +132,7 @@ export class MDCChipSet extends MDCComponent<MDCChipSetFoundation> {
       },
       selectChipAtIndex: (index, selected) => {
         if (index >= 0 && index < this.chips_.length) {
-          this.chips_[index].selected = selected;
+          this.chips_[index].setSelectedFromChipset(selected);
         }
       },
     };

packages/mdc-chips/chip/component.ts

@@ -217,6 +217,10 @@ export class MDCChip extends MDCComponent<MDCChipFoundation> implements MDCRippl
     return new MDCChipFoundation(adapter);
   }
 
+  setSelectedFromChipset(selected: boolean) {
+    this.foundation_.setSelectedFromChipset(selected);
+  }
+
   focusPrimaryAction() {
     this.foundation_.focusPrimaryAction();
   }

packages/mdc-chips/chip/foundation.ts

@@ -84,14 +84,11 @@ export class MDCChipFoundation extends MDCFoundation<MDCChipAdapter> {
   }
 
   setSelected(selected: boolean) {
-    if (selected) {
-      this.adapter_.addClass(cssClasses.SELECTED);
-      this.adapter_.setPrimaryActionAttr(strings.ARIA_CHECKED, 'true');
-    } else {
-      this.adapter_.removeClass(cssClasses.SELECTED);
-      this.adapter_.setPrimaryActionAttr(strings.ARIA_CHECKED, 'false');
-    }
-    this.adapter_.notifySelection(selected);
+    this.setSelected_(selected, true);
+  }
+
+  setSelectedFromChipset(selected: boolean) {
+    this.setSelected_(selected, false);
   }
 
   getShouldRemoveOnTrailingIconClick() {
@@ -327,6 +324,20 @@ export class MDCChipFoundation extends MDCFoundation<MDCChipAdapter> {
     const isDeletable = this.adapter_.hasClass(cssClasses.DELETABLE);
     return isDeletable && (evt.key === strings.BACKSPACE_KEY || evt.key === strings.DELETE_KEY);
   }
+
+  private setSelected_(selected: boolean, shouldNotify: boolean) {
+    if (selected) {
+      this.adapter_.addClass(cssClasses.SELECTED);
+      this.adapter_.setPrimaryActionAttr(strings.ARIA_CHECKED, 'true');
+    } else {
+      this.adapter_.removeClass(cssClasses.SELECTED);
+      this.adapter_.setPrimaryActionAttr(strings.ARIA_CHECKED, 'false');
+    }
+
+    if (shouldNotify) {
+      this.adapter_.notifySelection(selected);
+    }
+  }
 }
 
 // tslint:disable-next-line:no-default-export Needed for backward compatibility with MDC Web v0.44.0 and earlier.

test/unit/mdc-chips/mdc-chip-set.test.js

@@ -57,6 +57,7 @@ class FakeChip {
     this.focusTrailingAction = td.func('.focusTrailingAction');
     this.remove = td.func('.remove');
     this.removeFocus = td.func('.removeFocus');
+    this.setSelectedFromChipset = td.func('.setSelectedFromChipset');
     this.selected = false;
   }
 }
@@ -177,11 +178,11 @@ test('#adapter.removeChipAtIndex does nothing if the given object is not in the
   assert.equal(component.chips.length, 3);
 });
 
-test('#adapter.selectChipAtIndex sets selected on chip object', () => {
+test('#adapter.selectChipAtIndex calls setSelectedFromChipset on chip object', () => {
   const {component} = setupTest();
   const chip = component.chips[0];
   component.getDefaultFoundation().adapter_.selectChipAtIndex(0, true);
-  assert.equal(chip.selected, true);
+  td.verify(chip.setSelectedFromChipset(true));
 });
 
 test('#adapter.getChipListCount returns the number of chips', () => {

test/unit/mdc-chips/mdc-chip.foundation.test.js

@@ -92,18 +92,25 @@ test('#setSelected sets aria-checked="false" if false', () => {
   td.verify(mockAdapter.setPrimaryActionAttr(strings.ARIA_CHECKED, 'false'));
 });
 
-test('#setSelected removes calls adapter.notifySelection when selected is true', () => {
+test('#setSelected notifies of selection when selected is true', () => {
   const {foundation, mockAdapter} = setupTest();
   foundation.setSelected(true);
   td.verify(mockAdapter.notifySelection(true));
 });
 
-test('#setSelected removes calls adapter.notifySelection when selected is false', () => {
+test('#setSelected notifies of unselection when selected is false', () => {
   const {foundation, mockAdapter} = setupTest();
   foundation.setSelected(false);
   td.verify(mockAdapter.notifySelection(false));
 });
 
+test('#setSelectedFromChipset does not notify', () => {
+  const {foundation, mockAdapter} = setupTest();
+  foundation.setSelectedFromChipset(false);
+  foundation.setSelectedFromChipset(true);
+  td.verify(mockAdapter.notifySelection(td.matchers.isA(Boolean)), {times: 0});
+});
+
 test('#getDimensions returns adapter.getRootBoundingClientRect when there is no checkmark bounding rect', () => {
   const {foundation, mockAdapter} = setupTest();
   td.when(mockAdapter.getCheckmarkBoundingClientRect()).thenReturn(null);

test/unit/mdc-chips/mdc-chip.test.js

@@ -420,6 +420,12 @@ test('#set shouldRemoveOnTrailingIconClick proxies to foundation', () => {
   td.verify(mockFoundation.setShouldRemoveOnTrailingIconClick(false));
 });
 
+test('#setSelectedFromChipset proxies to the same foundation method', () => {
+  const {component, mockFoundation} = setupMockFoundationTest();
+  component.setSelectedFromChipset(true);
+  td.verify(mockFoundation.setSelectedFromChipset(true));
+});
+
 test('#beginExit proxies to foundation', () => {
   const {component, mockFoundation} = setupMockFoundationTest();
   component.beginExit();