test(services): add tests for createComment mutation

* add Jest test
* add a Cypress test in article pages spec

5 files changed, 76 insertions, 2 deletions

diff --git a/tests/msw/handlers/forms/create-comment.handler.ts b/tests/msw/handlers/forms/create-comment.handler.ts
new file mode 100644
index 0000000..d4c6003
--- /dev/null
+++ b/tests/msw/handlers/forms/create-comment.handler.ts
@@ -0,0 +1,49 @@
+import { type ExecutionResult, graphql } from 'graphql';
+import { HttpResponse } from 'msw';
+import type {
+  CreateCommentInput,
+  CreateCommentPayload,
+  CreateCommentResponse,
+} from '../../../../src/services/graphql';
+import { wordpressAPI } from '../../instances';
+import { schema } from '../../schema';
+
+export const createCommentHandler = wordpressAPI.mutation<
+  CreateCommentResponse,
+  Record<'input', CreateCommentInput>
+>('CreateComment', async ({ query, variables }) => {
+  const pageParams = new URLSearchParams(window.location.search);
+  const isError = pageParams.get('error') === 'true';
+
+  if (isError)
+    return HttpResponse.json({
+      data: {
+        createComment: {
+          clientMutationId: null,
+          comment: null,
+          success: false,
+        },
+      },
+    });
+
+  const { data, errors } = (await graphql({
+    schema,
+    source: query,
+    variableValues: variables,
+    rootValue: {
+      createComment({ input }: typeof variables): CreateCommentPayload {
+        const { clientMutationId } = input;
+
+        return {
+          clientMutationId,
+          comment: {
+            approved: true,
+          },
+          success: true,
+        };
+      },
+    },
+  })) as ExecutionResult<CreateCommentResponse>;
+
+  return HttpResponse.json({ data, errors });
+});
diff --git a/tests/msw/handlers/forms/index.ts b/tests/msw/handlers/forms/index.ts
index ce1e5b3..64be29b 100644
--- a/tests/msw/handlers/forms/index.ts
+++ b/tests/msw/handlers/forms/index.ts
@@ -1,3 +1,4 @@
+import { createCommentHandler } from './create-comment.handler';
 import { sendEmailHandler } from './send-email.handler';
 
-export const formsHandlers = [sendEmailHandler];
+export const formsHandlers = [createCommentHandler, sendEmailHandler];
diff --git a/tests/msw/handlers/posts/post.handler.ts b/tests/msw/handlers/posts/post.handler.ts
index 72f7b95..57f415b 100644
--- a/tests/msw/handlers/posts/post.handler.ts
+++ b/tests/msw/handlers/posts/post.handler.ts
@@ -14,7 +14,9 @@ export const postHandler = wordpressAPI.query<
     source: query,
     variableValues: variables,
     rootValue: {
-      post: wpPostsFixture.find((wpPost) => wpPost.slug === variables.slug),
+      post: wpPostsFixture.find((wpPost) =>
+        wpPost.slug.includes(variables.slug)
+      ),
     },
   })) as ExecutionResult<PostResponse>;
 
diff --git a/tests/msw/schema/types/create-comment.types.ts b/tests/msw/schema/types/create-comment.types.ts
new file mode 100644
index 0000000..31fc54d
--- /dev/null
+++ b/tests/msw/schema/types/create-comment.types.ts
@@ -0,0 +1,19 @@
+export const createCommentTypes = `input CreateCommentInput {
+  approved: String
+  author: String
+  authorEmail: String
+  authorUrl: String
+  clientMutationId: String
+  commentOn: Int
+  content: String
+  date: String
+  parent: ID
+  status: CommentStatusEnum
+  type: String
+}
+
+type CreateCommentPayload {
+  clientMutationId: String
+  comment: Comment
+  success: Boolean
+}`;
diff --git a/tests/msw/schema/types/index.ts b/tests/msw/schema/types/index.ts
index 1063772..e1d260a 100644
--- a/tests/msw/schema/types/index.ts
+++ b/tests/msw/schema/types/index.ts
@@ -1,6 +1,7 @@
 import { authorTypes } from './author.types';
 import { commentTypes } from './comment.types';
 import { commonTypes } from './common.types';
+import { createCommentTypes } from './create-comment.types';
 import { featuredImageTypes } from './featured-image.types';
 import { postTypes } from './post.types';
 import { sendEmailTypes } from './send-email.types';
@@ -54,6 +55,7 @@ const rootQueryType = `type Query {
 }`;
 
 const rootMutationType = `type Mutation {
+  createComment(input: CreateCommentInput!): CreateCommentPayload
   sendEmail(input: SendEmailInput!): SendEmailPayload
 }`;
 
@@ -61,6 +63,7 @@ export const types = [
   authorTypes,
   commentTypes,
   commonTypes,
+  createCommentTypes,
   featuredImageTypes,
   postTypes,
   sendEmailTypes,