fix(clerk-js): If password is enabled, instanceIsPasswordBased is true

The Clerk Dashboard now has improved support for enabling an instance
configuration with password enabled, but not required. Such a
configuration makes passwords optional on sign-up, allows users to add
them to accounts, and allows users to use them for sign-in. Previously,
passwords were both enabled and required together.

If the instance is configured with password enabled but not required,
the SDK should still treat the instance as password based. Modify
`UserSettings.instanceIsPasswordBased` to return true in this
configuration. This (a) makes sure that the password card is displayed
on the SecurityPage so that users can modify their passwords, and (b)
allows instant password sign in.

Fixes USER-3245. Tested with unit testing and with local Clerk.

Revised and simplified version of
#6592 which modifies
`UserSettings.instanceIsPasswordBased` instead of adding a new property.

Author: dmoerner

.changeset/khaki-ravens-cheer.md

@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-js': patch
+---
+
+Update `UserSettings.instanceIsPasswordBased` to return true if password is enabled but not required.

packages/clerk-js/src/core/resources/UserSettings.ts

@@ -191,7 +191,7 @@ export class UserSettings extends BaseResource implements UserSettingsResource {
   }
 
   get instanceIsPasswordBased() {
-    return Boolean(this.attributes?.password?.enabled && this.attributes.password?.required);
+    return Boolean(this.attributes?.password?.enabled);
   }
 
   get hasValidAuthFactor() {

packages/clerk-js/src/core/resources/__tests__/UserSettings.spec.ts

@@ -75,6 +75,18 @@ describe('UserSettings', () => {
         },
       },
     } as any as UserSettingsJSON);
+
+    expect(sut.instanceIsPasswordBased).toEqual(true);
+
+    sut = new UserSettings({
+      attributes: {
+        password: {
+          enabled: false,
+          required: false,
+        },
+      },
+    } as any as UserSettingsJSON);
+
     expect(sut.instanceIsPasswordBased).toEqual(false);
   });
 

packages/clerk-js/src/ui/components/SignIn/__tests__/SignInStart.test.tsx

@@ -437,7 +437,7 @@ describe('SignInStart', () => {
       it(`calls sign in with identifier again with only the email if the api respondes with the error ${code}`, async () => {
         const { wrapper, fixtures } = await createFixtures(f => {
           f.withEmailAddress();
-          f.withPassword({ required: true });
+          f.withPassword();
         });
 
         const errJSON = {

packages/clerk-js/src/ui/components/UserProfile/__tests__/SecurityPage.test.tsx

@@ -32,9 +32,7 @@ describe('SecurityPage', () => {
 
   it('renders the Password section if instance is password based', async () => {
     const { wrapper, fixtures } = await createFixtures(f => {
-      f.withPassword({
-        required: true,
-      });
+      f.withPassword();
       f.withUser({ email_addresses: ['[email protected]'] });
     });
     fixtures.clerk.user?.getSessions.mockReturnValue(Promise.resolve([]));