[UI-AUTO] add IDs to last 10 posts' text (#6257)

5 files changed, 26 insertions, 9 deletions

diff --git a/webapp/components/post_view/components/post.jsx b/webapp/components/post_view/components/post.jsx
index 8ca84aa20..1959d5cad 100644
--- a/webapp/components/post_view/components/post.jsx
+++ b/webapp/components/post_view/components/post.jsx
@@ -22,7 +22,7 @@ export default class Post extends Component {
         sameUser: PropTypes.bool,
         sameRoot: PropTypes.bool,
         hideProfilePic: PropTypes.bool,
-        isLastPost: PropTypes.bool,
+        lastPostCount: PropTypes.number,
         isLastComment: PropTypes.bool,
         shouldHighlight: PropTypes.bool,
         displayNameType: PropTypes.string,
@@ -137,6 +137,10 @@ export default class Post extends Component {
             return true;
         }
 
+        if (nextProps.lastPostCount !== this.props.lastPostCount) {
+            return true;
+        }
+
         return false;
     }
 
@@ -306,7 +310,7 @@ export default class Post extends Component {
                                 post={post}
                                 currentUser={this.props.currentUser}
                                 sameRoot={this.props.sameRoot}
-                                isLastPost={this.props.isLastPost}
+                                lastPostCount={this.props.lastPostCount}
                                 parentPost={parentPost}
                                 handleCommentClick={this.handleCommentClick}
                                 compactDisplay={this.props.compactDisplay}
diff --git a/webapp/components/post_view/components/post_body.jsx b/webapp/components/post_view/components/post_body.jsx
index 108605eea..2ad9f96d1 100644
--- a/webapp/components/post_view/components/post_body.jsx
+++ b/webapp/components/post_view/components/post_body.jsx
@@ -51,6 +51,10 @@ export default class PostBody extends React.Component {
             return true;
         }
 
+        if (nextProps.lastPostCount !== this.props.lastPostCount) {
+            return true;
+        }
+
         return false;
     }
 
@@ -164,7 +168,7 @@ export default class PostBody extends React.Component {
             >
                 {loading}
                 <PostMessageContainer
-                    isLastPost={this.props.isLastPost}
+                    lastPostCount={this.props.lastPostCount}
                     post={this.props.post}
                 />
             </div>
@@ -208,7 +212,7 @@ PostBody.propTypes = {
     currentUser: React.PropTypes.object.isRequired,
     parentPost: React.PropTypes.object,
     retryPost: React.PropTypes.func,
-    isLastPost: React.PropTypes.bool,
+    lastPostCount: React.PropTypes.number,
     handleCommentClick: React.PropTypes.func.isRequired,
     compactDisplay: React.PropTypes.bool,
     previewCollapsed: React.PropTypes.string,
diff --git a/webapp/components/post_view/components/post_list.jsx b/webapp/components/post_view/components/post_list.jsx
index 483ff78c8..f233884ac 100644
--- a/webapp/components/post_view/components/post_list.jsx
+++ b/webapp/components/post_view/components/post_list.jsx
@@ -339,7 +339,7 @@ export default class PostList extends React.Component {
                 <Post
                     key={keyPrefix + 'postKey'}
                     ref={post.id}
-                    isLastPost={i === 0}
+                    lastPostCount={(i >= 0 && i < Constants.TEST_ID_COUNT) ? i : -1}
                     sameUser={sameUser}
                     sameRoot={sameRoot}
                     post={post}
diff --git a/webapp/components/post_view/components/post_message_container.jsx b/webapp/components/post_view/components/post_message_container.jsx
index 5d324ba46..4cb3cb76c 100644
--- a/webapp/components/post_view/components/post_message_container.jsx
+++ b/webapp/components/post_view/components/post_message_container.jsx
@@ -16,7 +16,7 @@ export default class PostMessageContainer extends React.Component {
     static propTypes = {
         post: React.PropTypes.object.isRequired,
         options: React.PropTypes.object,
-        isLastPost: React.PropTypes.bool
+        lastPostCount: React.PropTypes.number
     };
 
     static defaultProps = {
@@ -91,7 +91,7 @@ export default class PostMessageContainer extends React.Component {
             <PostMessageView
                 options={this.props.options}
                 post={this.props.post}
-                isLastPost={this.props.isLastPost}
+                lastPostCount={this.props.lastPostCount}
                 emojis={this.state.emojis}
                 enableFormatting={this.state.enableFormatting}
                 mentionKeys={this.state.mentionKeys}
diff --git a/webapp/components/post_view/components/post_message_view.jsx b/webapp/components/post_view/components/post_message_view.jsx
index 5b0790f36..d6610f813 100644
--- a/webapp/components/post_view/components/post_message_view.jsx
+++ b/webapp/components/post_view/components/post_message_view.jsx
@@ -22,7 +22,7 @@ export default class PostMessageView extends React.Component {
         usernameMap: React.PropTypes.object.isRequired,
         channelNamesMap: React.PropTypes.object.isRequired,
         team: React.PropTypes.object.isRequired,
-        isLastPost: React.PropTypes.bool
+        lastPostCount: React.PropTypes.number
     };
 
     shouldComponentUpdate(nextProps) {
@@ -55,6 +55,10 @@ export default class PostMessageView extends React.Component {
             return true;
         }
 
+        if (nextProps.lastPostCount !== this.props.lastPostCount) {
+            return true;
+        }
+
         // Don't check if props.usernameMap changes since it is very large and inefficient to do so.
         // This mimics previous behaviour, but could be changed if we decide it's worth it.
         // The same choice (and reasoning) is also applied to the this.props.channelNamesMap.
@@ -111,10 +115,15 @@ export default class PostMessageView extends React.Component {
             return <div>{renderedSystemMessage}</div>;
         }
 
+        let postId = null;
+        if (this.props.lastPostCount >= 0) {
+            postId = Utils.createSafeId('lastPostMessageText' + this.props.lastPostCount);
+        }
+
         return (
             <div>
                 <span
-                    id={this.props.isLastPost ? 'lastPostMessageText' : null}
+                    id={postId}
                     className='post-message__text'
                     onClick={Utils.handleFormattedTextClick}
                     dangerouslySetInnerHTML={{__html: TextFormatting.formatText(this.props.post.message, options)}}