test(gate): add tests with file upload and apollo client (#529)

### Describe your change Add file upload test using raw fetch and apollo client. ### Motivation and context Ensure common uses of upload feature to work. ### Migration notes  ### Checklist - [x] The change come with new or modified tests - [ ] Hard-to-understand functions have explanatory comments - [ ] End-user documentation is updated to reflect the change
metatypedev · Dec 27, 2023 · b04c1b4 · b04c1b4
1 parent 5233c8e
commit b04c1b4
Show file tree

Hide file tree

Showing 19 changed files with 3,219 additions and 3 deletions.
diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
@@ -50,15 +50,15 @@ repos:
       - id: deno-fmt
         name: Deno format
         language: system
-        entry: bash -c 'cd typegate && deno fmt --ignore=native,src/typegraphs,tmp && cd ../dev && deno fmt'
+        entry: bash -c 'cd typegate && deno fmt --ignore=native,src/typegraphs,tmp,tests/e2e/nextjs && cd ../dev && deno fmt'
         pass_filenames: false
         types:
           - ts
         files: ^(typegate|dev)/
       - id: deno-lint
         name: Deno lint
         language: system
-        entry: bash -c 'cd typegate && deno lint --rules-exclude=no-explicit-any --ignore=native,tmp && cd ../dev && deno lint'
+        entry: bash -c 'cd typegate && deno lint --rules-exclude=no-explicit-any --ignore=native,tmp,tests/e2e/nextjs && cd ../dev && deno lint'
         pass_filenames: false
         types:
           - ts

diff --git a/dev/update.ts b/dev/update.ts
@@ -67,6 +67,7 @@ const tsFiles = [
     {
       root: projectDir,
       globstar: true,
+      exclude: ["typegate/tests/e2e/nextjs"],
     },
   ),
 ].map((f: WalkEntry) => f.path);

diff --git a/libs/xtask/src/deno.rs b/libs/xtask/src/deno.rs
@@ -60,6 +60,7 @@ impl Test {
                     "mkdir",
                     "bash",
                     "npm",
+                    "pnpm",
                 ]
                 .into_iter()
                 .map(str::to_owned)

diff --git a/typegate/tests/e2e/nextjs/apollo/.eslintrc.json b/typegate/tests/e2e/nextjs/apollo/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}
diff --git a/typegate/tests/e2e/nextjs/apollo/.gitignore b/typegate/tests/e2e/nextjs/apollo/.gitignore
@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
diff --git a/typegate/tests/e2e/nextjs/apollo/app/favicon.ico b/typegate/tests/e2e/nextjs/apollo/app/favicon.ico
diff --git a/typegate/tests/e2e/nextjs/apollo/app/layout.tsx b/typegate/tests/e2e/nextjs/apollo/app/layout.tsx
@@ -0,0 +1,16 @@
+export const metadata = {
+  title: "Next.js",
+  description: "Generated by Next.js",
+};
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  );
+}
diff --git a/typegate/tests/e2e/nextjs/apollo/app/page.tsx b/typegate/tests/e2e/nextjs/apollo/app/page.tsx
@@ -0,0 +1,7 @@
+export default function Home() {
+  return (
+    <div>
+      Hello World
+    </div>
+  );
+}
diff --git a/typegate/tests/e2e/nextjs/apollo/next.config.js b/typegate/tests/e2e/nextjs/apollo/next.config.js
@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {};
+
+module.exports = nextConfig;
diff --git a/typegate/tests/e2e/nextjs/apollo/package.json b/typegate/tests/e2e/nextjs/apollo/package.json
@@ -0,0 +1,31 @@
+{
+  "name": "apollo",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "@apollo/client": "^3.8.8",
+    "apollo-upload-client": "^18.0.1",
+    "graphql": "^16.8.1",
+    "next": "14.0.4",
+    "react": "^18",
+    "react-dom": "^18"
+  },
+  "devDependencies": {
+    "@types/apollo-upload-client": "^17.0.5",
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "autoprefixer": "^10.0.1",
+    "eslint": "^8",
+    "eslint-config-next": "14.0.4",
+    "postcss": "^8",
+    "tailwindcss": "^3.3.0",
+    "typescript": "^5"
+  }
+}
diff --git a/typegate/tests/e2e/nextjs/apollo/pages/api/apollo.ts b/typegate/tests/e2e/nextjs/apollo/pages/api/apollo.ts
@@ -0,0 +1,39 @@
+// Copyright Metatype OÜ, licensed under the Elastic License 2.0.
+// SPDX-License-Identifier: Elastic-2.0
+
+import type { NextApiRequest, NextApiResponse } from "next";
+import { ApolloClient, gql, InMemoryCache } from "@apollo/client/index";
+import createUploadLink from "apollo-upload-client/createUploadLink.mjs";
+
+type ResponseData = {
+  message: string;
+};
+
+export default function handler(
+  _req: NextApiRequest,
+  res: NextApiResponse<ResponseData>,
+) {
+  const client = new ApolloClient({
+    cache: new InMemoryCache(),
+    // Does FormData.append stuff and enables File Upload
+    // Please refer to https://github.com/jaydenseric/apollo-upload-client/blob/master/createUploadLink.mjs
+    // Note: if link and uri are both provided, link takes precedence
+    link: createUploadLink({ uri: "http://localhost:7897/apollo" })
+  });
+
+  client.mutate({
+    mutation: gql`
+      mutation ($files: [File]!, $prefix: String!) {
+        uploadMany(files: $files, prefix: $prefix)
+      }
+    `,
+    variables: {
+      files: [1, 2, 3, 4].map((i) =>
+        new File([`hello #${i}`], `hello-${i}.txt`, { type: "text/plain" })
+      ),
+      prefix: "user/",
+    },
+  })
+    .then((out: any) => res.status(200).json({ success: out } as any))
+    .catch((err: any) => res.status(400).json({ error: err!.message } as any));
+}
-Original file line number
+Diff line change
@@ Expand Up / @@ -60,6 +60,7 @@ impl Test { @@
                         "mkdir",
                         "bash",
                         "npm",
+                        "pnpm",
                     ]
                     .into_iter()
                     .map(str::to_owned)
@@ Expand Down @@