Skip to main content

Chrome Extension JavaScript SDK support

Category
SDK
Published

The Chrome Extension SDK now supports vanilla JavaScript with createClerkClient(), and deprecates the /background import path.

The @clerk/chrome-extension SDK now fully supports vanilla JavaScript (non-React) usage through createClerkClient() imported from @clerk/chrome-extension/client. A new Chrome Extension JS Quickstart guide is available to help you get started.

createClerkClient() for vanilla JS

Use createClerkClient() from @clerk/chrome-extension/client to initialize Clerk in a popup or side panel without React:

src/popup.ts
import { createClerkClient } from '@clerk/chrome-extension/client'

const clerk = createClerkClient({
  publishableKey: process.env.CLERK_PUBLISHABLE_KEY,
})

await clerk.load({
  allowedRedirectProtocols: ['chrome-extension:'],
})

background option for createClerkClient()

Whether you're using React or vanilla JS, createClerkClient() from @clerk/chrome-extension/client now accepts a background: true option for use in background service workers. This replaces the separate @clerk/chrome-extension/background import.

src/background/index.ts
import { createClerkClient } from '@clerk/chrome-extension/client'

async function getToken() {
  const clerk = await createClerkClient({
    publishableKey: process.env.CLERK_PUBLISHABLE_KEY,
    background: true,
  })

  if (!clerk.session) {
    return null
  }

  return await clerk.session?.getToken()
}

Deprecation: @clerk/chrome-extension/background

Importing createClerkClient from @clerk/chrome-extension/background is now deprecated. Both React and vanilla JS extensions should update to import from @clerk/chrome-extension/client with the background: true option instead.

Contributor
Roy Anger

Share this article