From 983e858b7b41d7390104cc7e601cd6546337db88 Mon Sep 17 00:00:00 2001
From: Sorrel Bri <sorrel.bri.june@gmail.com>
Date: Tue, 26 Nov 2019 18:44:07 -0800
Subject: [PATCH] stub phonetic Features

---
 src/PhonoChangeApplier.js       |  2 ++
 src/components/Features.js      |  8 +++++---
 src/components/Features.test.js | 27 +++++++++++++++++++++++++++
 3 files changed, 34 insertions(+), 3 deletions(-)
 create mode 100644 src/components/Features.test.js

diff --git a/src/PhonoChangeApplier.js b/src/PhonoChangeApplier.js
index 1dec8b6..53b6ff3 100644
--- a/src/PhonoChangeApplier.js
+++ b/src/PhonoChangeApplier.js
@@ -2,6 +2,7 @@ import React, { useState } from 'react';
 import './PhonoChangeApplier.scss';
 
 import ProtoLang from './components/ProtoLang';
+import Features from './components/Features';
 
 const PhonoChangeApplier = () => {
   const [ lexicon, setLexicon ] = useState(['one'])
@@ -9,6 +10,7 @@ const PhonoChangeApplier = () => {
   return (
     <div className="PhonoChangeApplier" data-testid="PhonoChangeApplier">
       <ProtoLang lexicon={lexicon} setLexicon={setLexicon}/>
+      <Features />
     </div>
   );
 }
diff --git a/src/components/Features.js b/src/components/Features.js
index a852fdd..0bfabfd 100644
--- a/src/components/Features.js
+++ b/src/components/Features.js
@@ -2,9 +2,11 @@ import React from 'react';
 import './Features.scss';
 
 const Features = () => {
-  return (<>
-  
-  </>);
+  return (
+    <div className="Features" data-testid="Features">
+      <h3>Phonetic Features</h3>
+    </div>
+  );
 }
 
 export default Features;
\ No newline at end of file
diff --git a/src/components/Features.test.js b/src/components/Features.test.js
new file mode 100644
index 0000000..351877d
--- /dev/null
+++ b/src/components/Features.test.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import Features from './Features';
+import renderer from 'react-test-renderer';
+import { exportAllDeclaration } from '@babel/types';
+import {render} from '@testing-library/react';
+import extendExpect from '@testing-library/jest-dom/extend-expect'
+
+it('renders Features without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<Features />, div);
+  ReactDOM.unmountComponentAtNode(div);
+});
+
+
+
+describe('Features', () => {
+  it('renders the correct subtitle', () => {
+    const { getByTestId } = render(<Features />);
+    expect(getByTestId('Features')).toHaveTextContent('Phonetic Features');
+  })
+  
+  // it('renders lexicon from state', () => {
+  //   const { getByTestId } = render(<Features />);
+  //   expect(getByTestId('Features'));
+  // })
+})
\ No newline at end of file