chore: add test commands

vuestorefront · Dec 18, 2023 · 7bb92c1 · 7bb92c1
1 parent 1888ead
commit 7bb92c1
Show file tree

Hide file tree

Showing 35 changed files with 159 additions and 210 deletions.
diff --git a/.github/workflows/continuous-integration-storefront.yml b/.github/workflows/continuous-integration-storefront.yml
@@ -0,0 +1,21 @@
+name: Continuous Integration (Storefront)
+on:
+  pull_request:
+    types: ["opened", "edited", "reopened", "synchronize"]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+
+defaults:
+  run:
+    working-directory: packages/storefront
+
+jobs:
+  continous-integration-storefront:
+    name: "Continuous Integration (Storefront)"
+    uses: vuestorefront/integrations-github-workflows/.github/workflows/continuous-integration.yml@main
+    secrets: inherit
+    with:
+      enterprise: false
+      node_version: "['18']"
diff --git a/.gitignore b/.gitignore
@@ -29,6 +29,7 @@ coverage
 
 # Nuxt generated files
 .nuxt
+.output
 
 # Next generated files
 .next

diff --git a/packages/storefront/package.json b/packages/storefront/package.json
@@ -1,6 +1,11 @@
 {
   "name": "root-storefront",
   "private": true,
+  "scripts": {
+    "test:next": "cd packages/next && yarn test",
+    "test:nuxt": "cd packages/nuxt && yarn test",
+    "test": "yarn test:next && yarn test:nuxt"
+  },
   "workspaces": {
     "packages": [
       "packages/**/*"

diff --git a/packages/storefront/packages/next/__tests__/apps/app-router/app/csr/page.tsx b/packages/storefront/packages/next/__tests__/apps/app-router/app/csr/page.tsx
@@ -1,3 +1,4 @@
+// eslint-disable-next-line import/no-unresolved, import/extensions
 import { ClientComponentUsingSdk } from "./ClientComponent";
 
 export default function ClientSidePage() {

diff --git a/packages/storefront/packages/next/__tests__/apps/app-router/app/layout.tsx b/packages/storefront/packages/next/__tests__/apps/app-router/app/layout.tsx
@@ -1,10 +1,21 @@
 import { ReactNode } from "react";
+// eslint-disable-next-line import/extensions, import/no-unresolved
 import { Providers } from "./providers";
 
 export default function RootLayout({ children }: { children: ReactNode }) {
   return (
     <html lang="en">
       <body>
+        <nav>
+          <ul>
+            <li>
+              <a href="/ssr">SSR Page</a>
+            </li>
+            <li>
+              <a href="/csr">CSR Page</a>
+            </li>
+          </ul>
+        </nav>
         <Providers>{children}</Providers>
       </body>
     </html>

diff --git a/packages/storefront/packages/next/__tests__/apps/app-router/app/page.tsx b/packages/storefront/packages/next/__tests__/apps/app-router/app/page.tsx
@@ -0,0 +1,7 @@
+export default async function Home() {
+  return (
+    <main>
+      <h1>Home Page</h1>
+    </main>
+  );
+}
diff --git a/packages/storefront/packages/next/__tests__/apps/app-router/hooks/index.ts b/packages/storefront/packages/next/__tests__/apps/app-router/hooks/index.ts
@@ -1,3 +1,5 @@
-import { createSdkContext } from "../sdk.config";
+// eslint-disable-next-line import/no-unresolved
+import { createSdkContext } from "@vue-storefront/next/client";
+import { getSdk } from "../sdk.config";
 
-export const [SdkProvider, useSdk] = createSdkContext();
+export const [SdkProvider, useSdk] = createSdkContext(getSdk() as any);
diff --git a/packages/storefront/packages/next/__tests__/apps/app-router/next.config.js b/packages/storefront/packages/next/__tests__/apps/app-router/next.config.js
@@ -1,6 +1,7 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  transpilePackages: ["@storefront/shared"],
+  // With swcMinify set to true, the build will fail because of some transpilation error, probably an issue on Next.js side
+  swcMinify: true,
 };
 
 module.exports = nextConfig;
diff --git a/packages/storefront/packages/next/__tests__/apps/app-router/sdk.config.ts b/packages/storefront/packages/next/__tests__/apps/app-router/sdk.config.ts
@@ -7,7 +7,7 @@ const options: CreateSdkOptions = {
   },
 };
 
-export const { getSdk, createSdkContext } = createSdk(
+export const { getSdk } = createSdk(
   options,
   ({ buildModule, middlewareUrl, getRequestHeaders }) => ({
     example: buildModule(exampleSdkModule, {

diff --git a/packages/storefront/packages/next/__tests__/apps/pages-router/hooks/index.ts b/packages/storefront/packages/next/__tests__/apps/pages-router/hooks/index.ts
@@ -1,3 +1,5 @@
-import { createSdkContext } from "../sdk.config";
+/* eslint-disable import/no-unresolved */
+import { createSdkContext } from "@vue-storefront/next/client";
+import { getSdk } from "../sdk.config";
 
-export const [SdkProvider, useSdk] = createSdkContext();
+export const [SdkProvider, useSdk] = createSdkContext(getSdk());
diff --git a/packages/storefront/packages/next/__tests__/apps/pages-router/pages/_app.tsx b/packages/storefront/packages/next/__tests__/apps/pages-router/pages/_app.tsx
@@ -4,6 +4,16 @@ import { SdkProvider } from "../hooks";
 export default function App({ Component, pageProps }: AppProps) {
   return (
     <SdkProvider>
+      <nav>
+        <ul>
+          <li>
+            <a href="/ssr">SSR Page</a>
+          </li>
+          <li>
+            <a href="/csr">CSR Page</a>
+          </li>
+        </ul>
+      </nav>
       <Component {...pageProps} />
     </SdkProvider>
   );

diff --git a/packages/storefront/packages/next/__tests__/apps/pages-router/pages/index.tsx b/packages/storefront/packages/next/__tests__/apps/pages-router/pages/index.tsx
@@ -0,0 +1,7 @@
+export default function Home() {
+  return (
+    <main>
+      <h1>Home Page</h1>
+    </main>
+  );
+}
diff --git a/packages/storefront/packages/next/__tests__/apps/pages-router/sdk.config.ts b/packages/storefront/packages/next/__tests__/apps/pages-router/sdk.config.ts
@@ -1,3 +1,4 @@
+/* eslint-disable import/no-unresolved */
 /* eslint-disable import/no-relative-packages */
 import { exampleSdkModule } from "@storefront/shared";
 import { CreateSdkOptions, createSdk } from "@vue-storefront/next";
@@ -8,7 +9,7 @@ const options: CreateSdkOptions = {
   },
 };
 
-export const { getSdk, createSdkContext } = createSdk(
+export const { getSdk } = createSdk(
   options,
   ({ buildModule, middlewareUrl, getRequestHeaders }) => ({
     example: buildModule(exampleSdkModule, {

diff --git a/packages/storefront/packages/next/package.json b/packages/storefront/packages/next/package.json
@@ -2,23 +2,50 @@
   "name": "@vue-storefront/next",
   "license": "MIT",
   "version": "0.0.1",
-  "main": "dist/index.js",
-  "module": "dist/index.mjs",
-  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./client": {
+      "import": "./dist/client.js",
+      "require": "./dist/client.js",
+      "types": "./dist/client.d.ts"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      "*": [
+        "dist/index.d.ts"
+      ],
+      "client": [
+        "dist/client.d.ts"
+      ]
+    }
+  },
   "files": [
     "dist"
   ],
   "scripts": {
-    "build": "tsup src/index.ts --dts-resolve",
+    "build": "tsup && yarn build:app-router && yarn build:pages-router",
+    "build:app-router": "cd __tests__/apps/app-router && yarn build",
+    "build:pages-router": "cd __tests__/apps/pages-router && yarn build",
+    "dev:app-router": "cd __tests__/apps/app-router && yarn dev",
+    "dev:pages-router": "cd __tests__/apps/pages-router && yarn dev",
+    "dev:middleware": "cd ../shared/src/__tests__/middleware && yarn dev",
     "lint": "eslint . --ext .ts",
-    "test:unit": "vitest",
-    "test:e2e": "cypress run"
+    "test:app-router": "start-server-and-test dev:middleware localhost:4000/test_integration/success dev:app-router localhost:3000 \"yarn test:e2e\"",
+    "test:pages-router": "start-server-and-test dev:middleware localhost:4000/test_integration/success dev:pages-router localhost:3000 \"yarn test:e2e\"",
+    "test": "yarn test:app-router && yarn test:pages-router",
+    "test:e2e": "cd ../shared/ && yarn test:e2e",
+    "test:unit": "vitest run"
   },
   "devDependencies": {
     "@types/react": "^18.2.31",
     "@types/react-dom": "^18.2.14",
-    "cypress": "^13.6.1",
     "react-dom": "^18.2.0",
+    "start-server-and-test": "^2.0.3",
     "tsup": "8.0.1",
     "vitest": "^0.34.6"
   },
@@ -30,13 +57,5 @@
   "engines": {
     "npm": ">=8.0.0",
     "node": ">=18.0.0"
-  },
-  "tsup": {
-    "clean": true,
-    "target": "es2019",
-    "format": [
-      "cjs",
-      "esm"
-    ]
   }
 }
diff --git a/packages/storefront/packages/next/src/client.ts b/packages/storefront/packages/next/src/client.ts
@@ -0,0 +1,3 @@
+"use client";
+
+export * from "./sdk/client";
diff --git a/...kages/next/src/sdk/helpers/SdkContext.tsx → ...orefront/packages/next/src/sdk/client.tsx b/...kages/next/src/sdk/helpers/SdkContext.tsx → ...orefront/packages/next/src/sdk/client.tsx
@@ -2,14 +2,12 @@
 
 "use client";
 
-import { initSDK } from "@vue-storefront/sdk";
+import { SDKApi } from "@vue-storefront/sdk";
 import Script from "next/script";
 import React, { createContext, useContext } from "react";
-import { SdkProviderProps } from "../types";
+import { SdkProviderProps } from "./types";
 
-export function createSdkContext<TSdk extends ReturnType<typeof initSDK>>(
-  sdk: TSdk
-) {
+export function createSdkContext<TSdk extends SDKApi<any>>(sdk: TSdk) {
   const SdkContext = createContext<TSdk>(sdk);
 
   function SdkProvider({ children }: SdkProviderProps) {

diff --git a/packages/storefront/packages/next/src/sdk/helpers/index.ts b/packages/storefront/packages/next/src/sdk/helpers/index.ts
@@ -1,3 +1,2 @@
 // eslint-disable-next-line import/extensions, import/no-unresolved
-export * from "./SdkContext";
 export * from "./resolveDynamicContext";
diff --git a/packages/storefront/packages/next/src/sdk/index.tsx b/packages/storefront/packages/next/src/sdk/index.tsx
@@ -1,9 +1,9 @@
-import { buildModule, initSDK } from "@vue-storefront/sdk";
 import {
   composeMiddlewareUrl,
   type CreateSdkOptions,
 } from "@storefront/shared";
-import { createSdkContext, resolveDynamicContext } from "./helpers";
+import { buildModule, initSDK } from "@vue-storefront/sdk";
+import { resolveDynamicContext } from "./helpers";
 import { Config, CreateSdkReturn, GetSdkContext } from "./types";
 
 export type { CreateSdkOptions } from "@storefront/shared";
@@ -67,6 +67,5 @@ export function createSdk<TConfig extends Record<string, any>>(
 
   return {
     getSdk,
-    createSdkContext: () => createSdkContext(getSdk()),
   };
 }
diff --git a/packages/storefront/packages/next/src/sdk/types.ts b/packages/storefront/packages/next/src/sdk/types.ts
@@ -77,23 +77,4 @@ export interface CreateSdkReturn<TConfig extends Record<string, any>> {
    * ```
    */
   getSdk: (dynamicContext?: GetSdkContext) => SDKApi<TConfig>;
-
-  /**
-   * Creates a new SDK context. This function is dedicated for the client-side usage.
-   *
-   * @example
-   * Create a new SDK context somewhere in your application. It may be the `hooks/sdk.ts` file.
-   *
-   * ```tsx
-   * import { createSdkContext } from "../../sdk.config";
-   *
-   * export const [SdkProvider, useSdk] = createSdkContext();
-   * ```
-   * Then use the `SdkProvider` in the root component of your application.
-   * For Pages Router it would be the `pages/_app.tsx` file,
-   * and for the App Router it would be the `app/layout.tsx` file.
-   * Finally you can use the `useSdk` in any client component of your application.
-   * @returns [SdkProvider, useSdk] - The SDK provider and the `useSdk` hook.
-   */
-  createSdkContext: () => CreateSdkContextReturn<TConfig>;
 }
diff --git a/packages/storefront/packages/next/tsup.config.ts b/packages/storefront/packages/next/tsup.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from "tsup";
+
+export default defineConfig({
+  entry: {
+    index: "src/index.ts",
+    client: "src/client.ts",
+  },
+  target: "es2015",
+  format: ["cjs", "esm"],
+  dts: true,
+});
diff --git a/packages/storefront/packages/nuxt/__tests__/app/app.vue b/packages/storefront/packages/nuxt/__tests__/app/app.vue
@@ -1,5 +1,15 @@
 <template>
   <div>
+    <nav>
+      <ul>
+        <li>
+          <a href="/ssr">SSR Page</a>
+        </li>
+        <li>
+          <a href="/csr">CSR Page</a>
+        </li>
+      </ul>
+    </nav>
     <NuxtPage />
   </div>
 </template>
diff --git a/packages/storefront/packages/nuxt/__tests__/app/package.json b/packages/storefront/packages/nuxt/__tests__/app/package.json
@@ -3,6 +3,7 @@
   "name": "@vue-storefront/nuxt-tests-app",
   "type": "module",
   "scripts": {
+    "build": "nuxt build",
     "dev": "nuxt dev",
     "postinstall": "nuxt prepare"
   },

diff --git a/packages/storefront/packages/nuxt/__tests__/app/pages/index.vue b/packages/storefront/packages/nuxt/__tests__/app/pages/index.vue
@@ -0,0 +1,3 @@
+<template>
+  <h1>Home Page</h1>
+</template>
diff --git a/packages/storefront/packages/nuxt/__tests__/e2e/e2e/sdkModule.cy.ts b/packages/storefront/packages/nuxt/__tests__/e2e/e2e/sdkModule.cy.ts
diff --git a/packages/storefront/packages/nuxt/__tests__/e2e/support/commands.ts b/packages/storefront/packages/nuxt/__tests__/e2e/support/commands.ts
-Original file line number
+Diff line change
@@ Expand Up / @@ -29,6 +29,7 @@ coverage @@
     # Nuxt generated files
     .nuxt
+    .output
     # Next generated files
     .next
@@ Expand Down @@