post.comment feature

registration.todo
lots of unifications

cypress/integration/Post.Comment.feature

@@ -1,46 +1,46 @@
-Feature: Post Comment
+Feature: Comments on post
   As a user
-  I want to comment on contributions of others
+  I want to comment and see comments on contributions of others
   To be able to express my thoughts and emotions about these, discuss, and add give further information.
 
   Background:
-    Given I have a user account
-    And we have the following posts in our database:
+    Given I have an user account
+    And I am logged in
+    And the following "posts" are in the database:
       | id         | title                                         | slug       | authorId        |
       | bWBjpkTKZp | 101 Essays that will change the way you think | 101-essays | id-of-peter-pan |
-    And we have the following comments in our database:
+    And the following "comments" are in the database:
       | postId     | content                | authorId        |
       | bWBjpkTKZp | @peter-pan reply to me | id-of-peter-pan |
-    And I am logged in
 
   Scenario: Comment creation
-    Given I visit "post/bWBjpkTKZp/101-essays"
-    And I type in the following text:
+    Given I navigate to page "post/bWBjpkTKZp/101-essays"
+    And I comment the following:
     """
-    Human Connection rocks
+    Ocelot.social rocks
     """
-    And I click on the "Comment" button
+    And I click on "comment button"
     Then my comment should be successfully created
     And I should see my comment
     And the editor should be cleared
 
   Scenario: View medium length comments
-    Given I visit "post/bWBjpkTKZp/101-essays"
+    Given I navigate to page "post/bWBjpkTKZp/101-essays"
     And I type in a comment with 305 characters
-    And I click on the "Comment" button
+    And I click on "comment button"
     Then my comment should be successfully created
     And I should see the entirety of my comment
     And the editor should be cleared
 
   Scenario: View long comments
-    Given I visit "post/bWBjpkTKZp/101-essays"
+    Given I navigate to page "post/bWBjpkTKZp/101-essays"
     And I type in a comment with 1205 characters
-    And I click on the "Comment" button
+    And I click on "comment button"
     Then my comment should be successfully created
-    And I should see an abreviated version of my comment
+    And I should see an abbreviated version of my comment
     And the editor should be cleared
 
   Scenario: Direct reply to Comment
-    Given I visit "post/bWBjpkTKZp/101-essays"
-    And I click on the reply button
+    Given I navigate to page "post/bWBjpkTKZp/101-essays"
+    And I click on "reply button"
     Then it should create a mention in the CommentForm

cypress/integration/Post.Comment/I_comment_the_following.js

@@ -0,0 +1,7 @@
+import { When } from "cypress-cucumber-preprocessor/steps";
+
+When("I comment the following:", async text => {
+  const comment = text.replace("\n", " ")
+  cy.task('pushValue', { name: 'lastComment', value: comment })
+  cy.get(".editor .ProseMirror").type(comment);
+});

cypress/integration/Post.Comment/I_should_see_an_abbreviated_version_of_my_comment.js

@@ -0,0 +1,6 @@
+import { Then } from "cypress-cucumber-preprocessor/steps";
+
+Then("I should see an abbreviated version of my comment", () => {
+  cy.get("article.comment-card")
+    .should("contain", "show more")
+});

cypress/integration/Post.Comment/I_should_see_my_comment.js

@@ -0,0 +1,13 @@
+import { Then } from "cypress-cucumber-preprocessor/steps";
+
+Then("I should see my comment", () => {
+  cy.get("article.comment-card p")
+    .should("contain", "Ocelot.social rocks")
+    .get(".user-teaser span.slug")
+    .should("contain", "@peter-pan") // specific enough
+    .get(".user-avatar img")
+    .should("have.attr", "src")
+    .and("contain", 'https://') // some url
+    .get(".user-teaser > .info > .text")
+    .should("contain", "today at");
+});

cypress/integration/Post.Comment/I_should_see_the_entirety_of_my_comment.js

@@ -0,0 +1,6 @@
+import { Then } from "cypress-cucumber-preprocessor/steps";
+
+Then("I should see the entirety of my comment", () => {
+  cy.get("article.comment-card")
+    .should("not.contain", "show more")
+});

cypress/integration/Post.Comment/I_type_in_a_comment_with_{int}_characters.js

@@ -0,0 +1,9 @@
+import { When } from "cypress-cucumber-preprocessor/steps";
+
+When("I type in a comment with {int} characters", size => {
+  var c="";
+  for (var i = 0; i < size; i++) {
+    c += "c"
+  }
+  cy.get(".editor .ProseMirror").type(c);
+});

cypress/integration/Post.Comment/it_should_create_a_mention_in_the_CommentForm.js

@@ -0,0 +1,7 @@
+import { Then } from "cypress-cucumber-preprocessor/steps";
+
+Then("it should create a mention in the CommentForm", () => {
+  cy.get(".ProseMirror a")
+    .should('have.class', 'mention')
+    .should('contain', '@peter-pan')
+})

cypress/integration/Post.Comment/my_comment_should_be_successfully_created.js

@@ -0,0 +1,5 @@
+import { Then } from "cypress-cucumber-preprocessor/steps";
+
+Then("my comment should be successfully created", () => {
+  cy.get(".iziToast-message").contains("Comment submitted!");
+});

cypress/integration/Post.Comment/the_editor_should_be_cleared.js

@@ -0,0 +1,5 @@
+import { Then } from "cypress-cucumber-preprocessor/steps";
+
+Then("the editor should be cleared", () => {
+  cy.get(".ProseMirror p").should("have.class", "is-empty");
+});

cypress/integration/Post.feature

@@ -1,4 +1,4 @@
-Feature: Create a post
+Feature: See a post
   As an logged in user
   I would like to see a post
   And to see the whole content of it
@@ -6,7 +6,9 @@ Feature: Create a post
   Background:
     Given I have an user account
     And I am logged in
-    And I previously created a post
+    And the following "posts" are in the database:
+      | id         | title                   | slug                    | authorId        | content           |
+      | aBcDeFgHiJ | previously created post | previously-created-post | id-of-peter-pan | with some content |
 
   Scenario: See a post on the landing page
     When I navigate to page "landing"

cypress/integration/Post/I_previously_created_a_post.js

@@ -1,14 +0,0 @@
-import { Given } from "cypress-cucumber-preprocessor/steps";
-import narrator from "../data/narrator"
-
-Given("I previously created a post", () => {
-    const lastPost = {
-      title:  "previously created post",
-      content: "with some content",
-    };
-    cy.factory()
-      .build("post", lastPost, {
-        authorId: narrator.id
-      });
-    cy.task('pushValue', { name: 'lastPost', value: lastPost })
-  });

cypress/integration/Post/the_post_shows_up_on_the_landing_page_at_position_{int}.js

@@ -1,9 +1,8 @@
 import { Then } from "cypress-cucumber-preprocessor/steps";
 
 Then("the post shows up on the landing page at position {int}", index => {
-  cy.task('getValue', 'lastPost').then(lastPost => {
-    const selector = `.post-teaser:nth-child(${index}) > .base-card`;
-    cy.get(selector).should("contain", lastPost.title);
-    cy.get(selector).should("contain", lastPost.content);
-  })
+  const selector = `.post-teaser:nth-child(${index}) > .base-card`;
+  cy.get(selector).should("contain", 'previously created post');
+  cy.get(selector).should("contain", 'with some content');
+  
 });

cypress/integration/common/.post.js

@@ -4,61 +4,12 @@ import orderBy from 'lodash/orderBy'
 
 const languages = orderBy(locales, 'name')
 
-When("I type in a comment with {int} characters", size => {
-  var c="";
-  for (var i = 0; i < size; i++) {
-    c += "c"
-  }
-  cy.get(".editor .ProseMirror").type(c);
-});
-
 Then("I click on the {string} button", text => {
   cy.get("button")
     .contains(text)
     .click();
 });
 
-Then("I click on the reply button", () => {
-  cy.get(".reply-button")
-    .click();
-});
-
-Then("my comment should be successfully created", () => {
-  cy.get(".iziToast-message").contains("Comment submitted!");
-});
-
-Then("I should see my comment", () => {
-  cy.get("article.comment-card p")
-    .should("contain", "Human Connection rocks")
-    .get(".user-teaser span.slug")
-    .should("contain", "@peter-pan") // specific enough
-    .get(".user-avatar img")
-    .should("have.attr", "src")
-    .and("contain", 'https://') // some url
-    .get(".user-teaser > .info > .text")
-    .should("contain", "today at");
-});
-
-Then("I should see the entirety of my comment", () => {
-  cy.get("article.comment-card")
-  .should("not.contain", "show more")
-});
-
-Then("I should see an abreviated version of my comment", () => {
-  cy.get("article.comment-card")
-  .should("contain", "show more")
-});
-
-Then("the editor should be cleared", () => {
-  cy.get(".ProseMirror p").should("have.class", "is-empty");
-});
-
-Then("it should create a mention in the CommentForm", () => {
-  cy.get(".ProseMirror a")
-    .should('have.class', 'mention')
-    .should('contain', '@peter-pan')
-})
-
 When("I open the content menu of post {string}", (title)=> {
   cy.contains('.post-teaser', title)
   .find('.content-menu .base-button')

cypress/integration/common/.steps.js

@@ -153,16 +153,6 @@ When("I press {string}", label => {
   cy.contains(label).click();
 });
 
-Given("we have the following comments in our database:", table => {
-  table.hashes().forEach((attributesOrOptions, i) => {
-    cy.factory().build("comment", {
-      ...attributesOrOptions,
-    }, {
-      ...attributesOrOptions,
-    });
-  })
-});
-
 Given("we have the following posts in our database:", table => {
   table.hashes().forEach((attributesOrOptions, i) => {
     cy.factory().build("post", {

cypress/integration/common/I_click_on_{string}.js

@@ -5,7 +5,9 @@ When("I click on {string}", element => {
     'submit button': 'button[name=submit]',
     'create post button': '.post-add-button',
     'save button': 'button[type=submit]',
-    'the first post': '.post-teaser:nth-child(1)',
+    'the first post': '.post-teaser:first-child',
+    'comment button': 'button[type=submit]',
+    'reply button': '.reply-button',
   }
 
   cy.get(elementSelectors[element])

cypress/integration/common/the_following_{string}_are_in_the_database.js

@@ -0,0 +1,27 @@
+import { Given } from "cypress-cucumber-preprocessor/steps";
+
+Given("the following {string} are in the database:", (table,data) => {
+  switch(table){
+    case "posts":
+      data.hashes().forEach((attributesOrOptions, i) => {
+        cy.factory().build("post", {
+          ...attributesOrOptions,
+          deleted: Boolean(attributesOrOptions.deleted),
+          disabled: Boolean(attributesOrOptions.disabled),
+          pinned: Boolean(attributesOrOptions.pinned),
+        }, {
+          ...attributesOrOptions,
+        });
+      })
+      break
+    case "comments":
+      data.hashes().forEach((attributesOrOptions, i) => {
+        cy.factory().build("comment", {
+          ...attributesOrOptions,
+        }, {
+          ...attributesOrOptions,
+        });
+      })
+      break
+  }
+})