diff --git a/cypress/integration/comments_spec.js b/cypress/integration/comments_spec.js
new file mode 100644
index 00000000..a1d6b0ae
--- /dev/null
+++ b/cypress/integration/comments_spec.js
@@ -0,0 +1,56 @@
+describe('Episode comments', function () {
+ let existingUser
+ beforeEach(function () {
+ // create existing user
+ cy.login()
+ .then(({ user }) => {
+ existingUser = user
+ cy.reload().then(() => cy.visit('/new'))
+ })
+ })
+ it('As a user, I can add comments to a post.', () => {
+ cy.get('.news-post:first-child .title > a').click().then(() => {
+ cy.location().should((loc) => {
+ expect(loc.pathname).to.match(/post/)
+ });
+ cy.wait(1000)
+ cy.get('.comment-add-form input.comment-box').type('This was such a great episode I wish there was more like it!');
+ cy.get('.comment-add-form .buttons-comment button.button-submit').click().then(() => {
+ cy.contains('This was such a great episode I wish there was more like it!');
+ cy.get('.comment-holder').within(() => {
+ cy.get('.reply').should('contain', 'Reply');
+ cy.get('.delete').should('contain', 'Delete');
+ cy.get('.edit').should('contain', 'Edit');
+ // Clean up application state.
+ cy.get('.delete').contains('Delete').click()
+ cy.should('not.contain', 'This was such a great episode I wish there was more like it!');
+ })
+ })
+ })
+ })
+ it('As a user, I can edit my own comment on a post.', () => {
+ cy.get('.news-post:first-child .title > a').click().then(() => {
+ cy.location().should((loc) => {
+ expect(loc.pathname).to.match(/post/)
+ });
+ cy.wait(1000)
+ cy.get('.comment-add-form input.comment-box').type('This was such a great esipode I wish there was mor elike it!');
+ cy.get('.comment-add-form .buttons-comment button.button-submit').click().then(() => {
+ cy.contains('This was such a great esipode I wish there was mor elike it!');
+ cy.get('.edit').click();
+ cy.get('.comment-edit-form input.comment-box').clear();
+ cy.get('.comment-edit-form input.comment-box').type('This was such a great episode I wish there was more like it!');
+ cy.get('.comment-edit-form').contains('Save');
+ // Cannot chain on the above `contains` as the element becomes detached from the DOM.
+ cy.get('.comment-edit-form button.button-submit').click()
+ cy.should('not.contain','This was such a great esipode I wish there was mor elike it!');
+ cy.contains('This was such a great episode I wish there was more like it!');
+ cy.get('.comment-holder').within(() => {
+ // Clean up application state.
+ cy.get('.delete').contains('Delete').click()
+ cy.should('not.contain', 'This was such a great episode I wish there was more like it!');
+ })
+ })
+ })
+ })
+});
diff --git a/cypress/integration/post_details_spec.js b/cypress/integration/post_details_spec.js
index 6bf99cec..aff67212 100644
--- a/cypress/integration/post_details_spec.js
+++ b/cypress/integration/post_details_spec.js
@@ -2,10 +2,14 @@ const uuidv4 = require('uuid/v4')
describe('The Post Detail Page', function () {
it('Successfully displays post details', function () {
+ let postTitle = '';
cy.visit('/new')
- cy.get('.title > a').first().click({ force: true }).then(() => {
- cy.location().should((loc) => {
- expect(loc.pathname).to.match(/post/)
+ cy.get('.news-post .title').first().invoke('text').then(postTitle => {
+ cy.get('.news-post .title > a').first().click().then(() => {
+ cy.location().should((loc) => {
+ expect(loc.pathname).to.match(/post/)
+ })
+ cy.get('h1').contains(postTitle)
})
})
})
@@ -38,29 +42,6 @@ describe('The Post Detail Page', function () {
.expectActiveVote('none')
})
})
- xit('Successfully comments on post', function () {
- const comment = `My opinion - ${uuidv4()}`
- const reply = `Also - ${uuidv4()}`
- cy.login().then(() => {
- cy.visit('/new')
- cy.get('.title > a').first().click({ force: true })
- cy.get('.comment-box').first().type(comment)
- cy.contains('Add Comment').click()
- cy.contains(comment).should('exist')
- cy.get('.comment-box').should('have.value', '')
- cy.contains('Reply').first().click()
- cy.get('.reply-container').first()
- .within(() => {
- cy.get('.comment-box').type(reply)
- cy.contains('Reply').click()
- })
- cy.contains(reply).should('exist')
- cy.get('.replies').first().contains('Delete').click()
- cy.contains(reply).should('not.exist')
- cy.get('.comment-holder').first().contains('Delete').first().click()
- cy.contains(comment).should('not.exist')
- })
- })
xit('Successfully adds related link', function () {
const linkUrl = `https://google.com/${uuidv4()}`
const linkTitle = `See also - ${uuidv4()}`
diff --git a/src/components/CommentCompose.vue b/src/components/CommentCompose.vue
index a321c56c..25095705 100644
--- a/src/components/CommentCompose.vue
+++ b/src/components/CommentCompose.vue
@@ -1,11 +1,13 @@
+