diff --git a/client/homebrew/pages/editPage/editPage.jsx b/client/homebrew/pages/editPage/editPage.jsx
index d5af310b5..0086a7c9a 100644
--- a/client/homebrew/pages/editPage/editPage.jsx
+++ b/client/homebrew/pages/editPage/editPage.jsx
@@ -390,7 +390,7 @@ const EditPage = createClass({
 			{this.renderNavbar()}
 
 			<div className='content'>
-				<SplitPane onDragFinish={this.handleSplitMove} ref='pane'>
+				<SplitPane onDragFinish={this.handleSplitMove}>
 					<Editor
 						ref='editor'
 						brew={this.state.brew}
diff --git a/client/homebrew/pages/homePage/homePage.jsx b/client/homebrew/pages/homePage/homePage.jsx
index 3d3139e74..4195e56b6 100644
--- a/client/homebrew/pages/homePage/homePage.jsx
+++ b/client/homebrew/pages/homePage/homePage.jsx
@@ -79,7 +79,7 @@ const HomePage = createClass({
 			{this.renderNavbar()}
 
 			<div className='content'>
-				<SplitPane onDragFinish={this.handleSplitMove} ref='pane'>
+				<SplitPane onDragFinish={this.handleSplitMove}>
 					<Editor
 						ref='editor'
 						brew={this.state.brew}
diff --git a/client/homebrew/pages/newPage/newPage.jsx b/client/homebrew/pages/newPage/newPage.jsx
index 9877651c2..c71e2b67b 100644
--- a/client/homebrew/pages/newPage/newPage.jsx
+++ b/client/homebrew/pages/newPage/newPage.jsx
@@ -213,7 +213,7 @@ const NewPage = createClass({
 		return <div className='newPage sitePage'>
 			{this.renderNavbar()}
 			<div className='content'>
-				<SplitPane onDragFinish={this.handleSplitMove} ref='pane'>
+				<SplitPane onDragFinish={this.handleSplitMove}>
 					<Editor
 						ref='editor'
 						brew={this.state.brew}
diff --git a/client/homebrew/pages/printPage/printPage.jsx b/client/homebrew/pages/printPage/printPage.jsx
index 9a5a80dbf..4cd9e0df6 100644
--- a/client/homebrew/pages/printPage/printPage.jsx
+++ b/client/homebrew/pages/printPage/printPage.jsx
@@ -103,7 +103,7 @@ const PrintPage = createClass({
 			<link href={`/themes/${rendererPath}/${themePath}/style.css`} type="text/css" rel='stylesheet'/>
 			{/* Apply CSS from Style tab */}
 			{this.renderStyle()}
-			<div className='pages' ref='pages' lang={this.state.brew.lang}>
+			<div className='pages' lang={this.state.brew.lang}>
 				{this.renderPages()}
 			</div>
 		</div>;
diff --git a/shared/naturalcrit/splitPane/splitPane.jsx b/shared/naturalcrit/splitPane/splitPane.jsx
index 2101480dc..4b12dec48 100644
--- a/shared/naturalcrit/splitPane/splitPane.jsx
+++ b/shared/naturalcrit/splitPane/splitPane.jsx
@@ -24,6 +24,9 @@ const SplitPane = createClass({
 		};
 	},
 
+	pane1 : React.createRef(null),
+	pane2 : React.createRef(null),
+
 	componentDidMount : function() {
 		const dividerPos = window.localStorage.getItem(this.props.storageKey);
 		if(dividerPos){
@@ -137,7 +140,6 @@ const SplitPane = createClass({
 	render : function(){
 		return <div className='splitPane' onPointerMove={this.handleMove} onPointerUp={this.handleUp}>
 			<Pane
-				ref='pane1'
 				width={this.state.currentDividerPos}
 			>
 				{React.cloneElement(this.props.children[0], {
@@ -147,7 +149,7 @@ const SplitPane = createClass({
 				})}
 			</Pane>
 			{this.renderDivider()}
-			<Pane ref='pane2' isDragging={this.state.isDragging}>{this.props.children[1]}</Pane>
+			<Pane isDragging={this.state.isDragging}>{this.props.children[1]}</Pane>
 		</div>;
 	}
 });