Merge pull request #3375 from benfurber/feat/questions/add-create-tests

feat(questions): Add some feature tests

packages/components/src/ButtonShowReplies/ButtonShowReplies.tsx

@@ -21,6 +21,7 @@ export const ButtonShowReplies = (props: Props) => {
 
   return (
     <Button
+      data-cy={`show-replies`}
       icon={icon}
       onClick={setIsShowReplies}
       sx={{ alignSelf: 'flex-start' }}

packages/cypress/src/data/index.ts

@@ -12,22 +12,8 @@
  *
  **/
 
-import {
-  categories,
-  howtos,
-  mappins,
-  research,
-  tags,
-  users,
-} from 'oa-shared/mocks/data'
-
-export { howtos, users } from 'oa-shared/mocks/data'
+import * as allData from 'oa-shared/mocks/data'
 
 export const MOCK_DATA = {
-  categories,
-  howtos,
-  mappins,
-  research,
-  tags,
-  users,
+  ...allData,
 }

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

@@ -1,9 +1,9 @@
-import { howtos } from '../../data'
+import { MOCK_DATA } from '../../data'
 
 describe('[How To]', () => {
   describe('[SEO Metadata]', () => {
     const { slug, title, description, cover_image } =
-      howtos.cmMzzlQP00fCckYIeL2e
+      MOCK_DATA.howtos.cmMzzlQP00fCckYIeL2e
     it('[Populates title and description tags]', () => {
       cy.visit(`/how-to/${slug}`)
       // General

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

@@ -3,13 +3,13 @@ import { faker } from '@faker-js/faker'
 import { MESSAGE_MAX_CHARACTERS } from '../../../../src/pages/User/constants'
 import { missing } from '../../../../src/pages/User/impact/labels'
 import { contact } from '../../../../src/pages/User/labels'
-import { users } from '../data'
+import { MOCK_DATA } from '../data'
 import { UserMenuItem } from '../support/commands'
 
-const { admin, subscriber } = users
-const eventReader = users.event_reader
-const machine = users.settings_machine_new
-const userProfiletype = users.settings_workplace_new
+const { admin, subscriber } = MOCK_DATA.users
+const eventReader = MOCK_DATA.users.event_reader
+const machine = MOCK_DATA.users.settings_machine_new
+const userProfiletype = MOCK_DATA.users.settings_workplace_new
 
 describe('[Profile]', () => {
   beforeEach(() => {

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

@@ -0,0 +1,52 @@
+import { MOCK_DATA } from '../../data'
+
+const questions = Object.values(MOCK_DATA.questions)
+
+describe('[Questions]', () => {
+  describe('[List questions]', () => {
+    it('[By Everyone]', () => {
+      cy.step('All questions visible')
+      cy.visit('/questions')
+      cy.get('[data-cy=question-list-item]').each((_, index) => {
+        cy.contains(questions[index].title)
+        cy.contains(questions[index]._createdBy)
+        cy.contains(questions[index].subscribers.length)
+        cy.contains(questions[index].commentCount)
+      })
+      // To-do filtering and searching tests
+    })
+  })
+
+  describe('[Individual questions]', () => {
+    it('[By Everyone]', () => {
+      const question = questions[0]
+      const questionDiscussion = Object.values(MOCK_DATA.discussions).find(
+        (discussion) => discussion.sourceId === question._id,
+      )
+      const newReply = 'Thanks Dave and Ben. What does everyone else think?'
+
+      cy.step('Can visit question')
+      cy.visit(`/questions/${question.slug}`)
+
+      cy.step('All metadata visible')
+      cy.contains(`${question.subscribers.length} following`)
+      cy.contains(`${question.votedUsefulBy.length} useful`)
+      cy.contains(`${questionDiscussion.comments.length} comments`)
+
+      cy.step('Logged in users can complete actions')
+      cy.login('[email protected]', 'test1234')
+      cy.visit(`/questions/${question.slug}`) // Page doesn't reload after login
+
+      cy.get('[data-cy=follow-button]').click()
+      cy.contains(`${question.subscribers.length + 1} following`)
+
+      cy.get('[data-cy=vote-useful]').click()
+      cy.contains(`${question.votedUsefulBy.length + 1} useful`)
+
+      cy.get('[data-cy=show-replies]:first').click()
+      cy.get('[data-cy=comments-form]:first').type(newReply)
+      cy.get('[data-cy=comment-submit]:first').click()
+      cy.contains(`${questionDiscussion.comments.length + 1} comments`)
+    })
+  })
+})

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

@@ -0,0 +1,81 @@
+const creatorEmail = '[email protected]'
+const creatorPassword = 'test1234'
+
+describe('[Question]', () => {
+  describe('[Create a question]', () => {
+    const initialTitle = 'Health consequences'
+    const initialExpectedSlug = 'health-consequences'
+    const initialQuestionDescription =
+      "Hello! I'm wondering how people feel about the health concerns about working with melting plastic and being in environments with microplastics. I have been working with recycling plastic (hdpe) for two years now, shredding and injection molding and haven't had any bad consequences yet. But with the low knowledge around micro plastics and its effects on the human body, and many concerns and hypotheses I have been a bit concerned lately.So I would like to ask the people in this community how you are feeling about it, and if you have experienced any issues with the microplastics or gases yet, if so how long have you been working with it? And what extra steps do you take to be protected from it? I use a gas mask with dust filters"
+    const tag1 = 'product'
+    const tag2 = 'workshop'
+
+    const updatedTitle = 'Health consequences v2'
+    const updatedExpectedSlug = 'health-consequences-v2'
+    const updatedQuestionDescription = `${initialQuestionDescription} and super awesome goggles`
+
+    it('[By Authenticated]', () => {
+      cy.visit('/questions')
+      cy.login(creatorEmail, creatorPassword)
+
+      cy.step('Go to create page')
+      cy.get('[data-cy=create]').click()
+      cy.get('[data-cy=question-create-title]')
+
+      cy.step('Add title field')
+      cy.get('[data-cy=field-title]').type(initialTitle).blur({ force: true })
+
+      cy.step('Add title description')
+      cy.get('[data-cy=field-description]').type(initialQuestionDescription, {
+        delay: 0,
+      })
+
+      // To do - Set categories so this can then be selected here.
+
+      cy.selectTag(tag1, '[data-cy="tag-select"]')
+      cy.selectTag(tag2, '[data-cy="tag-select"]')
+
+      cy.step('Submit question')
+      cy.get('[data-cy=submit]')
+        .click()
+        .url()
+        .should('include', `/questions/${initialExpectedSlug}`)
+
+      cy.step('All question fields visible')
+      cy.contains(initialTitle)
+      cy.contains(initialQuestionDescription)
+      cy.contains(tag1)
+      cy.contains(tag2)
+
+      cy.step('Edit question')
+      cy.get('[data-cy=edit]')
+        .click()
+        .url()
+        .should('include', `/questions/${initialExpectedSlug}/edit`)
+
+      cy.step('Update title field')
+      cy.get('[data-cy=field-title]').clear().type(updatedTitle).blur()
+
+      cy.step('Add title description')
+      cy.get('[data-cy=field-description]')
+        .clear()
+        .type(updatedQuestionDescription, { delay: 0 })
+
+      cy.step('Submit updated question')
+      cy.get('[data-cy=submit]')
+        .click()
+        .url()
+        .should('include', `/questions/${updatedExpectedSlug}`)
+
+      cy.step('All updated fields visible on page')
+      cy.contains(updatedTitle)
+      cy.contains(updatedQuestionDescription)
+
+      cy.step('All updated fields visiable on list')
+      cy.visit('/questions')
+      cy.contains(updatedTitle)
+      // cy.contains(tag1) <-- These should be added to the main list display
+      // cy.contains(tag2)
+    })
+  })
+})

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

@@ -1,8 +1,8 @@
-import { users } from '../data'
+import { MOCK_DATA } from '../data'
 import { DbCollectionName } from '../utils/TestUtils'
 
 context('unsubscribe', () => {
-  const betaTester = users['beta-tester']
+  const betaTester = MOCK_DATA.users['beta-tester']
 
   beforeEach(() => {
     cy.visit(`/unsubscribe/${betaTester.unsubscribeToken}`)

shared/mocks/data/discussions.ts

@@ -0,0 +1,59 @@
+export const discussions = {
+  '06fjiZWeyxxMkE0brp6n': {
+    _created: '2022-02-10T20:22:15.500Z',
+    _deleted: false,
+    _id: '06fjiZWeyxxMkE0brp6n',
+    _modified: '2022-02-10T20:22:15.500Z',
+    comments: [
+      {
+        _created: '2022-02-10T20:22:15.500Z',
+        _creatorId: 'Q1sgtnNTPBSYCKEXCOWaOMcPqZD3',
+        _edited: '2022-02-10T20:22:15.500Z',
+        _id: 'ZAB2SoUZtzUyeYLg9Cro',
+        creatorCountry: 'af',
+        creatorName: 'howto_creator',
+        parentCommentId: null,
+        text: "i like your logo but I couldn't be conected for a while and I CANNOT tell you that anymore.",
+      },
+      {
+        _created: '2023-02-10T20:22:15.500Z',
+        _creatorId: 'TPBSYCKEXCOWaOMcPqZD3Q1sgtnN',
+        _id: 'ZtzUyeYLgZAB2SoU9Cro',
+        creatorCountry: 'uk',
+        creatorName: 'benfurber',
+        parentCommentId: null,
+        text: "Love what you're doing. Keep it up.",
+      },
+      {
+        _created: '2023-02-11T02:22:15.500Z',
+        _creatorId: 'TPBSYCKEXCOWaOMcPqZD3Q1sgtnN',
+        _id: 'BtzUAB2SoU9CroyeYLgZ',
+        creatorCountry: 'uk',
+        creatorName: 'benfurber',
+        parentCommentId: 'ZAB2SoUZtzUyeYLg9Cro',
+        text: 'Annoyingly, I think I agree with @howto_creator.',
+      },
+      {
+        _created: '2023-02-12T02:22:19.500Z',
+        _edited: '2023-02-12T02:22:43.500Z',
+        _creatorId: 'TPBSYCKEXCOWaOMcPqZD3Q1sgtnN',
+        _id: 'Bt9CroyeYLgZ55555',
+        creatorCountry: '',
+        creatorName: 'davehakkens',
+        parentCommentId: 'ZAB2SoUZtzUyeYLg9Cro',
+        text: 'Me too @benfurber!',
+      },
+      {
+        _created: '2023-02-15T02:45:15.500Z',
+        _creatorId: 'TPBSYCKEXCOWaOMcPqZD3Q1sgtnN',
+        _id: 'BtzUAB2SoU9CroyeYLgZ',
+        creatorCountry: 'uk',
+        creatorName: 'benfurber',
+        parentCommentId: 'ZAB2SoUZtzUyeYLg9Cro',
+        text: '<3',
+      },
+    ],
+    sourceId: '3s7Fyn6Jf8ryANJM6Jf6',
+    sourceType: 'question',
+  },
+}

shared/mocks/data/index.ts

@@ -1,6 +1,9 @@
 export { categories } from './categories'
+export { discussions } from './discussions'
 export { howtos } from './howtos'
 export { mappins } from './mappins'
+export { questionCategories } from './questionCategories'
+export { questions } from './questions'
 export { research } from './research'
 export { tags } from './tags'
 export { users } from './users'

shared/mocks/data/questionCategories.ts

@@ -0,0 +1,30 @@
+export const questionCategories = {
+  LSH1ehdIE36hWyk3Ockr: {
+    _modified: '2012-10-27T01:47:57.948Z',
+    _created: '2012-08-02T07:27:04.609Z',
+    _id: 'categoryLSH1ehdIE36hWyk3Ockr',
+    label: 'product',
+    _deleted: false,
+  },
+  Lmj5B5UJh0M8BxSTP3uI: {
+    _modified: '2018-07-29T04:34:49.982Z',
+    _created: '2017-11-20T05:58:20.458Z',
+    _id: 'categoryLmj5B5UJh0M8BxSTP3uI',
+    label: 'exhibition',
+    _deleted: false,
+  },
+  oN1tULWYIN9P1ytOfdDQ: {
+    _deleted: false,
+    _modified: '2018-05-19T04:57:18.471Z',
+    _created: '2017-10-29T07:29:17.905Z',
+    _id: 'categoryoN1tULWYIN9P1ytOfdDQ',
+    label: 'compression',
+  },
+  oix4r6grC1mMA0Xz3K: {
+    _modified: '2017-01-19T07:07:12.730Z',
+    _created: '2015-02-23T23:04:03.609Z',
+    _id: 'categoryoix4r6grC1mMA0Xz3K',
+    label: 'screening',
+    _deleted: false,
+  },
+}

shared/mocks/data/questions.ts

@@ -0,0 +1,36 @@
+export const questions = {
+  '3s7Fyn6Jf8ryANJM6Jf6': {
+    _created: '2024-03-14T10:57:20.113Z',
+    _createdBy: 'demo_user',
+    _deleted: false,
+    _id: '3s7Fyn6Jf8ryANJM6Jf6',
+    _modified: '2024-03-15T15:14:25.029Z',
+    commentCount: 3,
+    creatorCountry: '',
+    description: 'test info',
+    keywords: ['test', 'question', 'info'],
+    latestCommentDate: '15 March 2024 at 15:14:24 UTC',
+    moderation: 'accepted',
+    questionCategory: {
+      _created: '2024-01-10T09:00:00.000Z',
+      _deleted: false,
+      _id: 'test',
+      _modified: '2024-01-10T09:00:00.000Z',
+      label: 'test category',
+    },
+    slug: 'the-first-test-question',
+    tags: {
+      KP3McutTpuEWz06G5EY1: true,
+      Wk6RnHHFfKSiI71BlM8r: true,
+    },
+    title: 'The first test question',
+    total_views: 3,
+    votedUsefulBy: [
+      'demo_user',
+      'notification_triggerer',
+      'settings_workplace_new',
+      'mapview_testing_rejected',
+    ],
+    subscribers: ['demo_user', 'benfurber'],
+  },
+}

src/pages/Question/Content/Common/FormFields/QuestionCategory.field.tsx

@@ -8,7 +8,7 @@ export const QuestionCategoryField = () => {
   const name = 'questionCategory'
 
   return (
-    <FormFieldWrapper htmlFor={name} text={title} required>
+    <FormFieldWrapper htmlFor={name} text={title}>
       <Field
         name={name}
         id={name}

src/pages/Question/Content/Common/FormFields/QuestionDescription.field.tsx

@@ -12,6 +12,7 @@ export const QuestionDescriptionField = () => {
   return (
     <FormFieldWrapper htmlFor={name} text={title} required>
       <Field
+        data-cy={`field-${name}`}
         component={FieldTextarea}
         id={name}
         name={name}

src/pages/Question/Content/Common/FormFields/QuestionTags.field.tsx

@@ -9,8 +9,9 @@ export const QuestionTagsField = () => {
   const name = 'tags'
 
   return (
-    <FormFieldWrapper htmlFor={name} text={title} required>
+    <FormFieldWrapper htmlFor={name} text={title}>
       <Field
+        data-cy={`field-${name}`}
         name={name}
         id={name}
         component={TagsSelectField}

src/pages/Question/Content/Common/FormFields/QuestionTitle.field.tsx

@@ -15,6 +15,7 @@ export const QuestionTitleField = () => {
   return (
     <FormFieldWrapper htmlFor={name} text={title} required>
       <Field
+        data-cy={`field-${name}`}
         name={name}
         id={name}
         validate={composeValidators(