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

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}

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,

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}

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}

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)}}

webapp/utils/constants.jsx

@@ -952,7 +952,8 @@ export const Constants = {
     AUTOCOMPLETE_TIMEOUT: 100,
     ANIMATION_TIMEOUT: 1000,
     SEARCH_TIMEOUT_MILLISECONDS: 100,
-    DIAGNOSTICS_SEGMENT_KEY: 'fwb7VPbFeQ7SKp3wHm1RzFUuXZudqVok'
+    DIAGNOSTICS_SEGMENT_KEY: 'fwb7VPbFeQ7SKp3wHm1RzFUuXZudqVok',
+    TEST_ID_COUNT: 10
 };
 
 export default Constants;