[e2e] Cypress scripts improvements (#3681)

packages/cypress/src/integration/howto/discussions.spec.ts

@@ -92,7 +92,9 @@ describe('[Howto.Discussions]', () => {
       (docs) => {
         const [user] = docs
         const discussionNotification = user.notifications.find(
-          ({ type }) => type === 'new_comment_discussion',
+          ({ type, triggeredBy }) =>
+            type === 'new_comment_discussion' &&
+            triggeredBy.userId === visitor.username,
         )
         expect(discussionNotification.relevantUrl).to.include(
           `/how-to/${item.slug}#comment:`,
@@ -109,7 +111,9 @@ describe('[Howto.Discussions]', () => {
       (docs) => {
         const [user] = docs
         const discussionNotification = user.notifications.find(
-          ({ type }) => type === 'new_comment_discussion',
+          ({ type, triggeredBy }) =>
+            type === 'new_comment_discussion' &&
+            triggeredBy.userId === visitor.username,
         )
         expect(discussionNotification.relevantUrl).to.include(
           `/how-to/${item.slug}#comment:`,

packages/cypress/src/integration/howto/write.spec.ts

@@ -83,9 +83,9 @@ describe('[How To]', () => {
   const deleteStep = (stepNumber: number) => {
     const stepIndex = stepNumber - 1
     cy.step(`Deleting step [${stepNumber}]`)
-    cy.get(`[data-cy=step_${stepIndex}]:visible`)
+    cy.get(`[data-cy=step_${stepIndex}]:visible`, { timeout: 20000 })
       .find('[data-cy=delete-step]')
-      .click({ force: true })
+      .click()
     cy.get('[data-cy=confirm]').click()
   }
 
@@ -104,6 +104,7 @@ describe('[How To]', () => {
   }
 
   describe('[Create a how-to]', () => {
+    const alpha = faker.random.alphaNumeric(5)
     const expected = {
       _createdBy: 'howto_creator',
       _deleted: false,
@@ -112,9 +113,9 @@ describe('[How To]', () => {
       moderation: IModerationStatus.AWAITING_MODERATION,
       difficulty_level: DifficultyLevel.MEDIUM,
       time: '1-2 weeks',
-      title: 'Create a how-to test',
-      slug: 'create-a-how-to-test',
-      previousSlugs: ['qwerty', 'create-a-how-to-test'],
+      title: `Create a how-to test ${alpha}`,
+      slug: `create-a-how-to-test-${alpha}`,
+      previousSlugs: ['qwerty', `create-a-how-to-test-${alpha}`],
       fileLink: 'http://google.com/',
       files: [],
       total_downloads: 0,
@@ -201,7 +202,7 @@ describe('[How To]', () => {
       cy.login(creatorEmail, creatorPassword)
       cy.get('[data-cy=loader]').should('not.exist')
       cy.step('Access the create-how-to')
-      cy.get('a[href="/how-to/create"]').should('exist')
+      cy.get('a[href="/how-to/create"]').should('be.visible')
       cy.get('[data-cy=create]').click()
       cy.contains('Create a How-To').should('be.visible')
 
@@ -312,7 +313,6 @@ describe('[How To]', () => {
         .should('be.visible')
       cy.queryDocuments('howtos', 'title', '==', title).then((docs) => {
         cy.log('queryDocs', docs)
-        expect(docs.length).to.equal(1)
         cy.wrap(null)
           .then(() => docs[0])
           .should('eqHowto', expected)
@@ -333,7 +333,7 @@ describe('[How To]', () => {
       cy.login(creatorEmail, creatorPassword)
       cy.get('[data-cy=loader]').should('not.exist')
       cy.step('Access the create-how-to')
-      cy.get('a[href="/how-to/create"]').should('exist')
+      cy.get('a[href="/how-to/create"]').should('be.visible')
       cy.get('[data-cy=create]').click()
       cy.get('[data-cy=intro-title]')
         .clear()
@@ -362,6 +362,7 @@ describe('[How To]', () => {
   describe('[Edit a how-to]', () => {
     const howtoUrl = '/how-to/set-up-devsite-to-help-coding'
     const editHowtoUrl = '/how-to/set-up-devsite-to-help-coding/edit'
+    const editTitle = faker.random.alphaNumeric(5)
     const expected = {
       _createdBy: 'howto_editor',
       _deleted: false,
@@ -372,11 +373,14 @@ describe('[How To]', () => {
       files: [],
       fileLink: 'http://google.com/',
       total_downloads: 10,
-      slug: 'this-is-an-edit-test',
-      previousSlugs: ['set-up-devsite-to-help-coding', 'this-is-an-edit-test'],
+      slug: `this-is-an-edit-test-${editTitle}`,
+      previousSlugs: [
+        'set-up-devsite-to-help-coding',
+        `this-is-an-edit-test-${editTitle}`,
+      ],
       tags: { EOVeOZaKKw1UJkDIf3c3: true },
       time: '3-4 weeks',
-      title: 'This is an edit test',
+      title: `This is an edit test ${editTitle}`,
       cover_image: {
         contentType: 'image/jpeg',
         name: 'howto-intro.jpg',
@@ -550,19 +554,23 @@ describe('[How To]', () => {
         .click()
         .url()
         .should('include', '/how-to/this-is-an-edit-test')
-      cy.get('[data-cy=how-to-basis]').contains('This is an edit test')
+      cy.get('[data-cy=how-to-basis]').contains(
+        `This is an edit test ${editTitle}`,
+      )
       cy.get('[data-cy=file-download-counter]')
         .contains(expected.total_downloads)
         .should('be.visible')
-      cy.queryDocuments('howtos', 'title', '==', 'This is an edit test').then(
-        (docs) => {
-          cy.log('queryDocs', docs)
-          expect(docs.length).to.equal(1)
-          cy.wrap(null)
-            .then(() => docs[0])
-            .should('eqHowto', expected)
-        },
-      )
+      cy.queryDocuments(
+        'howtos',
+        'title',
+        '==',
+        `This is an edit test ${editTitle}`,
+      ).then((docs) => {
+        cy.log('queryDocs', docs)
+        cy.wrap(null)
+          .then(() => docs[0])
+          .should('eqHowto', expected)
+      })
 
       cy.step('Open the old slug')
 

packages/cypress/src/integration/notifications.spec.ts

@@ -38,12 +38,14 @@ describe('[Notifications]', () => {
         const notifications = user['notifications']
         expect(notifications.length).to.be.greaterThan(0)
 
-        expect(notifications[0]['type']).to.equal('howto_useful')
-        expect(notifications[0]['relevantUrl']).to.equal(
-          '/how-to/testing-testing',
+        const notification = notifications.find(
+          ({ triggeredBy, type }) =>
+            triggeredBy.userId === visitor.username && type === 'howto_useful',
         )
-        expect(notifications[0]['read']).to.equal(false)
-        expect(notifications[0]['triggeredBy']['displayName']).to.equal(
+        expect(notification['type']).to.equal('howto_useful')
+        expect(notification['relevantUrl']).to.equal('/how-to/testing-testing')
+        expect(notification['read']).to.equal(false)
+        expect(notification['triggeredBy']['displayName']).to.equal(
           visitor.username,
         )
       },
@@ -66,7 +68,7 @@ describe('[Notifications]', () => {
         expect(notifications.length).to.be.greaterThan(0)
 
         const notification = notifications.find(
-          (item) => item['type'] === 'research_useful',
+          ({ triggeredBy }) => triggeredBy.userId === visitor.username,
         )
 
         expect(notification['relevantUrl']).to.equal('/research/qwerty')

packages/cypress/src/integration/questions/discussions.spec.ts

@@ -110,7 +110,9 @@ describe('[Questions.Discussions]', () => {
       (docs) => {
         const [user] = docs
         const discussionNotification = user.notifications.find(
-          ({ type }) => type === 'new_comment_discussion',
+          ({ type, triggeredBy }) =>
+            type === 'new_comment_discussion' &&
+            triggeredBy.userId === visitor.username,
         )
         expect(discussionNotification.relevantUrl).to.include(
           `/questions/${item.slug}#comment:`,
@@ -127,7 +129,9 @@ describe('[Questions.Discussions]', () => {
       (docs) => {
         const [user] = docs
         const discussionNotification = user.notifications.find(
-          ({ type }) => type === 'new_comment_discussion',
+          ({ type, triggeredBy }) =>
+            type === 'new_comment_discussion' &&
+            triggeredBy.userId === visitor.username,
         )
         expect(discussionNotification.relevantUrl).to.include(
           `/questions/${item.slug}#comment:`,

packages/cypress/src/integration/research/discussions.spec.ts

@@ -93,9 +93,10 @@ describe('[Research.Discussions]', () => {
     cy.queryDocuments('users', 'userName', '==', item._createdBy).then(
       (docs) => {
         const [user] = docs
-        console.log(user.notifications)
         const discussionNotification = user.notifications.find(
-          ({ type }) => type === 'new_comment_discussion',
+          ({ type, triggeredBy }) =>
+            type === 'new_comment_discussion' &&
+            triggeredBy.userId === visitor.username,
         )
         expect(discussionNotification.relevantUrl).to.include(
           `/research/${item.slug}#update_0`,
@@ -116,7 +117,9 @@ describe('[Research.Discussions]', () => {
     ).then((docs) => {
       const [user] = docs
       const discussionNotification = user.notifications.find(
-        ({ type }) => type === 'new_comment_discussion',
+        ({ type, triggeredBy }) =>
+          type === 'new_comment_discussion' &&
+          triggeredBy.userId === visitor.username,
       )
       expect(discussionNotification.relevantUrl).to.include(
         `/research/${item.slug}#update_0`,

packages/cypress/src/integration/research/read.spec.ts

@@ -110,7 +110,7 @@ describe('[Research]', () => {
         cy.visit(researchArticleUrl)
 
         cy.step('Delete button should be visible to the author of the article')
-        cy.get('[data-cy="Research: delete button"]').should('exist')
+        cy.get('[data-cy="Research: delete button"]').should('be.visible')
       })
     })
   })

packages/cypress/src/integration/research/write.spec.ts

@@ -47,7 +47,7 @@ describe('[Research]', () => {
       cy.login(researcherEmail, researcherPassword)
       cy.visit('/research')
       cy.get('[data-cy=loader]').should('not.exist')
-      cy.get('a[href="/research/create"]').should('exist')
+      cy.get('a[href="/research/create"]').should('be.visible')
       cy.get('[data-cy=create]').click()
 
       cy.step('Warn if title is identical to an existing one')
@@ -80,7 +80,11 @@ describe('[Research]', () => {
       cy.get('[data-cy=moderationstatus-draft]').should('be.visible')
       cy.get('[data-cy=edit]').click()
 
-      cy.wait(500) // wierd issue where description is cleared during typing below (causes first few characters to not be typed, thus failing the test)
+      /*
+        There is an issue with cypress that can not type some of the start string failing the test
+        https://github.com/cypress-io/cypress/issues/3817 
+      */
+      cy.wait(500)
       cy.get('[data-cy=intro-description]').type(expected.description).blur()
 
       cy.step('New collaborators can be assigned to research')
@@ -108,11 +112,15 @@ describe('[Research]', () => {
 
       cy.step('Cannot be published when empty')
       cy.get('[data-cy=submit]').click()
-      cy.contains('Make sure this field is filled correctly').should('exist')
+      cy.contains('Make sure this field is filled correctly').should(
+        'be.visible',
+      )
       cy.get('[data-cy=errors-container]').should('be.visible')
 
       cy.step('Enter update details')
       cy.get('[data-cy=intro-title]')
+        .wait(0)
+        .focus()
         .clear()
         .type(updateTitle)
         .blur({ force: true })
@@ -136,8 +144,8 @@ describe('[Research]', () => {
         .click()
         .url()
 
-      cy.contains(updateTitle).should('exist')
-      cy.contains(updateDescription).should('exist')
+      cy.contains(updateTitle).should('be.visible')
+      cy.contains(updateDescription).should('be.visible')
     })
 
     it('[By Anonymous]', () => {
@@ -164,13 +172,16 @@ describe('[Research]', () => {
       cy.visit('/research')
       cy.get('[data-cy=loader]').should('not.exist')
       cy.get('[data-cy=create]').should('be.visible')
-      cy.get('a[href="/research/create"]').should('exist')
+      cy.get('a[href="/research/create"]').should('be.visible')
 
       cy.step('Enter research article details')
       cy.visit('/research/create')
       cy.get('[data-cy=intro-title').clear().type(title).blur({ force: true })
 
       cy.get('[data-cy=intro-description]')
+        .wait(0)
+        .focus()
+        .clear()
         .clear({ force: true })
         .type(description)
 
@@ -193,6 +204,8 @@ describe('[Research]', () => {
         .blur({ force: true })
 
       cy.get('[data-cy=intro-description]')
+        .wait(0)
+        .focus()
         .clear()
         .type(updateDescription)
         .blur({ force: true })
@@ -222,7 +235,7 @@ describe('[Research]', () => {
       cy.login(researcherEmail, researcherPassword)
       cy.step('Access the create research article')
       cy.get('[data-cy=loader]').should('not.exist')
-      cy.get('a[href="/research/create"]').should('exist')
+      cy.get('a[href="/research/create"]').should('be.visible')
       cy.get('[data-cy=create]').click()
       cy.get('[data-cy=intro-title')
         .clear()
@@ -275,7 +288,7 @@ describe('[Research]', () => {
       cy.step('Create the research article')
       cy.visit('/research')
       cy.get('[data-cy=loader]').should('not.exist')
-      cy.get('a[href="/research/create"]').should('exist')
+      cy.get('a[href="/research/create"]').should('be.visible')
       cy.get('[data-cy=create]').click()
 
       cy.step('Enter research article details')
@@ -299,6 +312,8 @@ describe('[Research]', () => {
       cy.get('[data-cy=intro-title]').clear().type(updateTitle).blur()
 
       cy.get('[data-cy=intro-description]')
+        .wait(0)
+        .focus()
         .clear()
         .type(updateDescription)
         .blur()
@@ -309,7 +324,7 @@ describe('[Research]', () => {
       cy.get('[data-cy=draft]').click()
 
       cy.step('Can see Draft after refresh')
-      cy.contains('Uploading Update').should('exist')
+      cy.contains('Uploading Update').should('be.visible')
       cy.get('[data-cy="icon-loading"]').should('not.exist')
       cy.visit(`/research/${expected.slug}`)
 

packages/cypress/src/support/hooks.ts

@@ -65,7 +65,6 @@ afterEach(() => {
  * been added to the database
  */
 after(() => {
-  cy.clearServiceWorkers()
   cy.wrap('Clear DB').then({ timeout: 120000 }, () => {
     return new Cypress.Promise((resolve, reject) => {
       // force resolve in case of server issues (sometimes a bit flaky)