From f1895ff680b18dc6b71f420b6a676edf71fd1961 Mon Sep 17 00:00:00 2001
From: Paul Cowan <paul.cowan@bjss.com>
Date: Sun, 23 Dec 2018 10:42:14 +0000
Subject: [PATCH] add innerRef prop to ScaleSVG in @vx/responsive

---
 packages/vx-responsive/src/components/ScaleSVG.js |  7 +++++--
 packages/vx-responsive/test/ScaleSVG.test.js      | 11 +++++++++++
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/packages/vx-responsive/src/components/ScaleSVG.js b/packages/vx-responsive/src/components/ScaleSVG.js
index 3eba28389..ab5edd0e3 100644
--- a/packages/vx-responsive/src/components/ScaleSVG.js
+++ b/packages/vx-responsive/src/components/ScaleSVG.js
@@ -7,7 +7,8 @@ ResponsiveSVG.propTypes = {
   height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   xOrigin: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   yOrigin: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-  preserveAspectRatio: PropTypes.string
+  preserveAspectRatio: PropTypes.string,
+  innerRef: PropTypes.func
 };
 
 export default function ResponsiveSVG({
@@ -16,7 +17,8 @@ export default function ResponsiveSVG({
   height,
   xOrigin = 0,
   yOrigin = 0,
-  preserveAspectRatio = 'xMinYMin meet'
+  preserveAspectRatio = 'xMinYMin meet',
+  innerRef
 }) {
   return (
     <div
@@ -31,6 +33,7 @@ export default function ResponsiveSVG({
       <svg
         preserveAspectRatio={preserveAspectRatio}
         viewBox={`${xOrigin} ${yOrigin} ${width} ${height}`}
+        ref={innerRef}
       >
         {children}
       </svg>
diff --git a/packages/vx-responsive/test/ScaleSVG.test.js b/packages/vx-responsive/test/ScaleSVG.test.js
index 1a1cc0e99..abd199c67 100644
--- a/packages/vx-responsive/test/ScaleSVG.test.js
+++ b/packages/vx-responsive/test/ScaleSVG.test.js
@@ -1,7 +1,18 @@
+import React from 'react';
 import { ScaleSVG } from '../src';
+import { shallow, mount } from 'enzyme';
 
 describe('<ScaleSVG />', () => {
   test('it should be defined', () => {
     expect(ScaleSVG).toBeDefined();
   });
+
+  test('it should expose its ref via an innerRef prop', done => {
+    const refCallback = n => {
+      expect(n.tagName).toEqual('svg');
+      done();
+    };
+
+    mount(<ScaleSVG innerRef={refCallback} />);
+  });
 });