From 1d7ee3c027a857061ffdd2b22676f677d342d4f7 Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Wed, 21 Feb 2018 11:08:45 -0800 Subject: [PATCH 1/9] fix(chips): Don't trigger ripple from trailing icon --- packages/mdc-chips/chip/adapter.js | 14 ++++++++++++++ packages/mdc-chips/chip/constants.js | 1 + packages/mdc-chips/chip/foundation.js | 17 +++++++++++++++++ packages/mdc-chips/chip/index.js | 12 ++++++++++++ 4 files changed, 44 insertions(+) diff --git a/packages/mdc-chips/chip/adapter.js b/packages/mdc-chips/chip/adapter.js index 96ff1d8c228..3b27cf1d3ef 100644 --- a/packages/mdc-chips/chip/adapter.js +++ b/packages/mdc-chips/chip/adapter.js @@ -61,6 +61,20 @@ class MDCChipAdapter { */ deregisterInteractionHandler(evtType, handler) {} + /** + * Registers an event listener on the trailing icon element for a given event. + * @param {string} evtType + * @param {function(!Event): undefined} handler + */ + registerTrailingIconInteractionHandler(evtType, handler) {} + + /** + * Deregisters an event listener on the trailing icon element for a given event. + * @param {string} evtType + * @param {function(!Event): undefined} handler + */ + deregisterTrailingIconInteractionHandler(evtType, handler) {} + /** * Emits a custom "MDCChip:interaction" event denoting the chip has been * interacted with (typically on click or keydown). diff --git a/packages/mdc-chips/chip/constants.js b/packages/mdc-chips/chip/constants.js index f39f1d9d7ff..48731b4009f 100644 --- a/packages/mdc-chips/chip/constants.js +++ b/packages/mdc-chips/chip/constants.js @@ -18,6 +18,7 @@ /** @enum {string} */ const strings = { INTERACTION_EVENT: 'MDCChip:interaction', + TRAILING_ICON_SELECTOR: '.mdc-chip__icon--trailing', }; /** @enum {string} */ diff --git a/packages/mdc-chips/chip/foundation.js b/packages/mdc-chips/chip/foundation.js index aa5b6b4ee8a..62570a6c52c 100644 --- a/packages/mdc-chips/chip/foundation.js +++ b/packages/mdc-chips/chip/foundation.js @@ -59,18 +59,26 @@ class MDCChipFoundation extends MDCFoundation { /** @private {function(!Event): undefined} */ this.interactionHandler_ = (evt) => this.handleInteraction_(evt); + /** @private {function(!Event): undefined} */ + this.trailingIconInteractionHandler_ = (evt) => this.handleTrailingIconInteraction_(evt); } init() { ['click', 'keydown'].forEach((evtType) => { this.adapter_.registerInteractionHandler(evtType, this.interactionHandler_); }); + ['click', 'touchstart', 'pointerdown', 'mousedown', 'keydown'].forEach((evtType) => { + this.adapter_.registerTrailingIconInteractionHandler(evtType, this.trailingIconInteractionHandler_); + }); } destroy() { ['click', 'keydown'].forEach((evtType) => { this.adapter_.deregisterInteractionHandler(evtType, this.interactionHandler_); }); + ['click', 'touchstart', 'pointerdown', 'mousedown', 'keydown'].forEach((evtType) => { + this.adapter_.deregisterTrailingIconInteractionHandler(evtType, this.trailingIconInteractionHandler_); + }); } /** @@ -93,6 +101,15 @@ class MDCChipFoundation extends MDCFoundation { this.adapter_.notifyInteraction(); } } + + /** + * Handles an interaction event on the trailing icon element. This is used to + * prevent the ripple from activating on interaction with the trailing icon. + * @param {!Event} evt + */ + handleTrailingIconInteraction_(evt) { + evt.stopPropagation(); + } } export default MDCChipFoundation; diff --git a/packages/mdc-chips/chip/index.js b/packages/mdc-chips/chip/index.js index 786149eaf39..3628e4f64fc 100644 --- a/packages/mdc-chips/chip/index.js +++ b/packages/mdc-chips/chip/index.js @@ -67,6 +67,18 @@ class MDCChip extends MDCComponent { hasClass: (className) => this.root_.classList.contains(className), registerInteractionHandler: (evtType, handler) => this.root_.addEventListener(evtType, handler), deregisterInteractionHandler: (evtType, handler) => this.root_.removeEventListener(evtType, handler), + registerTrailingIconInteractionHandler: (evtType, handler) => { + const trailingIconEl = this.root_.querySelector(strings.TRAILING_ICON_SELECTOR); + if (trailingIconEl) { + trailingIconEl.addEventListener(evtType, handler); + } + }, + deregisterTrailingIconInteractionHandler: (evtType, handler) => { + const trailingIconEl = this.root_.querySelector(strings.TRAILING_ICON_SELECTOR); + if (trailingIconEl) { + trailingIconEl.removeEventListener(evtType, handler); + } + }, notifyInteraction: () => this.emit(strings.INTERACTION_EVENT, {chip: this}, true /* shouldBubble */), }))); } From 85c9ee63df5a314eda6204f24c05e4b7485d79c7 Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Wed, 21 Feb 2018 11:16:50 -0800 Subject: [PATCH 2/9] clean up --- packages/mdc-chips/README.md | 2 ++ packages/mdc-chips/chip/foundation.js | 6 ++++-- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/mdc-chips/README.md b/packages/mdc-chips/README.md index 9dc3776a1ed..9483c2f5468 100644 --- a/packages/mdc-chips/README.md +++ b/packages/mdc-chips/README.md @@ -141,6 +141,8 @@ Method Signature | Description `hasClass(className: string) => boolean` | Returns true if the root element contains the given class `registerInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event listener on the root element `deregisterInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event listener on the root element +`registerTrailingIconInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event listener on the trailing icon element +`deregisterTrailingIconInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event listener on the trailing icon element `notifyInteraction() => void` | Emits a custom event "MDCChip:interaction" denoting the chip has been interacted with, which bubbles to the parent `mdc-chip-set` element #### `MDCChipSetAdapter` diff --git a/packages/mdc-chips/chip/foundation.js b/packages/mdc-chips/chip/foundation.js index 62570a6c52c..b4c26d45bb1 100644 --- a/packages/mdc-chips/chip/foundation.js +++ b/packages/mdc-chips/chip/foundation.js @@ -66,8 +66,9 @@ class MDCChipFoundation extends MDCFoundation { init() { ['click', 'keydown'].forEach((evtType) => { this.adapter_.registerInteractionHandler(evtType, this.interactionHandler_); + this.adapter_.registerTrailingIconInteractionHandler(evtType, this.trailingIconInteractionHandler_); }); - ['click', 'touchstart', 'pointerdown', 'mousedown', 'keydown'].forEach((evtType) => { + ['touchstart', 'pointerdown', 'mousedown'].forEach((evtType) => { this.adapter_.registerTrailingIconInteractionHandler(evtType, this.trailingIconInteractionHandler_); }); } @@ -75,8 +76,9 @@ class MDCChipFoundation extends MDCFoundation { destroy() { ['click', 'keydown'].forEach((evtType) => { this.adapter_.deregisterInteractionHandler(evtType, this.interactionHandler_); + this.adapter_.deregisterTrailingIconInteractionHandler(evtType, this.trailingIconInteractionHandler_); }); - ['click', 'touchstart', 'pointerdown', 'mousedown', 'keydown'].forEach((evtType) => { + ['touchstart', 'pointerdown', 'mousedown'].forEach((evtType) => { this.adapter_.deregisterTrailingIconInteractionHandler(evtType, this.trailingIconInteractionHandler_); }); } From 079294459d051fa82bd45494ebf119be22a740ff Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Wed, 21 Feb 2018 12:03:31 -0800 Subject: [PATCH 3/9] Tests --- packages/mdc-chips/chip/foundation.js | 2 ++ .../mdc-chips/mdc-chip.foundation.test.js | 11 +++++++ test/unit/mdc-chips/mdc-chip.test.js | 30 +++++++++++++++++++ 3 files changed, 43 insertions(+) diff --git a/packages/mdc-chips/chip/foundation.js b/packages/mdc-chips/chip/foundation.js index b4c26d45bb1..52f1d8fce70 100644 --- a/packages/mdc-chips/chip/foundation.js +++ b/packages/mdc-chips/chip/foundation.js @@ -47,6 +47,8 @@ class MDCChipFoundation extends MDCFoundation { hasClass: () => {}, registerInteractionHandler: () => {}, deregisterInteractionHandler: () => {}, + registerTrailingIconInteractionHandler: () => {}, + deregisterTrailingIconInteractionHandler: () => {}, notifyInteraction: () => {}, }); } diff --git a/test/unit/mdc-chips/mdc-chip.foundation.test.js b/test/unit/mdc-chips/mdc-chip.foundation.test.js index 44f0a8fc5cb..8dda36d88c0 100644 --- a/test/unit/mdc-chips/mdc-chip.foundation.test.js +++ b/test/unit/mdc-chips/mdc-chip.foundation.test.js @@ -36,6 +36,7 @@ test('exports cssClasses', () => { test('defaultAdapter returns a complete adapter implementation', () => { verifyDefaultAdapter(MDCChipFoundation, [ 'addClass', 'removeClass', 'hasClass', + 'registerTrailingIconInteractionHandler', 'deregisterTrailingIconInteractionHandler', 'registerInteractionHandler', 'deregisterInteractionHandler', 'notifyInteraction', ]); }); @@ -48,6 +49,11 @@ test('#init adds event listeners', () => { td.verify(mockAdapter.registerInteractionHandler('click', td.matchers.isA(Function))); td.verify(mockAdapter.registerInteractionHandler('keydown', td.matchers.isA(Function))); + td.verify(mockAdapter.registerTrailingIconInteractionHandler('click', td.matchers.isA(Function))); + td.verify(mockAdapter.registerTrailingIconInteractionHandler('keydown', td.matchers.isA(Function))); + td.verify(mockAdapter.registerTrailingIconInteractionHandler('touchstart', td.matchers.isA(Function))); + td.verify(mockAdapter.registerTrailingIconInteractionHandler('pointerdown', td.matchers.isA(Function))); + td.verify(mockAdapter.registerTrailingIconInteractionHandler('mousedown', td.matchers.isA(Function))); }); test('#destroy removes event listeners', () => { @@ -56,6 +62,11 @@ test('#destroy removes event listeners', () => { td.verify(mockAdapter.deregisterInteractionHandler('click', td.matchers.isA(Function))); td.verify(mockAdapter.deregisterInteractionHandler('keydown', td.matchers.isA(Function))); + td.verify(mockAdapter.deregisterTrailingIconInteractionHandler('click', td.matchers.isA(Function))); + td.verify(mockAdapter.deregisterTrailingIconInteractionHandler('keydown', td.matchers.isA(Function))); + td.verify(mockAdapter.deregisterTrailingIconInteractionHandler('touchstart', td.matchers.isA(Function))); + td.verify(mockAdapter.deregisterTrailingIconInteractionHandler('pointerdown', td.matchers.isA(Function))); + td.verify(mockAdapter.deregisterTrailingIconInteractionHandler('mousedown', td.matchers.isA(Function))); }); test('#toggleActive adds mdc-chip--activated class if the class does not exist', () => { diff --git a/test/unit/mdc-chips/mdc-chip.test.js b/test/unit/mdc-chips/mdc-chip.test.js index 0ae2ff6bcec..98a36971d03 100644 --- a/test/unit/mdc-chips/mdc-chip.test.js +++ b/test/unit/mdc-chips/mdc-chip.test.js @@ -78,6 +78,36 @@ test('#adapter.deregisterInteractionHandler removes event listener for a given e td.verify(handler(td.matchers.anything()), {times: 0}); }); +test('#adapter.registerTrailingIconInteractionHandler adds event listener for a given event to the trailing' + +'icon element', () => { + const {root, component} = setupTest(); + const icon = bel` + cancel + `; + root.appendChild(icon); + const handler = td.func('click handler'); + component.getDefaultFoundation().adapter_.registerTrailingIconInteractionHandler('click', handler); + domEvents.emit(icon, 'click'); + + td.verify(handler(td.matchers.anything())); +}); + +test('#adapter.deregisterTrailingIconInteractionHandler removes event listener for a given event from the trailing ' + +'icon element', () => { + const {root, component} = setupTest(); + const icon = bel` + cancel + `; + root.appendChild(icon); + const handler = td.func('click handler'); + + icon.addEventListener('click', handler); + component.getDefaultFoundation().adapter_.deregisterTrailingIconInteractionHandler('click', handler); + domEvents.emit(icon, 'click'); + + td.verify(handler(td.matchers.anything()), {times: 0}); +}); + test('#adapter.notifyInteraction emits ' + `${MDCChipFoundation.strings.INTERACTION_EVENT}`, () => { const {component} = setupTest(); From 7acd8129c13910fff6e32d39f1669541f095a577 Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Wed, 21 Feb 2018 14:27:12 -0800 Subject: [PATCH 4/9] emit custom event from trailing icon --- packages/mdc-chips/README.md | 1 + packages/mdc-chips/chip/adapter.js | 6 ++++++ packages/mdc-chips/chip/constants.js | 1 + packages/mdc-chips/chip/foundation.js | 4 ++++ packages/mdc-chips/chip/index.js | 2 ++ .../mdc-chips/mdc-chip.foundation.test.js | 20 +++++++++++++++++++ 6 files changed, 34 insertions(+) diff --git a/packages/mdc-chips/README.md b/packages/mdc-chips/README.md index 9483c2f5468..3005ae7eb9f 100644 --- a/packages/mdc-chips/README.md +++ b/packages/mdc-chips/README.md @@ -144,6 +144,7 @@ Method Signature | Description `registerTrailingIconInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event listener on the trailing icon element `deregisterTrailingIconInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event listener on the trailing icon element `notifyInteraction() => void` | Emits a custom event "MDCChip:interaction" denoting the chip has been interacted with, which bubbles to the parent `mdc-chip-set` element +`notifyTrailingIconInteraction() => void` | Emits a custom event "MDCChip:trailingIconInteraction" denoting the chip's trailing icon has been interacted with, which bubbles to the parent `mdc-chip-set` element #### `MDCChipSetAdapter` diff --git a/packages/mdc-chips/chip/adapter.js b/packages/mdc-chips/chip/adapter.js index 3b27cf1d3ef..2a00ceb49a3 100644 --- a/packages/mdc-chips/chip/adapter.js +++ b/packages/mdc-chips/chip/adapter.js @@ -80,6 +80,12 @@ class MDCChipAdapter { * interacted with (typically on click or keydown). */ notifyInteraction() {} + + /** + * Emits a custom "MDCChip:trailingIconInteraction" event denoting the trailing icon has been + * interacted with (typically on click or keydown). + */ + notifyTrailingIconInteraction() {} } export default MDCChipAdapter; diff --git a/packages/mdc-chips/chip/constants.js b/packages/mdc-chips/chip/constants.js index 48731b4009f..6d4293f40e9 100644 --- a/packages/mdc-chips/chip/constants.js +++ b/packages/mdc-chips/chip/constants.js @@ -18,6 +18,7 @@ /** @enum {string} */ const strings = { INTERACTION_EVENT: 'MDCChip:interaction', + TRAILING_ICON_INTERACTION_EVENT: 'MDCChip:trailingIconInteraction', TRAILING_ICON_SELECTOR: '.mdc-chip__icon--trailing', }; diff --git a/packages/mdc-chips/chip/foundation.js b/packages/mdc-chips/chip/foundation.js index 52f1d8fce70..f535884087e 100644 --- a/packages/mdc-chips/chip/foundation.js +++ b/packages/mdc-chips/chip/foundation.js @@ -50,6 +50,7 @@ class MDCChipFoundation extends MDCFoundation { registerTrailingIconInteractionHandler: () => {}, deregisterTrailingIconInteractionHandler: () => {}, notifyInteraction: () => {}, + notifyTrailingIconInteraction: () => {}, }); } @@ -113,6 +114,9 @@ class MDCChipFoundation extends MDCFoundation { */ handleTrailingIconInteraction_(evt) { evt.stopPropagation(); + if (evt.type === 'click' || evt.key === 'Enter' || evt.keyCode === 13) { + this.adapter_.notifyTrailingIconInteraction(); + } } } diff --git a/packages/mdc-chips/chip/index.js b/packages/mdc-chips/chip/index.js index 3628e4f64fc..953c63ceb1c 100644 --- a/packages/mdc-chips/chip/index.js +++ b/packages/mdc-chips/chip/index.js @@ -80,6 +80,8 @@ class MDCChip extends MDCComponent { } }, notifyInteraction: () => this.emit(strings.INTERACTION_EVENT, {chip: this}, true /* shouldBubble */), + notifyTrailingIconInteraction: () => this.emit( + strings.TRAILING_ICON_INTERACTION_EVENT, {chip: this}, true /* shouldBubble */), }))); } diff --git a/test/unit/mdc-chips/mdc-chip.foundation.test.js b/test/unit/mdc-chips/mdc-chip.foundation.test.js index 8dda36d88c0..a87482f6646 100644 --- a/test/unit/mdc-chips/mdc-chip.foundation.test.js +++ b/test/unit/mdc-chips/mdc-chip.foundation.test.js @@ -38,6 +38,7 @@ test('defaultAdapter returns a complete adapter implementation', () => { 'addClass', 'removeClass', 'hasClass', 'registerTrailingIconInteractionHandler', 'deregisterTrailingIconInteractionHandler', 'registerInteractionHandler', 'deregisterInteractionHandler', 'notifyInteraction', + 'notifyTrailingIconInteraction', ]); }); @@ -101,3 +102,22 @@ test('on click, emit custom event', () => { td.verify(mockAdapter.notifyInteraction()); }); + +test('on click in trailing icon, emit custom event', () => { + const {foundation, mockAdapter} = setupTest(); + const mockEvt = { + type: 'click', + stopPropagation: () => {}, + }; + let click; + + td.when(mockAdapter.registerTrailingIconInteractionHandler('click', td.matchers.isA(Function))) + .thenDo((evtType, handler) => { + click = handler; + }); + + foundation.init(); + click(mockEvt); + + td.verify(mockAdapter.notifyTrailingIconInteraction()); +}); From ceb19dd63e9a4a38601ea3111214a1cad0d7549a Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Wed, 21 Feb 2018 14:34:04 -0800 Subject: [PATCH 5/9] Add test --- test/unit/mdc-chips/mdc-chip.test.js | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/test/unit/mdc-chips/mdc-chip.test.js b/test/unit/mdc-chips/mdc-chip.test.js index 98a36971d03..32764245b47 100644 --- a/test/unit/mdc-chips/mdc-chip.test.js +++ b/test/unit/mdc-chips/mdc-chip.test.js @@ -120,6 +120,18 @@ test('#adapter.notifyInteraction emits ' + td.verify(handler(td.matchers.anything())); }); +test('#adapter.notifyTrailingIconInteraction emits ' + + `${MDCChipFoundation.strings.INTERACTION_EVENT}`, () => { + const {component} = setupTest(); + const handler = td.func('interaction handler'); + + component.listen( + MDCChipFoundation.strings.TRAILING_ICON_INTERACTION_EVENT, handler); + component.getDefaultFoundation().adapter_.notifyTrailingIconInteraction(); + + td.verify(handler(td.matchers.anything())); +}); + function setupMockFoundationTest(root = getFixture()) { const MockFoundationConstructor = td.constructor(MDCChipFoundation); const mockFoundation = new MockFoundationConstructor(); From 99a82e961b93cf5a4aefd2c91817bc415dc15ed8 Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Wed, 21 Feb 2018 15:27:07 -0800 Subject: [PATCH 6/9] Nits --- packages/mdc-chips/README.md | 4 ++-- .../mdc-chips/mdc-chip.foundation.test.js | 19 +++++-------------- test/unit/mdc-chips/mdc-chip.test.js | 6 ++---- 3 files changed, 9 insertions(+), 20 deletions(-) diff --git a/packages/mdc-chips/README.md b/packages/mdc-chips/README.md index 3005ae7eb9f..dc318170a3b 100644 --- a/packages/mdc-chips/README.md +++ b/packages/mdc-chips/README.md @@ -143,8 +143,8 @@ Method Signature | Description `deregisterInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event listener on the root element `registerTrailingIconInteractionHandler(evtType: string, handler: EventListener) => void` | Registers an event listener on the trailing icon element `deregisterTrailingIconInteractionHandler(evtType: string, handler: EventListener) => void` | Deregisters an event listener on the trailing icon element -`notifyInteraction() => void` | Emits a custom event "MDCChip:interaction" denoting the chip has been interacted with, which bubbles to the parent `mdc-chip-set` element -`notifyTrailingIconInteraction() => void` | Emits a custom event "MDCChip:trailingIconInteraction" denoting the chip's trailing icon has been interacted with, which bubbles to the parent `mdc-chip-set` element +`notifyInteraction() => void` | Emits a custom event `MDCChip:interaction` denoting the chip has been interacted with, which bubbles to the parent `mdc-chip-set` element +`notifyTrailingIconInteraction() => void` | Emits a custom event `MDCChip:trailingIconInteraction` denoting the chip's trailing icon has been interacted with, which bubbles to the parent `mdc-chip-set` element #### `MDCChipSetAdapter` diff --git a/test/unit/mdc-chips/mdc-chip.foundation.test.js b/test/unit/mdc-chips/mdc-chip.foundation.test.js index a87482f6646..63561daf012 100644 --- a/test/unit/mdc-chips/mdc-chip.foundation.test.js +++ b/test/unit/mdc-chips/mdc-chip.foundation.test.js @@ -17,7 +17,7 @@ import {assert} from 'chai'; import td from 'testdouble'; -import {verifyDefaultAdapter} from '../helpers/foundation'; +import {verifyDefaultAdapter, captureHandlers} from '../helpers/foundation'; import {setupFoundationTest} from '../helpers/setup'; import MDCChipFoundation from '../../../packages/mdc-chips/chip/foundation'; @@ -88,36 +88,27 @@ test('#toggleActive removes mdc-chip--activated class if the class exists', () = test('on click, emit custom event', () => { const {foundation, mockAdapter} = setupTest(); + const handlers = captureHandlers(mockAdapter, 'registerInteractionHandler'); const mockEvt = { type: 'click', }; - let click; - - td.when(mockAdapter.registerInteractionHandler('click', td.matchers.isA(Function))).thenDo((evtType, handler) => { - click = handler; - }); foundation.init(); - click(mockEvt); + handlers.click(mockEvt); td.verify(mockAdapter.notifyInteraction()); }); test('on click in trailing icon, emit custom event', () => { const {foundation, mockAdapter} = setupTest(); + const handlers = captureHandlers(mockAdapter, 'registerTrailingIconInteractionHandler'); const mockEvt = { type: 'click', stopPropagation: () => {}, }; - let click; - - td.when(mockAdapter.registerTrailingIconInteractionHandler('click', td.matchers.isA(Function))) - .thenDo((evtType, handler) => { - click = handler; - }); foundation.init(); - click(mockEvt); + handlers.click(mockEvt); td.verify(mockAdapter.notifyTrailingIconInteraction()); }); diff --git a/test/unit/mdc-chips/mdc-chip.test.js b/test/unit/mdc-chips/mdc-chip.test.js index 32764245b47..386ebb373f6 100644 --- a/test/unit/mdc-chips/mdc-chip.test.js +++ b/test/unit/mdc-chips/mdc-chip.test.js @@ -108,8 +108,7 @@ test('#adapter.deregisterTrailingIconInteractionHandler removes event listener f td.verify(handler(td.matchers.anything()), {times: 0}); }); -test('#adapter.notifyInteraction emits ' + - `${MDCChipFoundation.strings.INTERACTION_EVENT}`, () => { +test('#adapter.notifyInteraction emits ' + MDCChipFoundation.strings.INTERACTION_EVENT, () => { const {component} = setupTest(); const handler = td.func('interaction handler'); @@ -120,8 +119,7 @@ test('#adapter.notifyInteraction emits ' + td.verify(handler(td.matchers.anything())); }); -test('#adapter.notifyTrailingIconInteraction emits ' + - `${MDCChipFoundation.strings.INTERACTION_EVENT}`, () => { +test('#adapter.notifyTrailingIconInteraction emits ' + MDCChipFoundation.strings.INTERACTION_EVENT, () => { const {component} = setupTest(); const handler = td.func('interaction handler'); From 865134a40094bc6d1d0323a46aff5b60d1141a67 Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Fri, 23 Feb 2018 11:27:30 -0800 Subject: [PATCH 7/9] Check that stopPropagation is called --- test/unit/mdc-chips/mdc-chip.foundation.test.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/test/unit/mdc-chips/mdc-chip.foundation.test.js b/test/unit/mdc-chips/mdc-chip.foundation.test.js index 63561daf012..22028bf9410 100644 --- a/test/unit/mdc-chips/mdc-chip.foundation.test.js +++ b/test/unit/mdc-chips/mdc-chip.foundation.test.js @@ -104,11 +104,12 @@ test('on click in trailing icon, emit custom event', () => { const handlers = captureHandlers(mockAdapter, 'registerTrailingIconInteractionHandler'); const mockEvt = { type: 'click', - stopPropagation: () => {}, + stopPropagation: td.func('stopPropagation'), }; foundation.init(); handlers.click(mockEvt); td.verify(mockAdapter.notifyTrailingIconInteraction()); + td.verify(mockEvt.stopPropagation()); }); From 0441134873af402ec2b3f496192c89e14e3c3fd8 Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Fri, 23 Feb 2018 11:51:48 -0800 Subject: [PATCH 8/9] typo --- test/unit/mdc-chips/mdc-chip.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/unit/mdc-chips/mdc-chip.test.js b/test/unit/mdc-chips/mdc-chip.test.js index 386ebb373f6..4650275cebd 100644 --- a/test/unit/mdc-chips/mdc-chip.test.js +++ b/test/unit/mdc-chips/mdc-chip.test.js @@ -119,7 +119,7 @@ test('#adapter.notifyInteraction emits ' + MDCChipFoundation.strings.INTERACTION td.verify(handler(td.matchers.anything())); }); -test('#adapter.notifyTrailingIconInteraction emits ' + MDCChipFoundation.strings.INTERACTION_EVENT, () => { +test('#adapter.notifyTrailingIconInteraction emits ' + MDCChipFoundation.strings.TRAILING_ICON_INTERACTION_EVENT, () => { const {component} = setupTest(); const handler = td.func('interaction handler'); From dd0b8a2a5ff0fe8d1dcdd9af565350ea20b6eae8 Mon Sep 17 00:00:00 2001 From: Bonnie Zhou Date: Fri, 23 Feb 2018 14:00:59 -0800 Subject: [PATCH 9/9] Lint --- test/unit/mdc-chips/mdc-chip.test.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/test/unit/mdc-chips/mdc-chip.test.js b/test/unit/mdc-chips/mdc-chip.test.js index 4650275cebd..24e1d34eb3c 100644 --- a/test/unit/mdc-chips/mdc-chip.test.js +++ b/test/unit/mdc-chips/mdc-chip.test.js @@ -119,7 +119,8 @@ test('#adapter.notifyInteraction emits ' + MDCChipFoundation.strings.INTERACTION td.verify(handler(td.matchers.anything())); }); -test('#adapter.notifyTrailingIconInteraction emits ' + MDCChipFoundation.strings.TRAILING_ICON_INTERACTION_EVENT, () => { +test('#adapter.notifyTrailingIconInteraction emits ' + + MDCChipFoundation.strings.TRAILING_ICON_INTERACTION_EVENT, () => { const {component} = setupTest(); const handler = td.func('interaction handler');