.github/workflows/ci.yml

@@ -171,7 +171,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        test-name: [ 'generic', 'express', 'quickstart', 'ap-flows', 'elements', 'sessions', 'astro', 'expo-web', 'tanstack-start', 'tanstack-router', 'vue', 'nuxt', 'react-router']
+        test-name: [ 'generic', 'express', 'quickstart', 'ap-flows', 'elements', 'localhost', 'sessions', 'astro', 'expo-web', 'tanstack-start', 'tanstack-router', 'vue', 'nuxt', 'react-router']
         test-project: ['chrome']
         include:
           - test-name: 'nextjs'

.github/workflows/release-canary.yml

@@ -62,16 +62,13 @@ jobs:
             const clerkjsVersion = require('./packages/clerk-js/package.json').version;
             const nextjsVersion = require('./packages/nextjs/package.json').version;
 
-            if (clerkjsVersion.includes('canary')) {
-              console.log('clerk-js changed, will notify clerk/cloudflare-workers');
               github.rest.actions.createWorkflowDispatch({
                 owner: 'clerk',
-                repo: 'cloudflare-workers',
-                workflow_id: 'release-canary-clerkjs-proxy.yml',
+                repo: 'sdk-infra-workers',
+                workflow_id: 'update-clerkjs.yml',
                 ref: 'main',
                 inputs: { version: clerkjsVersion }
               })
-            }
 
             if (nextjsVersion.includes('canary')) {
               console.log('clerk/nextjs changed, will notify clerk/accounts');

.github/workflows/release.yml

@@ -82,8 +82,8 @@ jobs:
 
               github.rest.actions.createWorkflowDispatch({
                 owner: 'clerk',
-                repo: 'cloudflare-workers',
-                workflow_id: 'prepare-prod-clerkjs-proxy-pr.yml',
+                repo: 'sdk-infra-workers',
+                workflow_id: 'update-clerkjs.yml',
                 ref: 'main',
                 inputs: { version: clerkjsVersion }
               })

.gitignore

@@ -97,4 +97,5 @@ scripts/.env
 !scripts/.env.example
 
 # typedoc
-.typedoc
+.typedoc/docs
+.typedoc/docs.json

.lintstagedrc.json

@@ -1,4 +1,4 @@
 {
-  "*.{mjs,js,jsx,ts,tsx,vue}": ["pnpm eslint --fix", "pnpm prettier --write"],
+  "*.{mjs,js,jsx,ts,tsx,vue}": ["pnpm prettier --write"],
   "*.{json,md,mdx}": ["pnpm prettier --write"]
 }

.typedoc/custom-plugin.mjs

@@ -0,0 +1,29 @@
+// @ts-check
+import { MarkdownRendererEvent } from 'typedoc-plugin-markdown';
+
+/**
+ * @param {string} str
+ */
+function toKebabCase(str) {
+  return str.replace(/((?<=[a-z\d])[A-Z]|(?<=[A-Z\d])[A-Z](?=[a-z]))/g, '-$1').toLowerCase();
+}
+
+/**
+ * @param {import('typedoc-plugin-markdown').MarkdownApplication} app
+ */
+export function load(app) {
+  app.renderer.on(MarkdownRendererEvent.BEGIN, output => {
+    // Do not output README.mdx files
+    output.urls = output.urls
+      ?.filter(e => !e.url.endsWith('README.mdx'))
+      .map(e => {
+        // Convert URLs (by default camelCase) to kebab-case
+        const kebabUrl = toKebabCase(e.url);
+
+        e.url = kebabUrl;
+        e.model.url = kebabUrl;
+
+        return e;
+      });
+  });
+}

.typedoc/custom-theme.mjs

@@ -0,0 +1,261 @@
+// @ts-check
+import { ReflectionKind } from 'typedoc';
+import { MarkdownTheme, MarkdownThemeContext } from 'typedoc-plugin-markdown';
+
+/**
+ * @param {import('typedoc-plugin-markdown').MarkdownApplication} app
+ */
+export function load(app) {
+  app.renderer.defineTheme('clerkTheme', ClerkMarkdownTheme);
+}
+
+class ClerkMarkdownTheme extends MarkdownTheme {
+  /**
+   * @param {import('typedoc-plugin-markdown').MarkdownPageEvent} page
+   */
+  getRenderContext(page) {
+    return new ClerkMarkdownThemeContext(this, page, this.application.options);
+  }
+}
+
+/**
+ * Our custom Clerk theme
+ * @extends MarkdownThemeContext
+ */
+class ClerkMarkdownThemeContext extends MarkdownThemeContext {
+  /**
+   * @param {MarkdownTheme} theme
+   * @param {import('typedoc-plugin-markdown').MarkdownPageEvent} page
+   * @param {MarkdownTheme["application"]["options"]} options
+   */
+  constructor(theme, page, options) {
+    super(theme, page, options);
+
+    const superPartials = this.partials;
+
+    this.partials = {
+      ...superPartials,
+      /**
+       * Copied from default theme / source code. This hides the return type from the output
+       * https://github.com/typedoc2md/typedoc-plugin-markdown/blob/179a54c502b318cd4f3951e5e8b90f7f7a4752d8/packages/typedoc-plugin-markdown/src/theme/context/partials/member.signatureReturns.ts
+       * @param {import('typedoc').SignatureReflection} model
+       * @param {{ headingLevel: number }} options
+       */
+      signatureReturns: (model, options) => {
+        const md = [];
+
+        /**
+         * @type any
+         */
+        const modelType = model.type;
+        /**
+         * @type {import('typedoc').DeclarationReflection}
+         */
+        const typeDeclaration = modelType?.declaration;
+
+        md.push(heading(options.headingLevel, this.i18n.theme_returns()));
+
+        if (model.comment?.blockTags.length) {
+          const tags = model.comment.blockTags
+            .filter(tag => tag.tag === '@returns')
+            .map(tag => this.helpers.getCommentParts(tag.content));
+          md.push(tags.join('\n\n'));
+        }
+
+        if (typeDeclaration?.signatures) {
+          typeDeclaration.signatures.forEach(signature => {
+            md.push(
+              this.partials.signature(signature, {
+                headingLevel: options.headingLevel + 1,
+                nested: true,
+              }),
+            );
+          });
+        }
+
+        if (typeDeclaration?.children) {
+          md.push(
+            this.partials.typeDeclaration(typeDeclaration, {
+              headingLevel: options.headingLevel,
+            }),
+          );
+        }
+
+        return md.join('\n\n');
+      },
+      /**
+       * Copied from default theme / source code. This hides the "Type parameters" section and the signature title from the output
+       * https://github.com/typedoc2md/typedoc-plugin-markdown/blob/179a54c502b318cd4f3951e5e8b90f7f7a4752d8/packages/typedoc-plugin-markdown/src/theme/context/partials/member.signature.ts
+       * @param {import('typedoc').SignatureReflection} model
+       * @param {{ headingLevel: number, nested?: boolean, accessor?: string, multipleSignatures?: boolean }} options
+       */
+      signature: (model, options) => {
+        const md = [];
+
+        if (!options.nested && model.sources && !this.options.getValue('disableSources')) {
+          md.push(this.partials.sources(model));
+        }
+
+        let modelComments = options.multipleSignatures ? model.comment : model.comment || model.parent?.comment;
+
+        if (modelComments && model.parent?.comment?.summary && !options.multipleSignatures) {
+          modelComments = Object.assign(modelComments, {
+            summary: model.parent.comment.summary,
+          });
+        }
+
+        if (modelComments && model.parent?.comment?.blockTags) {
+          modelComments.blockTags = [...(model.parent?.comment?.blockTags || []), ...(model.comment?.blockTags || [])];
+        }
+
+        if (modelComments) {
+          md.push(
+            this.partials.comment(modelComments, {
+              headingLevel: options.headingLevel,
+              showTags: false,
+              showSummary: true,
+            }),
+          );
+        }
+
+        if (!options.multipleSignatures && model.parent?.documents) {
+          md.push(
+            this.partials.documents(model?.parent, {
+              headingLevel: options.headingLevel,
+            }),
+          );
+        }
+
+        if (model.parameters?.length) {
+          md.push(heading(options.headingLevel, this.internationalization.kindPluralString(ReflectionKind.Parameter)));
+          if (this.helpers.useTableFormat('parameters')) {
+            md.push(this.partials.parametersTable(model.parameters));
+          } else {
+            md.push(
+              this.partials.parametersList(model.parameters, {
+                headingLevel: options.headingLevel,
+              }),
+            );
+          }
+        }
+
+        if (model.type) {
+          md.push(
+            this.partials.signatureReturns(model, {
+              headingLevel: options.headingLevel,
+            }),
+          );
+        }
+
+        if (modelComments) {
+          md.push(
+            this.partials.comment(modelComments, {
+              headingLevel: options.headingLevel,
+              showTags: true,
+              showSummary: false,
+            }),
+          );
+        }
+
+        md.push(this.partials.inheritance(model, { headingLevel: options.headingLevel }));
+
+        return md.join('\n\n');
+      },
+      /**
+       * Copied from default theme / source code. This hides the "Type parameters" section from the output
+       * https://github.com/typedoc2md/typedoc-plugin-markdown/blob/179a54c502b318cd4f3951e5e8b90f7f7a4752d8/packages/typedoc-plugin-markdown/src/theme/context/partials/member.memberWithGroups.ts#L58
+       * @param {import('typedoc').DeclarationReflection} model
+       * @param {{ headingLevel: number }} options
+       */
+      memberWithGroups: (model, options) => {
+        const md = [];
+
+        if (
+          ![ReflectionKind.Module, ReflectionKind.Namespace].includes(model.kind) &&
+          model.sources &&
+          !this.options.getValue('disableSources')
+        ) {
+          md.push(this.partials.sources(model));
+        }
+
+        if (model.comment) {
+          md.push(
+            this.partials.comment(model.comment, {
+              headingLevel: options.headingLevel,
+            }),
+          );
+        }
+
+        if (model.typeHierarchy?.next) {
+          md.push(
+            this.partials.hierarchy(model.typeHierarchy, {
+              headingLevel: options.headingLevel,
+            }),
+          );
+        }
+
+        if (model.implementedTypes?.length) {
+          md.push(heading(options.headingLevel, this.i18n.theme_implements()));
+          md.push(
+            unorderedList(model.implementedTypes.map(implementedType => this.partials.someType(implementedType))),
+          );
+        }
+
+        if (model.kind === ReflectionKind.Class && model.categories?.length) {
+          model.groups
+            ?.filter(group => group.title === this.i18n.kind_plural_constructor())
+            .forEach(group => {
+              md.push(heading(options.headingLevel, this.i18n.kind_plural_constructor()));
+              group.children.forEach(child => {
+                md.push(
+                  this.partials.constructor(/** @type {import('typedoc').DeclarationReflection} */ (child), {
+                    headingLevel: options.headingLevel + 1,
+                  }),
+                );
+              });
+            });
+        }
+
+        if ('signatures' in model && model.signatures?.length) {
+          model.signatures.forEach(signature => {
+            md.push(
+              this.partials.signature(signature, {
+                headingLevel: options.headingLevel,
+              }),
+            );
+          });
+        }
+
+        if (model.indexSignatures?.length) {
+          md.push(heading(options.headingLevel, this.i18n.theme_indexable()));
+          model.indexSignatures.forEach(indexSignature => {
+            md.push(this.partials.indexSignature(indexSignature));
+          });
+        }
+
+        md.push(this.partials.body(model, { headingLevel: options.headingLevel }));
+
+        return md.join('\n\n');
+      },
+    };
+  }
+}
+
+/**
+ * Returns a heading in markdown format
+ * @param {number} level The level of the heading
+ * @param {string} text The text of the heading
+ */
+function heading(level, text) {
+  level = level > 6 ? 6 : level;
+  return `${[...Array(level)].map(() => '#').join('')} ${text}`;
+}
+
+/**
+ * Create an unordered list from an array of items
+ * @param {string[]} items
+ * @returns
+ */
+function unorderedList(items) {
+  return items.map(item => `- ${item}`).join('\n');
+}

.typedoc/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "allowJs": true,
+    "noEmit": true,
+    "moduleResolution": "node16",
+    "module": "Node16"
+  }
+}

integration/playwright.config.ts

@@ -38,7 +38,14 @@ export default defineConfig({
     },
     {
       name: 'chrome',
-      use: { ...devices['Desktop Chrome'], channel: 'chrome' },
+      use: {
+        ...devices['Desktop Chrome'],
+        channel: 'chrome',
+        launchOptions: {
+          args: [process.env.DISABLE_WEB_SECURITY ? '--disable-web-security' : ''],
+        },
+      },
+
       dependencies: ['setup'],
     },
     // {

integration/scripts/proxyServer.ts

@@ -19,6 +19,9 @@ export const createProxyServer = (opts: ProxyServerOptions) => {
   const createServer: typeof _createServer = usingSSL ? https.createServer.bind(https) : http.createServer.bind(http);
 
   return createServer(opts.ssl, (req, res) => {
+    console.log(`/n/n/n/n------------------------------------`);
+    console.log('Proxying request', req.headers.host, req.url);
+    console.log('Headers', req.headers);
     const hostHeader = req.headers.host || '';
     if (opts.targets[hostHeader]) {
       proxy.web(req, res, { target: opts.targets[hostHeader] });

integration/templates/next-app-router/src/app/page.tsx

@@ -17,6 +17,7 @@ export default function Home() {
       <ul>
         <li>
           <Link href='/page-protected'>Page Protected</Link>
+          <Link href='/protected'>Protected</Link>
         </li>
       </ul>
     </main>

integration/templates/next-app-router/src/app/protected/page.tsx

@@ -1,3 +1,10 @@
+import Link from 'next/link';
+
 export default function Page() {
-  return <div>Protected</div>;
+  return (
+    <>
+      <div data-testid='protected'>Protected</div>
+      <Link href='/'>Home</Link>
+    </>
+  );
 }