From f5f2240828cf96b641145c36e45c8f88d6f057b6 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Tue, 23 Aug 2022 21:59:54 -0700
Subject: [PATCH] Add frontend tests for comments
---
.../e2e/documents/document-detail.cy.ts | 52 +++++++++++++++++++
.../fixtures/documents/1/comments.json | 46 ++++++++++++++++
.../document-comments.component.html | 4 +-
3 files changed, 100 insertions(+), 2 deletions(-)
create mode 100644 src-ui/cypress/fixtures/documents/1/comments.json
diff --git a/src-ui/cypress/e2e/documents/document-detail.cy.ts b/src-ui/cypress/e2e/documents/document-detail.cy.ts
index cc269655a..a836ffa92 100644
--- a/src-ui/cypress/e2e/documents/document-detail.cy.ts
+++ b/src-ui/cypress/e2e/documents/document-detail.cy.ts
@@ -17,6 +17,32 @@ describe('document-detail', () => {
req.reply({ result: 'OK' })
}).as('saveDoc')
+ cy.fixture('documents/1/comments.json').then((commentsJson) => {
+ cy.intercept(
+ 'GET',
+ 'http://localhost:8000/api/documents/1/comments/',
+ (req) => {
+ req.reply(commentsJson.filter((c) => c.id != 10)) // 3
+ }
+ )
+
+ cy.intercept(
+ 'DELETE',
+ 'http://localhost:8000/api/documents/1/comments/?id=9',
+ (req) => {
+ req.reply(commentsJson.filter((c) => c.id != 9 && c.id != 10)) // 2
+ }
+ )
+
+ cy.intercept(
+ 'POST',
+ 'http://localhost:8000/api/documents/1/comments/',
+ (req) => {
+ req.reply(commentsJson) // 4
+ }
+ )
+ })
+
cy.viewport(1024, 1024)
cy.visit('/documents/1/')
})
@@ -39,4 +65,30 @@ describe('document-detail', () => {
cy.contains('button', 'Save').click().wait('@saveDoc').wait(2000) // navigates away after saving
cy.contains('You have unsaved changes').should('not.exist')
})
+
+ it('should show a list of comments', () => {
+ cy.wait(1000).get('a').contains('Comments').click().wait(1000)
+ cy.get('app-document-comments').find('.card').its('length').should('eq', 3)
+ })
+
+ it('should support comment deletion', () => {
+ cy.wait(1000).get('a').contains('Comments').click().wait(1000)
+ cy.get('app-document-comments')
+ .find('.card')
+ .first()
+ .find('button')
+ .click({ force: true })
+ .wait(500)
+ cy.get('app-document-comments').find('.card').its('length').should('eq', 2)
+ })
+
+ it('should support comment insertion', () => {
+ cy.wait(1000).get('a').contains('Comments').click().wait(1000)
+ cy.get('app-document-comments')
+ .find('form textarea')
+ .type('Testing new comment')
+ .wait(500)
+ cy.get('app-document-comments').find('form button').click().wait(1500)
+ cy.get('app-document-comments').find('.card').its('length').should('eq', 4)
+ })
})
diff --git a/src-ui/cypress/fixtures/documents/1/comments.json b/src-ui/cypress/fixtures/documents/1/comments.json
new file mode 100644
index 000000000..73e932187
--- /dev/null
+++ b/src-ui/cypress/fixtures/documents/1/comments.json
@@ -0,0 +1,46 @@
+[
+ {
+ "id": 10,
+ "comment": "Testing new comment",
+ "created": "2022-08-08T04:24:55.176008Z",
+ "user": {
+ "id": 1,
+ "username": "user2",
+ "firstname": "",
+ "lastname": ""
+ }
+ },
+ {
+ "id": 9,
+ "comment": "Testing one more time",
+ "created": "2022-02-18T04:24:55.176008Z",
+ "user": {
+ "id": 2,
+ "username": "user1",
+ "firstname": "",
+ "lastname": ""
+ }
+ },
+ {
+ "id": 8,
+ "comment": "Another comment",
+ "created": "2021-11-08T04:24:47.925042Z",
+ "user": {
+ "id": 2,
+ "username": "user33",
+ "firstname": "",
+ "lastname": ""
+ }
+ },
+ {
+ "id": 7,
+ "comment": "Cupcake ipsum dolor sit amet cheesecake candy cookie tiramisu. Donut chocolate chupa chups macaroon brownie halvah pie cheesecake gummies. Sweet chocolate bar candy donut gummi bears bear claw liquorice bonbon shortbread.\n\nDonut chocolate bar candy wafer wafer tiramisu. Gummies chocolate cake muffin toffee carrot cake macaroon. Toffee toffee jelly beans danish lollipop cake.",
+ "created": "2021-02-08T02:37:49.724132Z",
+ "user": {
+ "id": 3,
+ "username": "admin",
+ "firstname": "",
+ "lastname": ""
+ }
+ }
+]
diff --git a/src-ui/src/app/components/document-comments/document-comments.component.html b/src-ui/src/app/components/document-comments/document-comments.component.html
index 7e4afa90a..9a2e7debb 100644
--- a/src-ui/src/app/components/document-comments/document-comments.component.html
+++ b/src-ui/src/app/components/document-comments/document-comments.component.html
@@ -17,11 +17,11 @@
</div>
<div class="d-flex card-footer small bg-light text-primary justify-content-between align-items-center">
<span>{{displayName(comment)}} - {{ comment.created | customDate}}</span>
- <btn class="btn btn-link btn-sm p-0 fade" (click)="deleteComment(comment.id)">
+ <button type="button" class="btn btn-link btn-sm p-0 fade" (click)="deleteComment(comment.id)">
<svg width="13" height="13" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#trash" />
</svg>
- </btn>
+ </button>
</div>
</div>
</div>