Merge branch 'main' into pr/allow-browser-build-outside-next

.github/workflows/docs.yml

@@ -39,8 +39,8 @@ jobs:
 
       - name: Create Docs
         run: |
-          yarn workspaces foreach --all --include "@apollo/*" run build
-          yarn workspaces foreach --all --include "@apollo/*" exec api-extractor run
+          yarn run build:libs
+          yarn run build:docmodel
           yarn workspace monorepo docs
 
       - name: Commit changes back

.github/workflows/snapshot-release.yml

@@ -14,7 +14,7 @@ jobs:
     if: |
       github.repository == 'apollographql/apollo-client-nextjs' &&
       (
-        github.event_name == 'workflow_dispatch' || 
+        github.event_name == 'workflow_dispatch' ||
         (
           github.event.issue.pull_request &&
           (
@@ -29,18 +29,50 @@ jobs:
         )
       )
     steps:
-      - uses: alessbell/pull-request-comment-branch@v1.1
+      - uses: alessbell/pull-request-comment-branch@v2.1.0
         if: github.event_name == 'issue_comment'
         id: comment-branch
 
+      - name: Get sha
+        if: github.event_name == 'issue_comment'
+        id: parse-sha
+        continue-on-error: true
+        run: |
+          if [ "${{ steps.comment-branch.outputs.head_owner }}" == "apollographql" ]; then
+            echo "sha=${{ steps.comment-branch.outputs.head_sha }}" >> "${GITHUB_OUTPUT}"
+          else
+            sha_from_comment="$(echo $COMMENT_BODY | tr -s ' ' | cut -d ' ' -f2)"
+
+            if [ $sha_from_comment == "/release:pr" ]; then
+              exit 1
+            else
+              echo "sha=$sha_from_comment" >> "${GITHUB_OUTPUT}"
+            fi
+          fi
+        env:
+          COMMENT_BODY: ${{ github.event.comment.body }}
+
+      - name: Comment sha reminder
+        if: steps.parse-sha.outcome == 'failure'
+        uses: peter-evans/[email protected]
+        with:
+          issue-number: ${{ github.event.issue.number }}
+          body: |
+            Did you forget to add the sha? Please use `/release:pr <sha>`
+
+      - name: Fail job
+        if: steps.parse-sha.outcome == 'failure'
+        run: |
+          exit 1
+
       - name: Checkout head ref (comment trigger)
         if: github.event_name == 'issue_comment'
         uses: actions/checkout@v4
         with:
           ## specify the owner + repository in order to checkout the fork
           ## for community PRs
           repository: ${{ steps.comment-branch.outputs.head_owner }}/${{ steps.comment-branch.outputs.head_repo }}
-          ref: ${{ steps.comment-branch.outputs.head_ref }}
+          ref: ${{ steps.parse-sha.outputs.sha }}
           fetch-depth: 0
 
       - name: Checkout head ref (dispatch trigger)
@@ -53,7 +85,12 @@ jobs:
           registry-url: "https://registry.npmjs.org"
           cache: "yarn"
       - run: yarn install --immutable
-      - run: echo PKG_VERSION="0.0.0-commit-$(git rev-parse --short HEAD)" >> $GITHUB_ENV
+      # 0.0.0             : to sort lower than any other release
+      # -commit-release   : to sort higher than the already released 0.0.0-commit-<hash>,
+      # .0                : format specifier (if the following identifiers will change format, increase this number)
+      # .%ct              : commit timestamp (to sort releases by commit date, not by hash)
+      # .%h               : commit shorthash
+      - run: echo PKG_VERSION="$(git show --no-patch --format=0.0.0-commit-release.0.%ct.%h)" >> $GITHUB_ENV
 
       - name: "@apollo/client-react-streaming: update version"
         run: |

.github/workflows/vercel-integration.yml

@@ -0,0 +1,47 @@
+name: Playwright Tests
+
+on:
+  deployment_status:
+jobs:
+  run-e2es:
+    if: github.event_name == 'deployment_status' && github.event.deployment_status.state == 'success'
+    runs-on: ubuntu-latest
+    name: Run Playwright tests against Vercel deployment
+    defaults:
+      run:
+        working-directory: ./integration-test
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: "20.x"
+          cache: "yarn"
+      - name: Install Packages (Root)
+        run: yarn install --immutable
+        working-directory: ./
+      - name: Install Packages (Integration Test)
+        run: |
+          yarn install
+        env:
+          YARN_ENABLE_IMMUTABLE_INSTALLS: "false"
+
+      - name: Get installed Playwright version
+        id: playwright-version
+        run: yarn why @playwright/test --json | jq '.children|to_entries[0].value.locator' --raw-output | sed 's/^.*npm:/PLAYWRIGHT_VERSION=/' >> $GITHUB_ENV
+      - name: Cache playwright binaries
+        uses: actions/cache@v4
+        id: playwright-cache
+        with:
+          path: |
+            ~/.cache/ms-playwright
+          key: ${{ runner.os }}-playwright-${{ env.PLAYWRIGHT_VERSION }}
+      - run: npx playwright install --with-deps
+        if: steps.playwright-cache.outputs.cache-hit != 'true'
+      - run: npx playwright install-deps
+        if: steps.playwright-cache.outputs.cache-hit == 'true'
+
+      - name: "Run Playwright tests against Vercel deployment"
+        run: yarn workspace @integration-test/nextjs run test | tee $GITHUB_STEP_SUMMARY; exit ${PIPESTATUS[0]}
+        env:
+          BASE_URL: ${{ github.event.deployment_status.environment_url }}

integration-test/nextjs/playwright.config.ts

@@ -1,17 +1,20 @@
 import { defineConfig } from "@playwright/test";
 
 export default defineConfig({
-  webServer: {
-    command: "yarn next start",
-    port: 3000,
-    timeout: 120 * 1000,
-    reuseExistingServer: !process.env.CI,
-  },
-  timeout: 120 * 1000,
+  webServer: process.env.BASE_URL
+    ? undefined
+    : {
+        command: "yarn next start",
+        port: 3000,
+        timeout: 15 * 1000,
+        reuseExistingServer: !process.env.CI,
+      },
+  timeout: 15 * 1000,
   use: {
     headless: true,
     viewport: { width: 1280, height: 720 },
     ignoreHTTPSErrors: true,
+    baseURL: process.env.BASE_URL || "http://localhost:3000",
   },
   testDir: "src/",
 });

integration-test/nextjs/src/app/cc/dynamic/dynamic.test.ts

@@ -9,7 +9,7 @@ const regex_query_error_restart =
 test.describe("CC dynamic", () => {
   test.describe("useSuspenseQuery", () => {
     test("one query", async ({ page, blockRequest, hydrationFinished }) => {
-      await page.goto("http://localhost:3000/cc/dynamic/useSuspenseQuery", {
+      await page.goto("/cc/dynamic/useSuspenseQuery", {
         waitUntil: "commit",
       });
 
@@ -30,12 +30,9 @@ test.describe("CC dynamic", () => {
         allLogs.push(message.text());
       });
 
-      await page.goto(
-        "http://localhost:3000/cc/dynamic/useSuspenseQueryWithError",
-        {
-          waitUntil: "commit",
-        }
-      );
+      await page.goto("/cc/dynamic/useSuspenseQueryWithError", {
+        waitUntil: "commit",
+      });
 
       await expect(page).toBeInitiallyLoading(true);
 
@@ -57,7 +54,7 @@ test.describe("CC dynamic", () => {
 
   test.describe("useBackgroundQuery + useReadQuery", () => {
     test("one query", async ({ page, blockRequest, hydrationFinished }) => {
-      await page.goto("http://localhost:3000/cc/dynamic/useBackgroundQuery", {
+      await page.goto("/cc/dynamic/useBackgroundQuery", {
         waitUntil: "commit",
       });
 
@@ -71,12 +68,9 @@ test.describe("CC dynamic", () => {
 
     // this will close the connection before the final result is received, so it can never be forwarded
     test("no `useReadQuery` on the server", async ({ page }) => {
-      await page.goto(
-        "http://localhost:3000/cc/dynamic/useBackgroundQueryWithoutSsrReadQuery",
-        {
-          waitUntil: "commit",
-        }
-      );
+      await page.goto("/cc/dynamic/useBackgroundQueryWithoutSsrReadQuery", {
+        waitUntil: "commit",
+      });
 
       await expect(page.getByText("rendered on server")).toBeVisible();
 
@@ -92,7 +86,7 @@ test.describe("CC dynamic", () => {
   });
   test.describe("useQuery", () => {
     test("without cache value", async ({ page }) => {
-      await page.goto("http://localhost:3000/cc/dynamic/useQuery", {
+      await page.goto("/cc/dynamic/useQuery", {
         waitUntil: "commit",
       });
 
@@ -102,7 +96,7 @@ test.describe("CC dynamic", () => {
     });
 
     test("with cache value", async ({ page }) => {
-      await page.goto("http://localhost:3000/cc/dynamic/useQueryWithCache", {
+      await page.goto("/cc/dynamic/useQueryWithCache", {
         waitUntil: "commit",
       });
 
@@ -112,12 +106,9 @@ test.describe("CC dynamic", () => {
   });
   test.describe("useSuspenseQuery with a nonce", () => {
     test("invalid: logs an error", async ({ page, blockRequest }) => {
-      await page.goto(
-        "http://localhost:3000/cc/dynamic/useSuspenseQuery?nonce=invalid",
-        {
-          waitUntil: "commit",
-        }
-      );
+      await page.goto("/cc/dynamic/useSuspenseQuery?nonce=invalid", {
+        waitUntil: "commit",
+      });
 
       await page.waitForEvent("console", (message) => {
         return /^Refused to execute inline script because it violates the following Content Security Policy/.test(
@@ -127,7 +118,7 @@ test.describe("CC dynamic", () => {
     });
     test("valid: does not log an error", async ({ page, blockRequest }) => {
       await page.goto(
-        "http://localhost:3000/cc/dynamic/useSuspenseQuery?nonce=8IBTHwOdqNKAWeKl7plt8g==",
+        "/cc/dynamic/useSuspenseQuery?nonce=8IBTHwOdqNKAWeKl7plt8g==",
         {
           waitUntil: "commit",
         }

integration-test/nextjs/src/app/cc/static/static.test.ts

@@ -4,7 +4,7 @@ import { test } from "../../../../fixture";
 test.describe("CC static", () => {
   test.describe("useSuspenseQuery", () => {
     test("one query", async ({ page, blockRequest, hydrationFinished }) => {
-      await page.goto("http://localhost:3000/cc/static/useSuspenseQuery", {
+      await page.goto("/cc/static/useSuspenseQuery", {
         waitUntil: "commit",
       });
 
@@ -17,12 +17,9 @@ test.describe("CC static", () => {
   test.describe("useBackgroundQuery", () => {
     // this will close the connection before the final result is received, so it can never be forwarded
     test("no `useReadQuery` on the server", async ({ page }) => {
-      await page.goto(
-        "http://localhost:3000/cc/static/useBackgroundQueryWithoutSsrReadQuery",
-        {
-          waitUntil: "commit",
-        }
-      );
+      await page.goto("/cc/static/useBackgroundQueryWithoutSsrReadQuery", {
+        waitUntil: "commit",
+      });
 
       await expect(page.getByText("rendered on server")).toBeVisible();
       await expect(page.getByText("rendered on client")).toBeVisible();

integration-test/nextjs/src/app/rsc/dynamic/apollo-client.test.ts

@@ -3,7 +3,7 @@ import { test } from "../../../../fixture";
 
 test.describe("RSC dynamic", () => {
   test("query (one query)", async ({ page, blockRequest }) => {
-    await page.goto("http://localhost:3000/rsc/dynamic/query", {
+    await page.goto("/rsc/dynamic/query", {
       waitUntil: "commit",
     });
 

integration-test/nextjs/src/app/rsc/static/apollo-client.test.ts

@@ -3,7 +3,7 @@ import { test } from "../../../../fixture";
 
 test.describe("RSC static", () => {
   test("query (one query)", async ({ page, blockRequest }) => {
-    await page.goto("http://localhost:3000/rsc/static/query", {
+    await page.goto("/rsc/static/query", {
       waitUntil: "commit",
     });
 

package.json

@@ -16,7 +16,8 @@
     "verify-package-shape": "node ./scripts/verify-package-shape.mjs",
     "matrix": "node ./scripts/test-matrix.js",
     "docs": "api-documenter markdown --input-folder temp --output-folder docs",
-    "build:libs": "yarn workspaces foreach --all --include \"@apollo/*\" run build"
+    "build:libs": "yarn workspaces foreach --all --include \"@apollo/*\" run build",
+    "build:docmodel": "yarn workspaces foreach --all --include \"@apollo/*\" exec api-extractor run"
   },
   "resolutions": {
     "[email protected]": "18.3.0-canary-60a927d04-20240113",