From 16cbbe8d2c8869c0b807f6d2141c78986a97305c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bel=C3=A9n=20Curcio?= <curciobelen@gmail.com>
Date: Wed, 26 Sep 2018 17:23:54 -0300
Subject: [PATCH] Adding spected

---
 .../__snapshots__/postComment.spec.tsx.snap   |  97 ++++++++++-
 .../postLocalReply.spec.tsx.snap              | 158 ++++++-----------
 .../__snapshots__/postReply.spec.tsx.snap     | 162 +++++++-----------
 .../stream/test/comments/postComment.spec.tsx |   5 +
 .../test/comments/postLocalReply.spec.tsx     |   5 +
 .../stream/test/comments/postReply.spec.tsx   |   5 +
 6 files changed, 231 insertions(+), 201 deletions(-)

diff --git a/src/core/client/stream/test/comments/__snapshots__/postComment.spec.tsx.snap b/src/core/client/stream/test/comments/__snapshots__/postComment.spec.tsx.snap
index 11d3fb467..fa033c7d5 100644
--- a/src/core/client/stream/test/comments/__snapshots__/postComment.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/__snapshots__/postComment.spec.tsx.snap
@@ -569,13 +569,19 @@ exports[`post a comment: server response 1`] = `
                     </span>
                   </button>
                 </div>
+                <div
+                  aria-hidden="true"
+                  className="RTE-placeholder RTE-placeholder"
+                >
+                  Post a comment
+                </div>
                 <div
                   aria-placeholder="Post a comment"
                   className="RTE-contentEditable RTE-content"
                   contentEditable={true}
                   dangerouslySetInnerHTML={
                     Object {
-                      "__html": "<strong>Hello world!</strong>",
+                      "__html": "",
                     }
                   }
                   disabled={false}
@@ -610,8 +616,8 @@ exports[`post a comment: server response 1`] = `
               </span>
             </div>
             <button
-              className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
-              disabled={false}
+              className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled Button-disabled"
+              disabled={true}
               onBlur={[Function]}
               onFocus={[Function]}
               onMouseDown={[Function]}
@@ -632,6 +638,91 @@ exports[`post a comment: server response 1`] = `
       id="talk-comments-stream-log"
       role="log"
     >
+      <div
+        className="HorizontalGutter-root HorizontalGutter-full"
+      >
+        <div
+          className="Indent-root"
+        >
+          <div
+            className=""
+          >
+            <div
+              className="Comment-root"
+              role="article"
+            >
+              <div
+                className="Flex-root Comment-topBar Flex-flex Flex-justifySpaceBetween Flex-directionRow"
+                id="comment-comment-x"
+              >
+                <div
+                  className="Flex-root Flex-flex Flex-halfItemGutter Flex-alignBaseline Flex-directionColumn"
+                >
+                  <span
+                    className="Typography-root Typography-heading3 Typography-colorTextPrimary Username-root"
+                  >
+                    Markus
+                  </span>
+                  <div
+                    className="Flex-root Flex-flex Flex-itemGutter Flex-alignBaseline Flex-directionRow"
+                  >
+                    <time
+                      className="Timestamp-root RelativeTime-root"
+                      dateTime="2018-07-06T18:24:00.000Z"
+                      title="2018-07-06T18:24:00.000Z"
+                    >
+                      2018-07-06T18:24:00.000Z
+                    </time>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="HTMLContent-root"
+                dangerouslySetInnerHTML={
+                  Object {
+                    "__html": "<strong>Hello world! (from server)</strong>",
+                  }
+                }
+              />
+              <div
+                className="Flex-root Comment-footer Flex-flex Flex-halfItemGutter Flex-directionRow"
+              >
+                <button
+                  className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost"
+                  id="comments-commentContainer-replyButton-comment-x"
+                  onBlur={[Function]}
+                  onClick={[Function]}
+                  onFocus={[Function]}
+                  onMouseDown={[Function]}
+                  onMouseOut={[Function]}
+                  onMouseOver={[Function]}
+                  onTouchEnd={[Function]}
+                  type="button"
+                >
+                  <span>
+                    Reply
+                  </span>
+                </button>
+                <button
+                  className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost"
+                  onBlur={[Function]}
+                  onClick={[Function]}
+                  onFocus={[Function]}
+                  onMouseDown={[Function]}
+                  onMouseOut={[Function]}
+                  onMouseOver={[Function]}
+                  onTouchEnd={[Function]}
+                  type="button"
+                >
+                  <span>
+                    Respect
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
       <div
         className="HorizontalGutter-root HorizontalGutter-full"
       >
diff --git a/src/core/client/stream/test/comments/__snapshots__/postLocalReply.spec.tsx.snap b/src/core/client/stream/test/comments/__snapshots__/postLocalReply.spec.tsx.snap
index 7749e33f2..618f6b7ea 100644
--- a/src/core/client/stream/test/comments/__snapshots__/postLocalReply.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/__snapshots__/postLocalReply.spec.tsx.snap
@@ -2476,7 +2476,7 @@ exports[`post a reply: server response 1`] = `
                                     className="Flex-root Comment-footer Flex-flex Flex-halfItemGutter Flex-directionRow"
                                   >
                                     <button
-                                      className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost Button-active"
+                                      className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost"
                                       id="comments-commentContainer-replyButton-comment-with-deepest-replies-5"
                                       onBlur={[Function]}
                                       onClick={[Function]}
@@ -2510,127 +2510,81 @@ exports[`post a reply: server response 1`] = `
                                 </div>
                               </div>
                             </div>
-                            <form
-                              autoComplete="off"
-                              id="comments-replyCommentForm-form-comment-with-deepest-replies-5"
-                              onSubmit={[Function]}
+                            <div
+                              className="HorizontalGutter-root HorizontalGutter-full"
+                              id="talk-comments-replyList-log--comment-with-deepest-replies-5"
+                              role="log"
                             >
                               <div
                                 className="HorizontalGutter-root HorizontalGutter-full"
                               >
-                                <div>
-                                  <label
-                                    className="AriaInfo-root"
-                                    htmlFor="comments-replyCommentForm-rte-comment-with-deepest-replies-5"
+                                <div
+                                  className="Indent-root"
+                                >
+                                  <div
+                                    className="Indent-level6"
                                   >
-                                    Write a reply
-                                  </label>
-                                  <div>
                                     <div
-                                      className=""
+                                      className="Comment-root"
+                                      role="article"
                                     >
                                       <div
-                                        className="Toolbar-toolbar"
+                                        className="Flex-root Comment-topBar Flex-flex Flex-justifySpaceBetween Flex-directionRow"
+                                        id="comment-comment-x"
+                                      >
+                                        <div
+                                          className="Flex-root Flex-flex Flex-halfItemGutter Flex-alignBaseline Flex-directionColumn"
+                                        >
+                                          <span
+                                            className="Typography-root Typography-heading3 Typography-colorTextPrimary Username-root"
+                                          >
+                                            Markus
+                                          </span>
+                                          <div
+                                            className="Flex-root Flex-flex Flex-itemGutter Flex-alignBaseline Flex-directionRow"
+                                          >
+                                            <time
+                                              className="Timestamp-root RelativeTime-root"
+                                              dateTime="2018-07-06T18:24:00.000Z"
+                                              title="2018-07-06T18:24:00.000Z"
+                                            >
+                                              2018-07-06T18:24:00.000Z
+                                            </time>
+                                          </div>
+                                        </div>
+                                      </div>
+                                      <div
+                                        className="HTMLContent-root"
+                                        dangerouslySetInnerHTML={
+                                          Object {
+                                            "__html": "<strong>Hello world! (from server)</strong>",
+                                          }
+                                        }
+                                      />
+                                      <div
+                                        className="Flex-root Comment-footer Flex-flex Flex-halfItemGutter Flex-directionRow"
                                       >
                                         <button
-                                          className="Button-button"
-                                          disabled={false}
+                                          className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost"
+                                          onBlur={[Function]}
                                           onClick={[Function]}
-                                          title="Bold"
+                                          onFocus={[Function]}
+                                          onMouseDown={[Function]}
+                                          onMouseOut={[Function]}
+                                          onMouseOver={[Function]}
+                                          onTouchEnd={[Function]}
                                           type="button"
                                         >
-                                          <span
-                                            aria-hidden="true"
-                                            className="Icon-root Icon-md"
-                                          >
-                                            format_bold
-                                          </span>
-                                        </button>
-                                        <button
-                                          className="Button-button"
-                                          disabled={false}
-                                          onClick={[Function]}
-                                          title="Italic"
-                                          type="button"
-                                        >
-                                          <span
-                                            aria-hidden="true"
-                                            className="Icon-root Icon-md"
-                                          >
-                                            format_italic
-                                          </span>
-                                        </button>
-                                        <button
-                                          className="Button-button"
-                                          disabled={false}
-                                          onClick={[Function]}
-                                          title="Blockquote"
-                                          type="button"
-                                        >
-                                          <span
-                                            aria-hidden="true"
-                                            className="Icon-root Icon-md"
-                                          >
-                                            format_quote
+                                          <span>
+                                            Respect
                                           </span>
                                         </button>
                                       </div>
-                                      <div
-                                        aria-placeholder="Write a reply"
-                                        className="RTE-contentEditable RTE-content"
-                                        contentEditable={true}
-                                        dangerouslySetInnerHTML={
-                                          Object {
-                                            "__html": "<strong>Hello world!</strong>",
-                                          }
-                                        }
-                                        disabled={false}
-                                        id="comments-replyCommentForm-rte-comment-with-deepest-replies-5"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCut={[Function]}
-                                        onFocus={[Function]}
-                                        onInput={[Function]}
-                                        onKeyDown={[Function]}
-                                        onPaste={[Function]}
-                                        onSelect={[Function]}
-                                      />
                                     </div>
                                   </div>
                                 </div>
-                                <div
-                                  className="Flex-root Flex-flex Flex-halfItemGutter Flex-justifyFlexEnd Flex-directionRow"
-                                >
-                                  <button
-                                    className="BaseButton-root Button-root Button-sizeRegular Button-colorRegular Button-variantOutlined"
-                                    disabled={false}
-                                    onBlur={[Function]}
-                                    onClick={[Function]}
-                                    onFocus={[Function]}
-                                    onMouseDown={[Function]}
-                                    onMouseOut={[Function]}
-                                    onMouseOver={[Function]}
-                                    onTouchEnd={[Function]}
-                                    type="button"
-                                  >
-                                    Cancel
-                                  </button>
-                                  <button
-                                    className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
-                                    disabled={false}
-                                    onBlur={[Function]}
-                                    onFocus={[Function]}
-                                    onMouseDown={[Function]}
-                                    onMouseOut={[Function]}
-                                    onMouseOver={[Function]}
-                                    onTouchEnd={[Function]}
-                                    type="submit"
-                                  >
-                                    Submit
-                                  </button>
-                                </div>
                               </div>
-                            </form>
+                            </div>
                           </div>
                         </div>
                       </div>
diff --git a/src/core/client/stream/test/comments/__snapshots__/postReply.spec.tsx.snap b/src/core/client/stream/test/comments/__snapshots__/postReply.spec.tsx.snap
index 4803b779e..8dd6ae3f6 100644
--- a/src/core/client/stream/test/comments/__snapshots__/postReply.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/__snapshots__/postReply.spec.tsx.snap
@@ -1307,7 +1307,7 @@ exports[`post a reply: server response 1`] = `
                 className="Flex-root Comment-footer Flex-flex Flex-halfItemGutter Flex-directionRow"
               >
                 <button
-                  className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost Button-active"
+                  className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost"
                   id="comments-commentContainer-replyButton-comment-0"
                   onBlur={[Function]}
                   onClick={[Function]}
@@ -1341,127 +1341,97 @@ exports[`post a reply: server response 1`] = `
             </div>
           </div>
         </div>
-        <form
-          autoComplete="off"
-          id="comments-replyCommentForm-form-comment-0"
-          onSubmit={[Function]}
+        <div
+          className="HorizontalGutter-root HorizontalGutter-full"
+          id="talk-comments-replyList-log--comment-0"
+          role="log"
         >
           <div
             className="HorizontalGutter-root HorizontalGutter-full"
           >
-            <div>
-              <label
-                className="AriaInfo-root"
-                htmlFor="comments-replyCommentForm-rte-comment-0"
+            <div
+              className="Indent-root"
+            >
+              <div
+                className="Indent-level1"
               >
-                Write a reply
-              </label>
-              <div>
                 <div
-                  className=""
+                  className="Comment-root"
+                  role="article"
                 >
                   <div
-                    className="Toolbar-toolbar"
+                    className="Flex-root Comment-topBar Flex-flex Flex-justifySpaceBetween Flex-directionRow"
+                    id="comment-comment-x"
+                  >
+                    <div
+                      className="Flex-root Flex-flex Flex-halfItemGutter Flex-alignBaseline Flex-directionColumn"
+                    >
+                      <span
+                        className="Typography-root Typography-heading3 Typography-colorTextPrimary Username-root"
+                      >
+                        Markus
+                      </span>
+                      <div
+                        className="Flex-root Flex-flex Flex-itemGutter Flex-alignBaseline Flex-directionRow"
+                      >
+                        <time
+                          className="Timestamp-root RelativeTime-root"
+                          dateTime="2018-07-06T18:24:00.000Z"
+                          title="2018-07-06T18:24:00.000Z"
+                        >
+                          2018-07-06T18:24:00.000Z
+                        </time>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="HTMLContent-root"
+                    dangerouslySetInnerHTML={
+                      Object {
+                        "__html": "<strong>Hello world! (from server)</strong>",
+                      }
+                    }
+                  />
+                  <div
+                    className="Flex-root Comment-footer Flex-flex Flex-halfItemGutter Flex-directionRow"
                   >
                     <button
-                      className="Button-button"
-                      disabled={false}
+                      className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost"
+                      id="comments-commentContainer-replyButton-comment-x"
+                      onBlur={[Function]}
                       onClick={[Function]}
-                      title="Bold"
+                      onFocus={[Function]}
+                      onMouseDown={[Function]}
+                      onMouseOut={[Function]}
+                      onMouseOver={[Function]}
+                      onTouchEnd={[Function]}
                       type="button"
                     >
-                      <span
-                        aria-hidden="true"
-                        className="Icon-root Icon-md"
-                      >
-                        format_bold
+                      <span>
+                        Reply
                       </span>
                     </button>
                     <button
-                      className="Button-button"
-                      disabled={false}
+                      className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost"
+                      onBlur={[Function]}
                       onClick={[Function]}
-                      title="Italic"
+                      onFocus={[Function]}
+                      onMouseDown={[Function]}
+                      onMouseOut={[Function]}
+                      onMouseOver={[Function]}
+                      onTouchEnd={[Function]}
                       type="button"
                     >
-                      <span
-                        aria-hidden="true"
-                        className="Icon-root Icon-md"
-                      >
-                        format_italic
-                      </span>
-                    </button>
-                    <button
-                      className="Button-button"
-                      disabled={false}
-                      onClick={[Function]}
-                      title="Blockquote"
-                      type="button"
-                    >
-                      <span
-                        aria-hidden="true"
-                        className="Icon-root Icon-md"
-                      >
-                        format_quote
+                      <span>
+                        Respect
                       </span>
                     </button>
                   </div>
-                  <div
-                    aria-placeholder="Write a reply"
-                    className="RTE-contentEditable RTE-content"
-                    contentEditable={true}
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": "<strong>Hello world!</strong>",
-                      }
-                    }
-                    disabled={false}
-                    id="comments-replyCommentForm-rte-comment-0"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onCut={[Function]}
-                    onFocus={[Function]}
-                    onInput={[Function]}
-                    onKeyDown={[Function]}
-                    onPaste={[Function]}
-                    onSelect={[Function]}
-                  />
                 </div>
               </div>
             </div>
-            <div
-              className="Flex-root Flex-flex Flex-halfItemGutter Flex-justifyFlexEnd Flex-directionRow"
-            >
-              <button
-                className="BaseButton-root Button-root Button-sizeRegular Button-colorRegular Button-variantOutlined"
-                disabled={false}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onMouseDown={[Function]}
-                onMouseOut={[Function]}
-                onMouseOver={[Function]}
-                onTouchEnd={[Function]}
-                type="button"
-              >
-                Cancel
-              </button>
-              <button
-                className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
-                disabled={false}
-                onBlur={[Function]}
-                onFocus={[Function]}
-                onMouseDown={[Function]}
-                onMouseOut={[Function]}
-                onMouseOver={[Function]}
-                onTouchEnd={[Function]}
-                type="submit"
-              >
-                Submit
-              </button>
-            </div>
           </div>
-        </form>
+        </div>
       </div>
       <div
         className="HorizontalGutter-root HorizontalGutter-full"
diff --git a/src/core/client/stream/test/comments/postComment.spec.tsx b/src/core/client/stream/test/comments/postComment.spec.tsx
index 133f0976e..447604838 100644
--- a/src/core/client/stream/test/comments/postComment.spec.tsx
+++ b/src/core/client/stream/test/comments/postComment.spec.tsx
@@ -40,6 +40,11 @@ beforeEach(() => {
                     editableUntil: "2018-07-06T18:24:30.000Z",
                   },
                   replies: { edges: [], pageInfo: {} },
+                  actionCounts: {
+                    reaction: {
+                      total: 0,
+                    },
+                  },
                 },
               },
               clientMutationId: "0",
diff --git a/src/core/client/stream/test/comments/postLocalReply.spec.tsx b/src/core/client/stream/test/comments/postLocalReply.spec.tsx
index f0e5c8949..c063118ae 100644
--- a/src/core/client/stream/test/comments/postLocalReply.spec.tsx
+++ b/src/core/client/stream/test/comments/postLocalReply.spec.tsx
@@ -46,6 +46,11 @@ beforeEach(() => {
                     edited: false,
                     editableUntil: "2018-07-06T18:24:30.000Z",
                   },
+                  actionCounts: {
+                    reaction: {
+                      total: 0,
+                    },
+                  },
                 },
               },
               clientMutationId: "0",
diff --git a/src/core/client/stream/test/comments/postReply.spec.tsx b/src/core/client/stream/test/comments/postReply.spec.tsx
index 6f75b57a8..19c105fc5 100644
--- a/src/core/client/stream/test/comments/postReply.spec.tsx
+++ b/src/core/client/stream/test/comments/postReply.spec.tsx
@@ -43,6 +43,11 @@ beforeEach(() => {
                     edited: false,
                     editableUntil: "2018-07-06T18:24:30.000Z",
                   },
+                  actionCounts: {
+                    reaction: {
+                      total: 0,
+                    },
+                  },
                 },
               },
               clientMutationId: "0",