From 95280a21fee318040c1d35d7fa96c3bf31056b87 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 1 Sep 2016 19:31:12 -0700
Subject: [PATCH 1/2] Adding a _resolveRef helper to create memoized helpers to
 resolve refs.

---
 ...mponent.test.ts => BaseComponent.test.tsx} | 25 +++++++++++++++++++
 src/common/BaseComponent.ts                   | 24 ++++++++++++++++++
 2 files changed, 49 insertions(+)
 rename src/common/{BaseComponent.test.ts => BaseComponent.test.tsx} (72%)

diff --git a/src/common/BaseComponent.test.ts b/src/common/BaseComponent.test.tsx
similarity index 72%
rename from src/common/BaseComponent.test.ts
rename to src/common/BaseComponent.test.tsx
index 91955bcbc6b38..1a273de1b62d3 100644
--- a/src/common/BaseComponent.test.ts
+++ b/src/common/BaseComponent.test.tsx
@@ -1,3 +1,12 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+
+import * as ReactDOM from 'react-dom';
+import * as ReactTestUtils from 'react-addons-test-utils';
+
+let { expect } = chai;
+
 import { BaseComponent } from './BaseComponent';
 
 let { assert } = chai;
@@ -54,6 +63,22 @@ describe('BaseComponent', () => {
   _buildTestFor('render');
   _buildTestFor('componentDidUpdate');
   _buildTestFor('componentWillUnmount');
+
+  it('can resolve refs', () => {
+    class Foo extends BaseComponent<{}, {}> {
+      public root: HTMLElement;
+
+      public render() {
+        return <div ref={ this._resolveRef('root') } />;
+      }
+    }
+
+    let component = ReactTestUtils.renderIntoDocument(
+      <Foo />
+    ) as any;
+
+    expect(component.root).to.exist;
+  });
 });
 
 function _buildTestFor(methodName) {
diff --git a/src/common/BaseComponent.ts b/src/common/BaseComponent.ts
index 3fc781cfabe49..6e7a5d86c8774 100644
--- a/src/common/BaseComponent.ts
+++ b/src/common/BaseComponent.ts
@@ -18,6 +18,7 @@ export class BaseComponent<P, S> extends React.Component<P, S> {
   private __async: Async;
   private __events: EventGroup;
   private __disposables: IDisposable[];
+  private __resolves: { [ name: string ]: (ref: any) => any };
 
   /**
    * BaseComponent constructor
@@ -103,6 +104,29 @@ export class BaseComponent<P, S> extends React.Component<P, S> {
 
     return this.__events;
   }
+
+  /**
+   * Helper to return a memoized ref resolver function.
+   * @params refName Name of the member to assign the ref to.
+   *
+   * @examples
+   * class Foo extends BaseComponent<...> {
+   *   private _root: HTMLElement;
+   *
+   *   public render() {
+   *     return <div ref={ this._resolveRef('_root') } />
+   *   }
+   * }
+   */
+  protected _resolveRef(refName: string) {
+    if (!this.__resolves) {
+      this.__resolves = {};
+    }
+    if (!this.__resolves[refName]) {
+      this.__resolves[refName] = (ref) => this[refName] = ref;
+    }
+    return this.__resolves[refName];
+  }
 }
 
 /**

From 14be9bd03cb7092f142aba735316fa1b80415abd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 2 Sep 2016 12:16:33 -0700
Subject: [PATCH 2/2] Cleaning up tslint.

---
 src/common/BaseComponent.test.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/common/BaseComponent.test.tsx b/src/common/BaseComponent.test.tsx
index 1a273de1b62d3..7c647990d2a7a 100644
--- a/src/common/BaseComponent.test.tsx
+++ b/src/common/BaseComponent.test.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-addons-test-utils';
 
 let { expect } = chai;