From 96056f43efa9ff4e317e4460627f028cf46afc8d Mon Sep 17 00:00:00 2001
From: Devin Howard <devin@callysto.com>
Date: Sat, 2 Dec 2017 12:45:05 -0800
Subject: [PATCH] TopicCard/Title.spec.js (#1165)

---
 .../test/components/TopicCard/Title.spec.js   | 68 +++++++++++++++++++
 .../test/components/TopicCard/index.spec.js   |  2 +-
 2 files changed, 69 insertions(+), 1 deletion(-)
 create mode 100644 frontend/test/components/TopicCard/Title.spec.js

diff --git a/frontend/test/components/TopicCard/Title.spec.js b/frontend/test/components/TopicCard/Title.spec.js
new file mode 100644
index 00000000..b2b6e7c1
--- /dev/null
+++ b/frontend/test/components/TopicCard/Title.spec.js
@@ -0,0 +1,68 @@
+/* global describe, it */
+import React from 'react'
+import { expect } from 'chai'
+import { shallow } from 'enzyme'
+import sinon from 'sinon'
+
+import { RIETextArea } from 'riek'
+
+import Title from '../../../src/components/TopicCard/Title.js'
+
+function render(props) {
+  return shallow(<Title {...props} />)
+}
+
+const name = 'name 1'
+
+function assertParentTitleSpan(wrapper) {
+  it('wraps everything in span.title', function() {
+    expect(wrapper.props().className).to.equal('title')
+    expect(wrapper.type()).to.equal('span')
+  })
+}
+
+describe('Title', function() {
+  describe('not authorized to edit', function() {
+    const wrapper = render({ authorizedToEdit: false, name })
+
+    assertParentTitleSpan(wrapper)
+
+    it('renders the name in span.titleWrapper', function() {
+      expect(wrapper.find('.titleWrapper').text()).to.have.string(name)
+      expect(wrapper.find('.titleWrapper').type()).to.equal('span')
+    })
+  })
+
+  describe('authorized to edit', function() {
+    const onChange = sinon.spy()
+    const wrapper = render({ authorizedToEdit: true, onChange, name })
+    const textArea = wrapper.find('.titleWrapper')
+
+    assertParentTitleSpan(wrapper)
+
+    it('renders RIETextArea with correct value', function() {
+      expect(textArea.type()).to.equal(RIETextArea)
+      expect(textArea.props().value).to.equal(name)
+    })
+
+    it('RIETextArea props are correct', function() {
+      expect(textArea.props().id).to.equal('titleActivator')
+      expect(textArea.props().classEditing).to.equal('riek-editing')
+    })
+
+    it('calls onChange on Enter', function() {
+      // simulate pressing Enter
+      textArea.props().editProps.onKeyPress({
+        which: 13, preventDefault: () => {}, target: { value: 'new name' }
+      })
+
+      expect(onChange.calledOnce).to.equal(true)
+      expect(onChange.calledWithExactly({ name: 'new name' }))
+    })
+
+    it('renders a namecounter', function() {
+      expect(wrapper.find('.nameCounter').props().className).to.equal('nameCounter')
+      expect(wrapper.find('.nameCounter').text()).to.have.string(`${name.length}/140`)
+    })
+  })
+})
diff --git a/frontend/test/components/TopicCard/index.spec.js b/frontend/test/components/TopicCard/index.spec.js
index 2cd30c19..87023603 100644
--- a/frontend/test/components/TopicCard/index.spec.js
+++ b/frontend/test/components/TopicCard/index.spec.js
@@ -47,8 +47,8 @@ function assertCssClassPresent({ mockTopicParam, mockTopicValue, cssClass }) {
 }
 
 describe('TopicCard', function() {
-  const wrapper = render({ openTopic: null })
   describe('topic is null', function() {
+    const wrapper = render({ openTopic: null })
     it('returns null', function() {
       expect(wrapper.type()).to.be.null
     })