fix(FeedSummary): add missing space around content (#3836)

* missing space * wrap feed summary content shorthand in whitespace * test feed summary content whitespace
Semantic-Org · Dec 8, 2019 · 55386d6 · 55386d6
1 parent 32df9e8
commit 55386d6
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 0 deletions.
diff --git a/src/views/Feed/FeedSummary.js b/src/views/Feed/FeedSummary.js
@@ -33,7 +33,13 @@ function FeedSummary(props) {
   return (
     <ElementType {...rest} className={classes}>
       {createShorthand(FeedUser, (val) => ({ content: val }), user, { autoGenerateKey: false })}
+      {/*
+        Content styles require wrapping whitespace
+        https://github.com/Semantic-Org/Semantic-UI-React/pull/3836
+      */}
+      {content && ' '}
       {content}
+      {content && ' '}
       {createShorthand(FeedDate, (val) => ({ content: val }), date, { autoGenerateKey: false })}
     </ElementType>
   )

diff --git a/test/specs/views/Feed/FeedSummary-test.js b/test/specs/views/Feed/FeedSummary-test.js
@@ -1,3 +1,4 @@
+import React from 'react'
 import FeedSummary from 'src/views/Feed/FeedSummary'
 import FeedDate from 'src/views/Feed/FeedDate'
 import FeedUser from 'src/views/Feed/FeedUser'
@@ -19,4 +20,10 @@ describe('FeedSummary', () => {
     ShorthandComponent: FeedUser,
     mapValueToProps: (val) => ({ content: val }),
   })
+
+  describe('content', () => {
+    it('inserts whitespace on both sides of the content', () => {
+      shallow(<FeedSummary content='test' />).should.contain.text(' test ')
+    })
+  })
 })