Clerk Changelog

Cognito password migrator

Category
Migration
Published

Seamlessly migrate AWS Cognito user passwords into Clerk

We’re excited to share with you the release of our Cognito password migrator! Existing AWS Cognito customers can now migrate their users into Clerk, and their users will be able to sign in to Clerk with their prior cognito passwords — No password reset flow required.

Visit our guide to learn more about how to use the Cognito password migrator.

Contributor
Kevin Wang

Development Mode UI Changes

Category
Product
Published

Clerk's development instances are great for getting started with Clerk, making local development smooth and simple, and testing out features. However, we have seen many users go to production using their development instance by accident - your app looks exactly the same, and works similarly enough that most wouldn't notice the difference. But if this does happen, it turns into a substantial issue.

Development instances have a more relaxed security posture, are not indexed by search engines, use shared OAuth credentials for social providers by default, and lack custom domain support. In addition, development instances are capped at 100 users, 20 SMS messages, and have "development" prefixes on SMS and email messages, which quickly becomes a large problem if accidentally taken to production. Especially so if the user or SMS limits are hit, which can stop your app from being able to sign up or log in users - certainly not something you want to happen in production 😰. And on top of that, you then need to go through a process of migrating users from your development to your production instance to fix it, which can be challenging and time consuming.

In order to combat this common issue, we made some modifications to the design Clerk's UI components in a specific effort to make it more clear that you're using a development instance. Our hope is that, with these changes, nodoby ends up taking a development instance to production by accident anymore. You can see an example of the change on the <SignIn> component here:

Clerk's SignIn component in development mode

If you need to deactivate this UI change temporarily to simulate how components will look in production, you can do so by adding the unsafe_disableDevelopmentModeWarnings layout appearance prop to <ClerkProvider> as such:

<ClerkProvider
  appearance={{
    layout: {
      unsafe_disableDevelopmentModeWarnings: true,
    },
  }}
/>

It should be noted that this UI change initially will only apply to newly created Clerk applications. If you have an existing application, you won't see this UI change. We will be rolling out a way for existing applications to enable this feature in the coming weeks.

Contributor
Vaggelis Yfantis

Notice: Plans to EOL Gatsby SDK

Category
SDK
Published

Initiating transition period for Clerk's official Gatsby SDK

As of today August 1st, 2024 we are announcing a notice period for our Gatsby SDK that will complete on September 1st, 2024.

📣 During this period we are actively seeking a new community maintainer

In addition to seeking a new home, during this period we intend to:

  • Continue to provide critical patches and bug fixes
  • Pause adding new features to the Gatsby SDK unless contributed by community members
  • Migrate the Gatsby SDK from our clerk/javascript monorepo into a separate repository for easier community contributions

If community maintainers are not found, the Gatsby SDK will be marked as archived.

We've valued the partnership with the Gatsby community and we encourage interested developers to please reach out!

Contributor
Clerk

Clerk Expo v2

Category
SDK
Published

Introducing Clerk Expo SDK v2 with support for Expo Web

We are excited to announce that we have released @clerk/clerk-expo v2 with support for Expo Web! This means that you can create universal apps that run on Android, iOS, and the web all with a single codebase!

Getting started

If you haven't already created an Expo app with Clerk you can follow the Expo quickstart guide.

Otherwise, you can update your existing Expo app to the latest version of @clerk/clerk-expo by following the upgrade guide.

Use Clerk's prebuilt components on the web

Adding a sign-in page to your web app is now as easy as adding a single component:

/app/sign-in.web.tsx
import { SignIn } from '@clerk/clerk-expo/web'

export default function Page() {
  return <SignIn />
}

Build universal authentication flows from one codebase

Leverage our hooks to build universal sign-in and sign-up views for Android, iOS, and web all from one codebase 🤯.

Here's an example of a OAuth sign-in flow, using the SDK's useOAuth hook:

/app/sign-in-oauth.tsx
import React from 'react'
import * as WebBrowser from 'expo-web-browser'
import { Text, View, Button } from 'react-native'
import { Link } from 'expo-router'
import { useOAuth } from '@clerk/clerk-expo'
import * as Linking from 'expo-linking'

export const useWarmUpBrowser = () => {
  React.useEffect(() => {
    void WebBrowser.warmUpAsync()
    return () => {
      void WebBrowser.coolDownAsync()
    }
  }, [])
}

const SignInWithOAuth = () => {
  useWarmUpBrowser()

  const { startOAuthFlow } = useOAuth({ strategy: 'oauth_google' })

  const onPress = React.useCallback(async () => {
    try {
      const { createdSessionId, signIn, signUp, setActive } = await startOAuthFlow({
        redirectUrl: Linking.createURL('/'),
      })

      if (createdSessionId) {
        setActive!({ session: createdSessionId })
      } else {
        // Use signIn or signUp for next steps such as MFA
      }
    } catch (err) {
      console.error('OAuth error', err)
    }
  }, [])

  return (
    <View>
      <Link href="/">
        <Text>Home</Text>
      </Link>
      <Button title="Sign in with Google" onPress={onPress} />
    </View>
  )
}
export default SignInWithOAuth

Want to learn more about using Clerk with Expo? Check out @clerk/clerk-expo.

Excited specifically about Expo Web? Check out our Expo Web support guide.

Contributor
Vaggelis Yfantis

Passkeys are now Generally Available

Category
GA
Published

Passkeys are now generally available for all Clerk users

After a thorough beta period, we're excited to announce that Passkeys are now generally available for all Clerk users. Passkeys are a simple-to-use and secure passwordless way to authenticate your users.

Passkeys are available as part of the Pro plan. Head to the Clerk Dashboard to activate Passkeys for your users or read through the Passkeys documentation to get started.

Contributors
Mary Zhong
Pantelis Eleftheriadis

Improved support for Cypress testing

Category
E2E
Published

Enhanced end-to-end testing with Clerk using Cypress

We are thrilled to announce significant enhancements to our @clerk/testing package, making it easier to use Cypress with Clerk!

@clerk/testing@1.2.0 includes the following improvements:

  • Full browser support: We have resolved existing issues with Cypress and now support all Cypress-supported browsers, including Chrome, Electron, and Firefox.
  • Testing Tokens: The testing tokens mechanism that was introduced in the Playwright integration is now available in Cypress as well. This feature allows you to bypass bot detection mechanisms effortlessly, eliminating frustrating "Bot traffic detected" errors and enabling uninterrupted testing workflows.
  • Cypress Custom Commands: We've added custom Clerk commands that you can use inside your tests. These commands, like cy.clerkSignIn() and cy.clerkSignOut(), make it easy to handle sign-in and sign-out actions within your tests without interacting with the UI.

To learn more and get detailed setup instructions, visit our Cypress documentation.

Contributor
Stefanos Anagnostou