chore(hono): prepare @clerk/hono for initial release (#7963)

nikosdouvlis · web-flow · commit db94ac300e7f · 2026-03-03T16:54:17.000+02:00
diff --git a/.changeset/clerk-hono-initial.md b/.changeset/clerk-hono-initial.md
@@ -1,5 +1,5 @@
 ---
-'@clerk/hono': minor
+'@clerk/hono': patch
 ---
 
 Initial release of `@clerk/hono` - the official Clerk SDK for Hono.
diff --git a/.changeset/config.json b/.changeset/config.json
@@ -7,7 +7,7 @@
     }
   ],
   "commit": false,
-  "ignore": ["@clerk/hono"],
+  "ignore": [],
   "fixed": [],
   "linked": [],
   "access": "public",
diff --git a/integration/presets/hono.ts b/integration/presets/hono.ts
@@ -0,0 +1,19 @@
+import { applicationConfig } from '../models/applicationConfig';
+import { templates } from '../templates';
+import { linkPackage } from './utils';
+
+const vite = applicationConfig()
+  .setName('hono-vite')
+  .useTemplate(templates['hono-vite'])
+  .setEnvFormatter('public', key => `VITE_${key}`)
+  .addScript('setup', 'pnpm install')
+  .addScript('dev', 'pnpm dev')
+  .addScript('build', 'pnpm build')
+  .addScript('serve', 'pnpm start')
+  .addDependency('@clerk/hono', linkPackage('hono'))
+  .addDependency('@clerk/clerk-js', linkPackage('clerk-js'))
+  .addDependency('@clerk/ui', linkPackage('ui'));
+
+export const hono = {
+  vite,
+} as const;
diff --git a/integration/presets/index.ts b/integration/presets/index.ts
@@ -3,6 +3,7 @@ import { customFlows } from './custom-flows';
 import { envs, instanceKeys } from './envs';
 import { expo } from './expo';
 import { express } from './express';
+import { hono } from './hono';
 import { createLongRunningApps } from './longRunningApps';
 import { next } from './next';
 import { nuxt } from './nuxt';
@@ -15,6 +16,7 @@ export const appConfigs = {
   customFlows,
   envs,
   express,
+  hono,
   longRunningApps: createLongRunningApps(),
   next,
   react,
diff --git a/integration/presets/longRunningApps.ts b/integration/presets/longRunningApps.ts
@@ -4,6 +4,7 @@ import { astro } from './astro';
 import { envs } from './envs';
 import { expo } from './expo';
 import { express } from './express';
+import { hono } from './hono';
 import { next } from './next';
 import { nuxt } from './nuxt';
 import { react } from './react';
@@ -80,6 +81,11 @@ export const createLongRunningApps = () => {
     { id: 'nuxt.node', config: nuxt.node, env: envs.withCustomRoles },
     { id: 'react-router.node', config: reactRouter.reactRouterNode, env: envs.withEmailCodes },
     { id: 'express.vite.withEmailCodes', config: express.vite, env: envs.withEmailCodes },
+
+    /**
+     * Hono apps
+     */
+    { id: 'hono.vite.withEmailCodes', config: hono.vite, env: envs.withEmailCodes },
   ] as const;
 
   const apps = configs.map(longRunningApplication);
diff --git a/integration/templates/hono-vite/.gitignore b/integration/templates/hono-vite/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/integration/templates/hono-vite/index.html b/integration/templates/hono-vite/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + TS + Hono</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/client/main.ts"></script>
+  </body>
+</html>
diff --git a/integration/templates/hono-vite/package.json b/integration/templates/hono-vite/package.json
@@ -0,0 +1,25 @@
+{
+  "name": "hono-vite",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "build": "vite build",
+    "dev": "PORT=$PORT tsx src/server/main.ts",
+    "preview": "vite preview --port $PORT --no-open",
+    "start": "PORT=$PORT NODE_ENV=production tsx src/server/main.ts"
+  },
+  "dependencies": {
+    "@hono/node-server": "^1.14.1",
+    "dotenv": "^17.2.1",
+    "express": "^5.1.0",
+    "hono": "^4.7.10",
+    "tsx": "^4.20.3",
+    "vite-express": "^0.21.1"
+  },
+  "devDependencies": {
+    "@types/express": "^5.0.3",
+    "@types/node": "^24.2.1",
+    "typescript": "^5.8.3",
+    "vite": "^6.3.3"
+  }
+}
diff --git a/integration/templates/hono-vite/src/client/main.ts b/integration/templates/hono-vite/src/client/main.ts
@@ -0,0 +1,30 @@
+import { Clerk } from '@clerk/clerk-js';
+import { ClerkUI } from '@clerk/ui/entry';
+
+const publishableKey = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY;
+
+document.addEventListener('DOMContentLoaded', async function () {
+  const clerk = new Clerk(publishableKey);
+
+  await clerk.load({
+    ui: { ClerkUI },
+  });
+
+  if (clerk.isSignedIn) {
+    document.getElementById('app')!.innerHTML = `
+          <div id="user-button"></div>
+        `;
+
+    const userButtonDiv = document.getElementById('user-button');
+
+    clerk.mountUserButton(userButtonDiv);
+  } else {
+    document.getElementById('app')!.innerHTML = `
+          <div id="sign-in"></div>
+        `;
+
+    const signInDiv = document.getElementById('sign-in');
+
+    clerk.mountSignIn(signInDiv);
+  }
+});
diff --git a/integration/templates/hono-vite/src/client/tsconfig.json b/integration/templates/hono-vite/src/client/tsconfig.json
@@ -0,0 +1,7 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "module": "ESNext",
+    "moduleResolution": "Bundler"
+  }
+}
diff --git a/integration/templates/hono-vite/src/client/vite-env.d.ts b/integration/templates/hono-vite/src/client/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/integration/templates/hono-vite/src/server/main.ts b/integration/templates/hono-vite/src/server/main.ts
@@ -0,0 +1,36 @@
+import 'dotenv/config';
+
+import { getRequestListener } from '@hono/node-server';
+import { clerkMiddleware, getAuth } from '@clerk/hono';
+import express from 'express';
+import { Hono } from 'hono';
+import ViteExpress from 'vite-express';
+
+const app = new Hono();
+
+app.use(
+  '*',
+  clerkMiddleware({
+    publishableKey: process.env.VITE_CLERK_PUBLISHABLE_KEY,
+  }),
+);
+
+app.get('/protected', c => {
+  const { userId } = getAuth(c);
+  if (!userId) {
+    return c.text('Unauthorized', 401);
+  }
+
+  return c.text('Protected API response');
+});
+
+const expressApp = express();
+const honoRequestListener = getRequestListener(app.fetch);
+
+// Only route /api requests through hono; let vite-express handle the frontend
+expressApp.use('/api', async (req: any, res: any) => {
+  await honoRequestListener(req, res);
+});
+
+const port = parseInt(process.env.PORT as string) || 3002;
+ViteExpress.listen(expressApp, port, () => console.log(`Server is listening on port ${port}...`));
diff --git a/integration/templates/hono-vite/tsconfig.json b/integration/templates/hono-vite/tsconfig.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "useDefineForClassFields": true,
+    "module": "NodeNext",
+    "lib": ["ESNext", "DOM"],
+    "moduleResolution": "NodeNext",
+    "strict": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "noEmit": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "skipLibCheck": true
+  },
+  "include": ["src"]
+}
diff --git a/integration/templates/index.ts b/integration/templates/index.ts
@@ -12,6 +12,7 @@ export const templates = {
   'react-cra': resolve(__dirname, './react-cra'),
   'react-vite': resolve(__dirname, './react-vite'),
   'express-vite': resolve(__dirname, './express-vite'),
+  'hono-vite': resolve(__dirname, './hono-vite'),
   'elements-next': resolve(__dirname, './elements-next'),
   'astro-node': resolve(__dirname, './astro-node'),
   'astro-hybrid': resolve(__dirname, './astro-hybrid'),
diff --git a/integration/tests/hono/basic.test.ts b/integration/tests/hono/basic.test.ts
@@ -0,0 +1,53 @@
+import { expect, test } from '@playwright/test';
+
+import { appConfigs } from '../../presets';
+import type { FakeUser } from '../../testUtils';
+import { createTestUtils, testAgainstRunningApps } from '../../testUtils';
+
+testAgainstRunningApps({ withEnv: [appConfigs.envs.withEmailCodes] })('basic tests for @hono', ({ app }) => {
+  test.describe.configure({ mode: 'parallel' });
+
+  let fakeUser: FakeUser;
+
+  test.beforeAll(async () => {
+    const u = createTestUtils({ app });
+    fakeUser = u.services.users.createFakeUser();
+    await u.services.users.createBapiUser(fakeUser);
+  });
+
+  test.afterAll(async () => {
+    await fakeUser.deleteIfExists();
+
+    await app.teardown();
+  });
+
+  test('authenticates protected routes when user is signed in using getAuth()', async ({ page, context }) => {
+    const u = createTestUtils({ app, page, context });
+    await u.page.goToRelative('/');
+
+    await u.po.signIn.waitForMounted();
+    await u.po.signIn.setIdentifier(fakeUser.email);
+    await u.po.signIn.continue();
+    await u.po.signIn.setPassword(fakeUser.password);
+    await u.po.signIn.continue();
+
+    await u.po.userButton.waitForMounted();
+
+    const url = new URL('/api/protected', app.serverUrl);
+    const res = await u.page.request.get(url.toString());
+    expect(res.status()).toBe(200);
+    expect(await res.text()).toBe('Protected API response');
+  });
+
+  test('rejects protected routes when user is not authenticated using getAuth()', async ({ page, context }) => {
+    const u = createTestUtils({ app, page, context });
+    await u.page.goToRelative('/');
+
+    await u.po.signIn.waitForMounted();
+
+    const url = new URL('/api/protected', app.serverUrl);
+    const res = await u.page.request.get(url.toString());
+    expect(res.status()).toBe(401);
+    expect(await res.text()).toBe('Unauthorized');
+  });
+});
diff --git a/package.json b/package.json
@@ -51,6 +51,7 @@
     "test:integration:generic": "E2E_APP_ID=react.vite.*,next.appRouter.withEmailCodes* pnpm test:integration:base --grep @generic",
     "test:integration:handshake": "DISABLE_WEB_SECURITY=true E2E_APP_1_ENV_KEY=sessions-prod-1 E2E_SESSIONS_APP_1_HOST=multiple-apps-e2e.clerk.app pnpm test:integration:base --grep @handshake",
     "test:integration:handshake:staging": "DISABLE_WEB_SECURITY=true E2E_APP_1_ENV_KEY=clerkstage-sessions-prod-1 E2E_SESSIONS_APP_1_HOST=clerkstage-sessions-prod-1-e2e.clerk.app pnpm test:integration:base --grep @handshake",
+    "test:integration:hono": "E2E_APP_ID=hono.* pnpm test:integration:base --grep @hono",
     "test:integration:localhost": "pnpm test:integration:base --grep @localhost",
     "test:integration:machine": "pnpm test:integration:base --grep @machine",
     "test:integration:nextjs": "E2E_APP_ID=next.appRouter.* pnpm test:integration:base --grep @nextjs",
diff --git a/packages/hono/package.json b/packages/hono/package.json
@@ -51,11 +51,10 @@
       "require": {
         "types": "./dist/types.d.ts"
       }
-    }
+    },
+    "./package.json": "./package.json"
   },
   "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
   "files": [
     "dist"
   ],
diff --git a/turbo.json b/turbo.json
@@ -216,6 +216,11 @@
       "inputs": ["integration/**"],
       "outputLogs": "new-only"
     },
+    "//#test:integration:hono": {
+      "env": ["CLEANUP", "DEBUG", "E2E_*", "INTEGRATION_INSTANCE_KEYS"],
+      "inputs": ["integration/**"],
+      "outputLogs": "new-only"
+    },
     "//#test:integration:nextjs": {
       "env": ["CLEANUP", "DEBUG", "E2E_*", "INTEGRATION_INSTANCE_KEYS"],
       "inputs": ["integration/**"],

Original file line number	Diff line number	Diff line change
`@@ -7,7 +7,7 @@`
`7`	`7`	`}`
`8`	`8`	`],`
`9`	`9`	`"commit": false,`
`10`		`- "ignore": ["@clerk/hono"],`
	`10`	`+ "ignore": [],`
`11`	`11`	`"fixed": [],`
`12`	`12`	`"linked": [],`
`13`	`13`	`"access": "public",`