diff --git a/packages/mdc-drawer/index.js b/packages/mdc-drawer/index.js index 631c498d7f6..832b887db13 100644 --- a/packages/mdc-drawer/index.js +++ b/packages/mdc-drawer/index.js @@ -61,6 +61,9 @@ class MDCDrawer extends MDCComponent { /** @private {?Function} */ this.handleScrimClick_; + + /** @private {?MDCList} */ + this.list_; } /** @@ -92,10 +95,13 @@ class MDCDrawer extends MDCComponent { } initialize( - focusTrapFactory = createFocusTrap) { + focusTrapFactory = createFocusTrap, + listFactory = (el) => new MDCList(el)) { const listEl = /** @type {!Element} */ (this.root_.querySelector(`.${MDCListFoundation.cssClasses.ROOT}`)); - const list = MDCList.attachTo(listEl); - list.wrapFocus = true; + if (listEl) { + this.list_ = listFactory(listEl); + this.list_.wrapFocus = true; + } this.focusTrapFactory_ = focusTrapFactory; } @@ -121,6 +127,10 @@ class MDCDrawer extends MDCComponent { this.root_.removeEventListener('keydown', this.handleKeydown_); this.root_.removeEventListener('transitionend', this.handleTransitionEnd_); + if (this.list_) { + this.list_.destroy(); + } + const {MODAL} = MDCDismissibleDrawerFoundation.cssClasses; if (this.root_.classList.contains(MODAL)) { this.scrim_.removeEventListener('click', /** @type {!Function} */ (this.handleScrimClick_)); diff --git a/test/unit/mdc-drawer/mdc-drawer.test.js b/test/unit/mdc-drawer/mdc-drawer.test.js index 2d843d9406b..ffae01d2a1b 100644 --- a/test/unit/mdc-drawer/mdc-drawer.test.js +++ b/test/unit/mdc-drawer/mdc-drawer.test.js @@ -71,8 +71,13 @@ function setupTestWithMocks(variantClass = cssClasses.DISMISSIBLE) { activate: () => {}, deactivate: () => {}, }); - const component = new MDCDrawer(drawer, mockFoundation, () => mockFocusTrapInstance); - return {root, drawer, component, mockFoundation, mockFocusTrapInstance}; + const mockList = td.object({ + wrapFocus: () => {}, + destroy: () => {}, + }); + + const component = new MDCDrawer(drawer, mockFoundation, () => mockFocusTrapInstance, () => mockList); + return {root, drawer, component, mockFoundation, mockFocusTrapInstance, mockList}; } suite('MDCDrawer'); @@ -134,6 +139,13 @@ test('#destroy removes transitionend event listener', () => { td.verify(mockFoundation.handleTransitionEnd(td.matchers.isA(Object)), {times: 0}); }); +test('#destroy calls destroy on list', () => { + const {component, mockList} = setupTestWithMocks(); + component.destroy(); + + td.verify(mockList.destroy(), {times: 1}); +}); + test('adapter#addClass adds class to drawer', () => { const {component, drawer} = setupTest(); component.getDefaultFoundation().adapter_.addClass('test-class');