fix(drawer): Destroy list in destroy method (#3474)

(cherry picked from commit 325317c)

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_));

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');