test(services): add tests for createComment mutation

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

3 files changed, 54 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>;