WIP updated from review

material-components · Dec 6, 2018 · 1e861da · 1e861da
1 parent b66522a
commit 1e861da
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 21 deletions.
diff --git a/packages/mdc-tab-bar/README.md b/packages/mdc-tab-bar/README.md
@@ -133,7 +133,7 @@ Method Signature | Description
 `getTabListLength() => number` | Returns the number of child Tab components.
 `getPreviousActiveTabIndex() => number` | Returns the index of the previously active Tab.
 `getFocusedTabIndex() => number` | Returns the index of the focused Tab.
-`getIndexOfTab(tab: MDCTab) => number` | Returns the index of the given Tab instance.
+`getIndexOfTabById(id: string) => number` | Returns the index of the given Tab ID.
 `notifyTabActivated(index: number) => void` | Emits the `MDCTabBar:activated` event.
 
 ### `MDCTabBarFoundation`

diff --git a/packages/mdc-tab-bar/adapter.js b/packages/mdc-tab-bar/adapter.js
@@ -25,7 +25,6 @@
 
 /* eslint-disable no-unused-vars */
 import {MDCTabDimensions} from '@material/tab/adapter';
-import {MDCTabFoundation} from '@material/tab/index';
 /* eslint-enable no-unused-vars */
 
 /**
@@ -137,7 +136,7 @@ class MDCTabBarAdapter {
    * @param {string} id The ID of the tab whose index to determine
    * @return {number}
    */
-  getIndexOfTabByID(id) {}
+  getIndexOfTabById(id) {}
 
   /**
    * Emits the MDCTabBar:activated event

diff --git a/packages/mdc-tab-bar/foundation.js b/packages/mdc-tab-bar/foundation.js
@@ -89,7 +89,7 @@ class MDCTabBarFoundation extends MDCFoundation {
       getTabDimensionsAtIndex: () => {},
       getPreviousActiveTabIndex: () => {},
       getFocusedTabIndex: () => {},
-      getIndexOfTabByID: () => {},
+      getIndexOfTabById: () => {},
       getTabListLength: () => {},
       notifyTabActivated: () => {},
     });
@@ -174,7 +174,7 @@ class MDCTabBarFoundation extends MDCFoundation {
    * @param {!Event} evt
    */
   handleTabInteraction(evt) {
-    this.adapter_.setActiveTab(this.adapter_.getIndexOfTabByID(evt.detail.tabId));
+    this.adapter_.setActiveTab(this.adapter_.getIndexOfTabById(evt.detail.tabId));
   }
 
   /**

diff --git a/packages/mdc-tab-bar/index.js b/packages/mdc-tab-bar/index.js
@@ -45,15 +45,9 @@ class MDCTabBar extends MDCComponent {
     /** @private {!Array<!MDCTab>} */
     this.tabList_;
 
-    /** @type {(function(!Element): !MDCTab)} */
-    this.tabFactory_;
-
     /** @private {?MDCTabScroller} */
     this.tabScroller_;
 
-    /** @type {(function(!Element): !MDCTabScroller)} */
-    this.tabScrollerFactory_;
-
     /** @private {?function(?Event): undefined} */
     this.handleTabInteraction_;
 
@@ -84,10 +78,8 @@ class MDCTabBar extends MDCComponent {
   initialize(
     tabFactory = (el) => new MDCTab(el),
     tabScrollerFactory = (el) => new MDCTabScroller(el)) {
-    this.tabFactory_ = tabFactory;
-    this.tabScrollerFactory_ = tabScrollerFactory;
-    this.tabList_ = this.instantiateTabs_(this.tabFactory_);
-    this.tabScroller_ = this.instantiateTabsScroller_(this.tabScrollerFactory_);
+    this.tabList_ = this.instantiateTabs_(tabFactory);
+    this.tabScroller_ = this.instantiateTabScroller_(tabScrollerFactory);
   }
 
   initialSyncWithDOM() {
@@ -144,7 +136,7 @@ class MDCTabBar extends MDCComponent {
           const activeElement = document.activeElement;
           return tabElements.indexOf(activeElement);
         },
-        getIndexOfTabByID: (id) => {
+        getIndexOfTabById: (id) => {
           for (let i = 0; i < this.tabList_.length; i++) {
             if (this.tabList_[i].id === id) {
               return i;
@@ -202,7 +194,7 @@ class MDCTabBar extends MDCComponent {
    * @return {!MDCTabScroller=}
    * @private
    */
-  instantiateTabsScroller_(tabScrollerFactory) {
+  instantiateTabScroller_(tabScrollerFactory) {
     const tabScrollerElement = this.root_.querySelector(MDCTabBarFoundation.strings.TAB_SCROLLER_SELECTOR);
     if (tabScrollerElement) {
       return tabScrollerFactory(tabScrollerElement);

diff --git a/packages/mdc-tab/README.md b/packages/mdc-tab/README.md
@@ -154,7 +154,7 @@ Method Signature | Description
 
 Event Name | Event Data Structure | Description
 --- | --- | ---
-`MDCTab:interacted` | `{"detail": {"tab": MDCTab}}` | Emitted when the Tab is interacted with, regardless of its active state. Used by parent components to know which Tab to activate.
+`MDCTab:interacted` | `{"detail": {"tabId": string}}` | Emitted when the Tab is interacted with, regardless of its active state. Used by parent components to know which Tab to activate.
 
 ## Usage within Web Frameworks
 

diff --git a/test/unit/mdc-tab-bar/foundation.test.js b/test/unit/mdc-tab-bar/foundation.test.js
@@ -48,7 +48,7 @@ test('defaultAdapter returns a complete adapter implementation', () => {
     'getOffsetWidth', 'isRTL', 'setActiveTab',
     'activateTabAtIndex', 'deactivateTabAtIndex', 'focusTabAtIndex',
     'getTabIndicatorClientRectAtIndex', 'getTabDimensionsAtIndex',
-    'getPreviousActiveTabIndex', 'getFocusedTabIndex', 'getIndexOfTabByID', 'getTabListLength',
+    'getPreviousActiveTabIndex', 'getFocusedTabIndex', 'getIndexOfTabById', 'getTabListLength',
     'notifyTabActivated',
   ]);
 });

diff --git a/test/unit/mdc-tab-bar/mdc-tab-bar.test.js b/test/unit/mdc-tab-bar/mdc-tab-bar.test.js
@@ -208,10 +208,10 @@ test('#adapter.getPreviousActiveTabIndex returns the index of the active tab', (
   assert.strictEqual(component.getDefaultFoundation().adapter_.getPreviousActiveTabIndex(), 1);
 });
 
-test('#adapter.getIndexOfTabByID; returns the index of the given tab', () => {
+test('#adapter.getIndexOfTabById returns the index of the given tab', () => {
   const {component} = setupTest();
   const tab = component.tabList_[2];
-  assert.strictEqual(component.getDefaultFoundation().adapter_.getIndexOfTabByID(tab.id), 2);
+  assert.strictEqual(component.getDefaultFoundation().adapter_.getIndexOfTabById(tab.id), 2);
 });
 
 test('#adapter.getTabListLength returns the length of the tab list', () => {