test: add for breadcrumbs (#3541)

ONEARMY · May 21, 2024 · d8f9c8c · d8f9c8c
2 parents 2ab7a91 + 5e03b15
commit d8f9c8c
Show file tree

Hide file tree

Showing 9 changed files with 794 additions and 674 deletions.
diff --git a/packages/components/src/Breadcrumbs/BreadcrumbsItem.tsx b/packages/components/src/Breadcrumbs/BreadcrumbsItem.tsx
@@ -28,6 +28,7 @@ export const BreadcrumbItem = ({ text, link, isLast }: BreadcrumbItemProps) => (
   <Box
     style={{ display: 'inline-flex', marginRight: '10px' }}
     data-testid="breadcrumbsItem"
+    data-cy="breadcrumbsItem"
   >
     {!isLast ? (
       <BreadcrumbButton link={link} text={text} />

diff --git a/packages/cypress/src/integration/howto/comments.spec.ts b/packages/cypress/src/integration/howto/comments.spec.ts
@@ -12,20 +12,23 @@ describe('[How To Commenting]', () => {
 
   describe('[By Authenticated]', () => {
     it('[Commenting]', () => {
+      const commentText = 'A short string intended to test commenting'
       cy.signUpNewUser()
+
       cy.visit(specificHowtoUrl)
 
       cy.step("Cannot edit others' comments")
       cy.get('[data-cy="howto-comments"]').should('exist')
       cy.get('[data-cy="CommentItem: edit button"]').should('not.exist')
 
-      const commentText = 'A short string intended to test commenting'
-
       cy.step('Can add comment')
+      cy.contains('1 Comment')
       cy.get(`[data-cy="comments-login-prompt"]`).should('not.exist')
       cy.get(`[data-cy="comments-form"]`).should('be.exist')
       cy.get('[data-cy="comments-form"]').type(commentText)
       cy.get('[data-cy="comment-submit"]').click()
+      cy.wait(1000)
+      cy.contains('2 Comments')
       cy.get('[data-cy="comment-text"]').should('contain.text', commentText)
 
       cy.step('Can edit comment')

diff --git a/packages/cypress/src/integration/howto/read.spec.ts b/packages/cypress/src/integration/howto/read.spec.ts
@@ -1,6 +1,8 @@
 import { DifficultyLevel } from 'oa-shared'
 
-// import { MOCK_DATA } from '../../data'
+import { MOCK_DATA } from '../../data'
+
+const howtos = Object.values(MOCK_DATA.howtos)
 
 describe('[How To]', () => {
   // const SKIP_TIMEOUT = { timeout: 300 }
@@ -67,6 +69,7 @@ describe('[How To]', () => {
 
     describe('[By Everyone]', () => {
       it('[See all info]', () => {
+        const howto = howtos[0]
         cy.visit(specificHowtoUrl)
         cy.step('Edit button is not available')
         cy.get('[data-cy=edit]').should('not.exist')
@@ -84,7 +87,6 @@ describe('[How To]', () => {
           expect($summary).to.contain(DifficultyLevel.HARD, 'Difficulty')
           expect($summary).to.contain('product', 'Tag')
           expect($summary).to.contain('injection', 'Tag')
-          expect($summary).to.contain('moul', 'Tag')
           expect($summary.find('img[alt="how-to cover"]'))
             .to.have.attr('src')
             .match(coverFileRegex)
@@ -93,6 +95,25 @@ describe('[How To]', () => {
           )
         })
 
+        cy.step('Breadcrumbs work')
+        cy.get('[data-cy=breadcrumbsItem]').first().should('contain', 'How To')
+        cy.get('[data-cy=breadcrumbsItem]')
+          .first()
+          .children()
+          .should('have.attr', 'href')
+          .and('equal', `/how-to`)
+
+        cy.get('[data-cy=breadcrumbsItem]')
+          .eq(1)
+          .should('contain', howto.category.label)
+        cy.get('[data-cy=breadcrumbsItem]')
+          .eq(1)
+          .children()
+          .should('have.attr', 'href')
+          .and('equal', `/how-to?category=${howto.category._id}`)
+
+        cy.get('[data-cy=breadcrumbsItem]').eq(2).should('contain', howto.title)
+
         cy.step('Download file button should redirect to sign in')
         cy.get('div[data-tip="Login to download"]')
           .first()

diff --git a/packages/cypress/src/integration/questions/read.spec.ts b/packages/cypress/src/integration/questions/read.spec.ts
@@ -41,6 +41,27 @@ describe('[Questions]', () => {
       cy.step('Links in description are clickable')
       cy.contains('a', 'https://www.onearmy.earth/')
 
+      cy.step('Breadcrumbs work')
+      cy.get('[data-cy=breadcrumbsItem]').first().should('contain', 'Question')
+      cy.get('[data-cy=breadcrumbsItem]')
+        .first()
+        .children()
+        .should('have.attr', 'href')
+        .and('equal', `/questions`)
+
+      cy.get('[data-cy=breadcrumbsItem]')
+        .eq(1)
+        .should('contain', question.questionCategory.label)
+      cy.get('[data-cy=breadcrumbsItem]')
+        .eq(1)
+        .children()
+        .should('have.attr', 'href')
+        .and('equal', `/questions?category=${question.questionCategory._id}`)
+
+      cy.get('[data-cy=breadcrumbsItem]')
+        .eq(2)
+        .should('contain', question.title)
+
       cy.step('Logged in users can complete actions')
       cy.login('[email protected]', 'test1234')
       cy.visit(`/questions/${question.slug}`) // Page doesn't reload after login

diff --git a/packages/cypress/src/integration/research/read.spec.ts b/packages/cypress/src/integration/research/read.spec.ts
@@ -1,5 +1,9 @@
+import { MOCK_DATA } from '../../data'
+
+const research = Object.values(MOCK_DATA.research)
+
 describe('[Research]', () => {
-  const researchArticleUrl = '/research/qwerty'
+  const researchArticleUrl = `/research/${research[0].slug}`
   const authoredResearchArticleUrl = '/research/a-test-research'
 
   beforeEach(() => {
@@ -12,9 +16,33 @@ describe('[Research]', () => {
         cy.visit(researchArticleUrl)
       })
 
-      it('[Delete button should not be visible to everyone', () => {
+      it('[Visible to everyone', () => {
+        const article = research[0]
         cy.step('Delete button should not be visible')
         cy.get('[data-cy="Research: delete button"]').should('not.exist')
+
+        cy.step('Breadcrumbs work')
+        cy.get('[data-cy=breadcrumbsItem]')
+          .first()
+          .should('contain', 'Research')
+        cy.get('[data-cy=breadcrumbsItem]')
+          .first()
+          .children()
+          .should('have.attr', 'href')
+          .and('equal', `/research`)
+
+        cy.get('[data-cy=breadcrumbsItem]')
+          .eq(1)
+          .should('contain', article.researchCategory.label)
+        cy.get('[data-cy=breadcrumbsItem]')
+          .eq(1)
+          .children()
+          .should('have.attr', 'href')
+          .and('equal', `/research?category=${article.researchCategory._id}`)
+
+        cy.get('[data-cy=breadcrumbsItem]')
+          .eq(2)
+          .should('contain', article.title)
       })
     })
 

diff --git a/packages/cypress/src/integration/research/write.spec.ts b/packages/cypress/src/integration/research/write.spec.ts
@@ -26,11 +26,13 @@ describe('[Research]', () => {
 
   describe('[Create research article]', () => {
     it('[By Authenticated]', () => {
-      cy.login(researcherEmail, researcherPassword)
       cy.step('Create the research article')
+      cy.login(researcherEmail, researcherPassword)
       cy.get('[data-cy=loader]').should('not.exist')
       cy.get('[data-cy=create]').click()
+
       cy.step('Warn if title is identical to an existing one')
+      cy.contains('Start your Research')
       cy.get('[data-cy=intro-title]').type('qwerty').blur({ force: true })
       cy.contains(
         'Titles must be unique, please try being more specific',
@@ -235,6 +237,7 @@ describe('[Research]', () => {
       cy.step('Go to add update')
       cy.get('[data-cy=edit]').click()
       cy.get('[data-cy=create-update]').click()
+      cy.contains('New update')
 
       cy.step('Cannot be published when empty')
       cy.get('[data-cy=submit]').click()