snapshot of https://github.com/ory/kratos.git (master, 2026-09-15; blobs > 131072B omitted)

test/e2e/cypress/integration/profiles/mfa/code.spec.ts

@@ -0,0 +1,157 @@
+// Copyright © 2023 Ory Corp
+// SPDX-License-Identifier: Apache-2.0
+
+import { appPrefix, gen, website } from "../../../helpers"
+import { routes as express } from "../../../helpers/express"
+
+context("2FA code", () => {
+  ;[
+    // {
+    //   login: react.login,
+    //   settings: react.settings,
+    //   base: react.base,
+    //   app: "react" as "react",
+    //   profile: "spa",
+    // },
+    {
+      login: express.login,
+      settings: express.settings,
+      base: express.base,
+      app: "express" as "express",
+      profile: "mfa",
+    },
+  ].forEach(({ settings, login, profile, app, base }) => {
+    describe(`for app ${app}`, () => {
+      before(() => {
+        cy.useConfigProfile(profile)
+        cy.proxy(app)
+      })
+
+      let email: string
+      let password: string
+
+      describe("when using highest_available aal", () => {
+        beforeEach(() => {
+          cy.useConfig((builder) =>
+            builder
+              .longPrivilegedSessionTime()
+              .useHighestAvailable()
+              .enableCodeMFA(),
+          )
+        })
+
+        // playwright:migrated
+        it("should show second factor screen on whoami call", () => {
+          email = gen.email()
+          password = gen.password()
+          cy.register({
+            email,
+            password,
+            fields: { "traits.website": website },
+          })
+          cy.deleteMail()
+
+          cy.visit(settings)
+          cy.location("pathname").should("contain", "/login") // we get redirected to login
+
+          cy.getLoginCodeFromEmail(email).then((code) => {
+            cy.get("input[name='code']").type(code)
+            cy.contains("Continue").click()
+          })
+
+          cy.getSession({
+            expectAal: "aal2",
+            expectMethods: ["password", "code"],
+          })
+        })
+      })
+
+      describe("when using aal1 required aal", () => {
+        beforeEach(() => {
+          email = gen.email()
+          password = gen.password()
+          cy.useConfig((builder) =>
+            builder
+              .longPrivilegedSessionTime()
+              .useLaxAal()
+              .enableCode()
+              .enableCodeMFA(),
+          )
+
+          cy.register({
+            email,
+            password,
+            fields: { "traits.website": website },
+          })
+          cy.deleteMail()
+          cy.visit(login + "?aal=aal2&via=email")
+        })
+
+        it("should be asked to sign in with 2fa if set up", () => {
+          cy.get("input[name='code']").should("be.visible")
+          cy.getLoginCodeFromEmail(email).then((code) => {
+            cy.get("input[name='code']").type(code)
+            cy.contains("Continue").click()
+          })
+
+          cy.getSession({
+            expectAal: "aal2",
+            expectMethods: ["password", "code"],
+          })
+        })
+
+        it("can't use different email in 2fa request", () => {
+          // Setting up another 2fa method to prevent fast-login to happen
+          cy.visit(base)
+          cy.clearAllCookies()
+          cy.useConfig((builder) => builder.disableCodeMfa())
+          cy.login({ email, password, cookieUrl: base })
+          cy.longPrivilegedSessionTime()
+          cy.visit(settings)
+          cy.get(
+            appPrefix(app) + 'button[name="lookup_secret_regenerate"]',
+          ).click()
+          cy.get('button[name="lookup_secret_confirm"]').click()
+          cy.expectSettingsSaved()
+          cy.visit(settings)
+          cy.clearAllCookies()
+          cy.useConfig((builder) => builder.enableCodeMFA())
+          cy.login({ email: email, password: password, cookieUrl: base })
+
+          cy.visit(login + "?aal=aal2")
+          cy.get('[name="method"][value="lookup_secret"]').should("exist")
+          cy.get('[name="address"]').should("exist")
+
+          cy.get('[name="address"]').invoke("attr", "value", gen.email())
+
+          cy.get('[name="address"]').click()
+
+          cy.get("*[data-testid='ui/message/4000035']").should("be.visible")
+          cy.get("input[name='code']").should("not.exist")
+          cy.get("[name='address']").should("be.visible")
+
+          // The current session should be unchanged
+          cy.getSession({
+            expectAal: "aal1",
+            expectMethods: ["password"],
+          })
+        })
+
+        it("entering wrong code should not invalidate correct codes", () => {
+          cy.get("input[name='code']").should("be.visible").type("123456")
+
+          cy.contains("Continue").click()
+          cy.getLoginCodeFromEmail(email).then((code) => {
+            cy.get("input[name='code']").type(code)
+            cy.contains("Continue").click()
+          })
+
+          cy.getSession({
+            expectAal: "aal2",
+            expectMethods: ["password", "code"],
+          })
+        })
+      })
+    })
+  })
+})

test/e2e/cypress/integration/profiles/mfa/code_optional.spec.ts

@@ -0,0 +1,213 @@
+// Copyright © 2023 Ory Corp
+// SPDX-License-Identifier: Apache-2.0
+
+import { gen } from "../../../helpers"
+import { routes as express } from "../../../helpers/express"
+
+context("2FA code with optional field", () => {
+  ;[
+    {
+      login: express.login,
+      settings: express.settings,
+      base: express.base,
+      app: "express" as "express",
+      profile: "mfa-optional",
+    },
+  ].forEach(({ settings, login, profile, app, base }) => {
+    describe(`for app ${app}`, () => {
+      before(() => {
+        cy.useConfigProfile(profile)
+        cy.proxy(app)
+      })
+
+      describe("when using highest_available aal with empty optionalMfaEmail field", () => {
+        let email: string
+        let password: string
+
+        beforeEach(() => {
+          email = gen.email()
+          password = gen.password()
+
+          // Configure system to use highest available AAL
+          cy.useConfig((builder) =>
+            builder.longPrivilegedSessionTime().useHighestAvailable(),
+          )
+
+          // Register a user without setting up code MFA (empty optionalMfaEmail field)
+          cy.register({
+            email,
+            password,
+            fields: { "traits.optionalMfaEmail": "" },
+          })
+          cy.deleteMail()
+        })
+
+        // playwright:migrated
+        it("should not show 2FA page during login when optionalMfaEmail field is empty", () => {
+          // Log out first
+          cy.clearAllCookies()
+
+          // Login with the user
+          cy.visit(login)
+          cy.get('input[name="identifier"]').type(email)
+          cy.get('input[name="password"]').type(password)
+          cy.get('button[name="method"][value="password"]').click()
+
+          // Should be logged in directly without 2FA page
+          cy.getSession({
+            expectAal: "aal1",
+            expectMethods: ["password"],
+          })
+
+          // Verify we're not asked for 2FA when visiting settings
+          cy.visit(settings)
+          cy.location("pathname").should("contain", "/settings")
+          cy.get('input[name="traits.email"]').should("contain.value", email)
+        })
+      })
+
+      describe("when using highest_available aal with configured optionalMfaEmail field", () => {
+        let email: string
+        let mfaEmail: string
+        let password: string
+
+        beforeEach(() => {
+          email = gen.email()
+          mfaEmail = gen.email()
+          password = gen.password()
+
+          // Configure system to use highest available AAL
+          cy.useConfig((builder) =>
+            builder.longPrivilegedSessionTime().useHighestAvailable(),
+          )
+
+          // Register a user with optionalMfaEmail field set
+          cy.register({
+            email,
+            password,
+            fields: { "traits.optionalMfaEmail": mfaEmail },
+          })
+          cy.deleteMail()
+        })
+
+        // playwright:migrated
+        it("should show 2FA page during login when optionalMfaEmail field is configured", () => {
+          // Log out first
+          cy.clearAllCookies()
+
+          // Login with the user
+          cy.visit(login)
+          cy.get('input[name="identifier"]').type(email)
+          cy.get('input[name="password"]').type(password)
+          cy.get('button[name="method"][value="password"]').click()
+
+          // Should see the code input field
+          cy.location("pathname").should("contain", "/login")
+          cy.get("input[name='code']").should("be.visible")
+
+          // Get the code from email and enter it
+          cy.getLoginCodeFromEmail(mfaEmail).then((code) => {
+            cy.get("input[name='code']").type(code)
+            cy.contains("Continue").click()
+          })
+
+          // Should be logged in with AAL2
+          cy.getSession({
+            expectAal: "aal2",
+            expectMethods: ["password", "code"],
+          })
+        })
+
+        it("should require 2FA for settings flow when optionalMfaEmail field is configured", () => {
+          // Log out first
+          cy.clearAllCookies()
+
+          // Try to access settings directly
+          cy.visit(settings)
+
+          // Should be redirected to login
+          cy.location("pathname").should("contain", "/login")
+
+          // Login with password
+          cy.get('input[name="identifier"]').type(email)
+          cy.get('input[name="password"]').type(password)
+          cy.get('button[name="method"][value="password"]').click()
+
+          // Should see the code input field
+          cy.location("pathname").should("contain", "/login")
+          cy.get("input[name='code']").should("be.visible")
+
+          // Get the code from email and enter it
+          cy.getLoginCodeFromEmail(mfaEmail).then((code) => {
+            cy.get("input[name='code']").type(code)
+            cy.contains("Continue").click()
+          })
+
+          // Go the the settings page again
+          cy.visit(settings)
+
+          // Should now be at settings with AAL2
+          cy.location("pathname").should("contain", "/settings")
+          cy.getSession({
+            expectAal: "aal2",
+            expectMethods: ["password", "code"],
+          })
+        })
+      })
+
+      describe("when user with configured optionalMfaEmail logs in with aal1 session", () => {
+        let email: string
+        let mfaEmail: string
+        let password: string
+
+        beforeEach(() => {
+          email = gen.email()
+          mfaEmail = gen.email()
+          password = gen.password()
+
+          // Configure system to allow aal1 login but still require highest_available for settings
+          cy.useConfig((builder) =>
+            builder
+              .longPrivilegedSessionTime()
+              .useLaxSessionAal()
+              .useHighestSettingsFlowAal(),
+          )
+
+          // Register a user with optionalMfaEmail field set
+          cy.register({
+            email,
+            password,
+            fields: { "traits.optionalMfaEmail": mfaEmail },
+          })
+          cy.deleteMail()
+        })
+
+        it("should not allow access to settings page with aal1 session", () => {
+          // Log out first
+          cy.clearAllCookies()
+
+          // Login with just password (aal1)
+          cy.visit(login)
+          cy.get('input[name="identifier"]').type(email)
+          cy.get('input[name="password"]').type(password)
+          cy.get('button[name="method"][value="password"]').click()
+
+          // Verify we have an aal1 session
+          cy.getSession({
+            expectAal: "aal1",
+            expectMethods: ["password"],
+          })
+
+          // Try to access settings page
+          cy.visit(settings)
+
+          // Should be redirected to login for 2FA
+          cy.location("pathname").should("contain", "/login")
+
+          // Verify we're being asked for 2FA code input
+          cy.get("input[name='code']").should("be.visible")
+        })
+      })
+    })
+  })
+})

test/e2e/cypress/integration/profiles/mfa/lookup.spec.ts

@@ -0,0 +1,305 @@
+// Copyright © 2023 Ory Corp
+// SPDX-License-Identifier: Apache-2.0
+
+import { appPrefix, gen, website } from "../../../helpers"
+import { routes as express } from "../../../helpers/express"
+import { routes as react } from "../../../helpers/react"
+
+context("2FA lookup secrets", () => {
+  ;[
+    {
+      login: react.login,
+      settings: react.settings,
+      base: react.base,
+      app: "react" as "react",
+      profile: "spa",
+    },
+    {
+      login: express.login,
+      settings: express.settings,
+      base: express.base,
+      app: "express" as "express",
+      profile: "mfa",
+    },
+  ].forEach(({ settings, login, profile, app, base }) => {
+    describe(`for app ${app}`, () => {
+      before(() => {
+        cy.useConfigProfile(profile)
+        cy.proxy(app)
+      })
+
+      let email = gen.email()
+      let password = gen.password()
+
+      beforeEach(() => {
+        cy.visit(base)
+        cy.clearAllCookies()
+        cy.useConfig((builder) => builder.disableCodeMfa())
+        email = gen.email()
+        password = gen.password()
+        cy.registerApi({
+          email,
+          password,
+          fields: { "traits.website": website },
+        })
+        cy.login({ email, password, cookieUrl: base })
+
+        cy.longPrivilegedSessionTime()
+        cy.sessionRequiresNo2fa()
+      })
+
+      // playwright:migrated
+      it("should be able to remove lookup codes", () => {
+        cy.sessionRequires2fa()
+        cy.longPrivilegedSessionTime()
+        cy.visit(settings)
+        cy.get(
+          appPrefix(app) + 'button[name="lookup_secret_regenerate"]',
+        ).click()
+        cy.get('button[name="lookup_secret_confirm"]').click()
+        cy.expectSettingsSaved()
+        cy.visit(settings)
+
+        cy.shortPrivilegedSessionTime()
+        cy.get('button[name="lookup_secret_disable"]').click()
+        cy.reauth({
+          expect: { email },
+          type: { email: email, password: password },
+        })
+        cy.expectSettingsSaved()
+
+        cy.clearAllCookies()
+        cy.login({ email: email, password: password, cookieUrl: base })
+
+        cy.visit(login + "?aal=aal2")
+        cy.get("h2")
+          .invoke("text")
+          .should(
+            "match",
+            /Second factor authentication|Two-Factor Authentication/,
+          )
+        cy.get('*[name="method"][value="totp"]').should("not.exist")
+        cy.get('*[name="method"][value="lookup_secret"]').should("not.exist")
+        cy.get('*[name="method"][value="password"]').should("not.exist")
+      })
+
+      // playwright:migrated
+      it("should go through several lookup secret lifecycles", () => {
+        cy.visit(settings)
+
+        cy.get('[data-testid="node/text/lookup_secret_codes/label"]').should(
+          "not.exist",
+        )
+        cy.get('[data-testid="text-lookup_secret_codes-content"] code').should(
+          "not.exist",
+        )
+        cy.get('button[name="lookup_secret_confirm"]').should("not.exist")
+        cy.get('button[name="lookup_secret_regenerate"]').click()
+        cy.get('[data-testid="node/text/lookup_secret_codes/label"]').should(
+          "contain.text",
+          "These are your back up recovery codes.",
+        )
+        cy.get('[data-testid="text-lookup_secret_codes-content"] code').should(
+          "not.be.empty",
+        )
+
+        let codes: string[]
+        cy.getLookupSecrets().should((c) => {
+          codes = c
+        })
+
+        cy.get('button[name="lookup_secret_confirm"]').click()
+        cy.expectSettingsSaved()
+
+        cy.get('button[name="lookup_secret_reveal"]').should("exist")
+        cy.get('[data-testid="text-lookup_secret_codes-content"] code').should(
+          "not.exist",
+        )
+        cy.get('button[name="lookup_secret_confirm"]').should("not.exist")
+        cy.get('button[name="lookup_secret_regenerate"]').should("not.exist")
+
+        cy.get('button[name="lookup_secret_reveal"]').click()
+        cy.getLookupSecrets().should((c) => {
+          codes = c
+        })
+
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: ["password", "lookup_secret"],
+        })
+
+        // Try to log in with a recovery code now
+        cy.visit(login + "?aal=aal2&refresh=true")
+        cy.location("pathname").should("contain", "login")
+
+        cy.get('*[name="method"][value="lookup_secret"]').should("exist")
+        cy.get('*[name="method"][value="password"]').should("not.exist")
+
+        // Type an invalid code
+        cy.get('input[name="lookup_secret"]').should("exist")
+        cy.get('input[name="lookup_secret"]').type("invalid-code")
+        cy.get('*[name="method"][value="lookup_secret"]').click()
+        cy.get('[data-testid="ui/message/4000016"]').should(
+          "contain.text",
+          "The backup recovery code is not valid.",
+        )
+
+        // Type a valid code
+        cy.get('input[name="lookup_secret"]').should("exist")
+        cy.get('input[name="lookup_secret"]').should("have.value", "")
+        cy.get('input[name="lookup_secret"]').then(($e) => {
+          cy.wrap($e).type(codes[0])
+        })
+        cy.get('*[name="method"][value="lookup_secret"]').click()
+        cy.location("pathname").should("not.contain", "login")
+
+        let authenticatedAt
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: ["password", "lookup_secret", "lookup_secret"],
+        }).then((session) => {
+          authenticatedAt = session.authenticated_at
+          expect(session.authenticator_assurance_level).to.equal("aal2")
+        })
+
+        // Retry auth with the used code
+        cy.visit(login + "?aal=aal2&refresh=true")
+        cy.location().should((loc) => {
+          expect(loc.href).to.include("/login")
+        })
+        cy.get('input[name="lookup_secret"]').then(($e) => {
+          cy.wrap($e).type(codes[0])
+        })
+        cy.get('*[name="method"][value="lookup_secret"]').click()
+        // Use a valid code
+        cy.get('[data-testid="ui/message/4000012"]').should(
+          "contain.text",
+          "This backup recovery code has already been used.",
+        )
+
+        cy.get('input[name="lookup_secret"]').then(($e) => {
+          cy.wrap($e).type(codes[1])
+        })
+        cy.get('*[name="method"][value="lookup_secret"]').click()
+        cy.location("pathname").should("not.contain", "login")
+
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: [
+            "password",
+            "lookup_secret",
+            "lookup_secret",
+            "lookup_secret",
+          ],
+        }).then((session) => {
+          expect(session.authenticated_at).to.not.equal(authenticatedAt)
+        })
+
+        // Going back to the settings UI we should see that the codes have been "used"
+        cy.visit(settings)
+        cy.get('button[name="lookup_secret_reveal"]').click()
+        cy.getLookupSecrets().should((c) => {
+          expect(c.slice(2)).to.eql(codes.slice(2))
+          expect(c[0]).to.match(/(Secret was used at )|(Used)/g)
+          expect(c[1]).to.match(/(Secret was used at )|(Used)/g)
+        })
+
+        // Regenerating the codes means the old one become invalid
+        cy.get("*[name=lookup_secret_regenerate]").click()
+        cy.get("*[name=lookup_secret_confirm]").should("exist")
+        let regenCodes
+        cy.getLookupSecrets().should((c) => {
+          regenCodes = c
+        })
+
+        // Confirm it
+        cy.get("*[name=lookup_secret_confirm]").click()
+        cy.get('*[name="lookup_secret_reveal"]').click()
+        cy.getLookupSecrets().should((c) => {
+          expect(c).to.eql(regenCodes)
+        })
+
+        // Log in and see if we can use the old / new keys
+        cy.visit(login + "?aal=aal2&refresh=true")
+        cy.location("pathname").should("contain", "login")
+
+        // Using an old code fails
+        cy.get('input[name="lookup_secret"]').then(($e) => {
+          cy.wrap($e).type(codes[3])
+        })
+        cy.get('*[name="method"][value="lookup_secret"]').click()
+        cy.get('[data-testid="ui/message/4000016"]').should("exist")
+
+        // Using a new code succeeds
+        cy.get('input[name="lookup_secret"]').then(($e) => {
+          cy.wrap($e).type(regenCodes[0])
+        })
+        cy.get('*[name="method"][value="lookup_secret"]').click()
+        cy.location("pathname").should("not.contain", "login")
+
+        // Going back to the settings UI we should see that the codes have been "used"
+        cy.visit(settings)
+        cy.get('button[name="lookup_secret_reveal"]').click()
+        cy.getLookupSecrets().should((c) => {
+          expect(c.slice(1)).to.eql(regenCodes.slice(1))
+          expect(c[0]).to.match(/(Secret was used at )|(Used)/g)
+        })
+      })
+
+      it("should end up at login screen if trying to reveal without privileged session", () => {
+        cy.shortPrivilegedSessionTime()
+        cy.visit(settings)
+        cy.get('button[name="lookup_secret_regenerate"]').click()
+        cy.reauth({
+          expect: { email },
+          type: { email: email, password: password },
+        })
+
+        let codes
+        cy.getLookupSecrets().should((c) => {
+          codes = c
+        })
+
+        cy.shortPrivilegedSessionTime()
+        cy.get('button[name="lookup_secret_confirm"]').click()
+        cy.reauth({
+          expect: { email },
+          type: { email: email, password: password },
+        })
+        if (app === "react") {
+          cy.get('button[value="profile"]').click()
+        }
+        cy.expectSettingsSaved()
+
+        if (app !== "react") {
+          cy.shortPrivilegedSessionTime()
+          cy.get('button[name="lookup_secret_reveal"]').click()
+          cy.reauth({
+            expect: { email },
+            type: { email: email, password: password },
+          })
+          cy.getLookupSecrets().should((c) => {
+            expect(c).to.not.be.empty
+          })
+          cy.getSession({
+            expectAal: "aal2",
+          })
+        }
+      })
+
+      // playwright:migrated
+      it("should not show lookup as an option if not configured", () => {
+        cy.visit(login + "?aal=aal2")
+        cy.get('*[name="method"][value="totp"]').should("not.exist")
+        cy.get('*[name="method"][value="lookup_secret"]').should("not.exist")
+        cy.get('*[name="method"][value="password"]').should("not.exist")
+        cy.get("h2")
+          .invoke("text")
+          .should(
+            "match",
+            /Second factor authentication|Two-Factor Authentication/,
+          )
+      })
+    })
+  })
+})

test/e2e/cypress/integration/profiles/mfa/mix.spec.ts

@@ -0,0 +1,188 @@
+// Copyright © 2023 Ory Corp
+// SPDX-License-Identifier: Apache-2.0
+
+import { appPrefix, gen, website } from "../../../helpers"
+import { routes as react } from "../../../helpers/react"
+import { routes as express } from "../../../helpers/express"
+import { TOTP } from "otpauth"
+
+context("2FA with various methods", () => {
+  beforeEach(() => {
+    cy.task("resetCRI", {})
+  })
+  ;[
+    {
+      login: react.login,
+      settings: react.settings,
+      base: react.base,
+      app: "react" as "react",
+      profile: "spa",
+    },
+    {
+      login: express.login,
+      settings: express.settings,
+      base: express.base,
+      app: "express" as "express",
+      profile: "mfa",
+    },
+  ].forEach(({ settings, login, profile, app, base }) => {
+    describe(`for app ${app}`, () => {
+      before(() => {
+        cy.useConfigProfile(profile)
+        cy.proxy(app)
+      })
+      let email = gen.email()
+      let password = gen.password()
+
+      beforeEach(() => {
+        cy.clearAllCookies()
+        email = gen.email()
+        password = gen.password()
+        cy.registerApi({
+          email,
+          password,
+          fields: { "traits.website": website },
+        })
+        cy.clearAllCookies()
+        cy.login({ email, password, cookieUrl: base })
+        cy.longPrivilegedSessionTime()
+        cy.task("sendCRI", {
+          query: "WebAuthn.disable",
+          opts: {},
+        })
+      })
+
+      it("should set up an use all mfa combinations", () => {
+        cy.visit(settings)
+        cy.task("sendCRI", {
+          query: "WebAuthn.enable",
+          opts: {},
+        }).then(() => {
+          cy.task("sendCRI", {
+            query: "WebAuthn.addVirtualAuthenticator",
+            opts: {
+              options: {
+                protocol: "ctap2",
+                transport: "usb",
+                hasResidentKey: true,
+                hasUserVerification: true,
+                isUserVerified: true,
+              },
+            },
+          }).then(() => {
+            cy.getSession({
+              expectAal: "aal1",
+              expectMethods: ["password"],
+            })
+
+            cy.visit(settings)
+            // Set up TOTP
+            let secret: string
+            cy.get(
+              appPrefix(app) + '[data-testid="node/text/totp_secret_key/text"]',
+            ).then(($e) => {
+              secret = $e.text().trim()
+            })
+            cy.get('[name="totp_code"]').then(($e) => {
+              cy.wrap($e).type(
+                new TOTP({
+                  secret,
+                }).generate(),
+              )
+            })
+            cy.get('[name="method"][value="totp"]').click()
+            cy.expectSettingsSaved()
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: ["password", "totp"],
+            })
+
+            // Set up lookup secrets
+            cy.visit(settings)
+            cy.get('[name="lookup_secret_regenerate"]').click()
+            let codes: string[]
+            cy.getLookupSecrets().then((c) => {
+              codes = c
+            })
+            cy.get('[name="lookup_secret_confirm"]').click()
+            cy.expectSettingsSaved()
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: ["password", "totp", "lookup_secret"],
+            })
+
+            // Set up WebAuthn
+            cy.visit(settings)
+            cy.get('[name="webauthn_register_displayname"]').type("my-key")
+            // We need a workaround here. So first we click, then we submit
+            cy.clickWebAuthButton("register")
+            cy.expectSettingsSaved()
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: ["password", "totp", "webauthn", "lookup_secret"],
+            })
+
+            cy.visit(login + "?aal=aal2&refresh=true")
+            cy.get('[name="totp_code"]').then(($e) => {
+              cy.wrap($e).type(
+                new TOTP({
+                  secret,
+                }).generate(),
+              )
+            })
+
+            cy.get('[name="method"][value="totp"]').click()
+            cy.location("pathname").should("not.include", "/login")
+
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: [
+                "password",
+                "totp",
+                "webauthn",
+                "lookup_secret",
+                "totp",
+              ],
+            })
+
+            // Use TOTP
+            cy.visit(login + "?aal=aal2&refresh=true")
+            cy.clickWebAuthButton("login")
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: [
+                "password",
+                "totp",
+                "webauthn",
+                "lookup_secret",
+                "totp",
+                "webauthn",
+              ],
+            })
+
+            // Use lookup
+            cy.visit(login + "?aal=aal2&refresh=true")
+            cy.get('[name="lookup_secret"]').then(($e) => {
+              cy.wrap($e).type(codes[1])
+            })
+            cy.get('[name="method"][value="lookup_secret"]').click()
+            cy.location("pathname").should("not.include", "/login")
+
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: [
+                "password",
+                "totp",
+                "webauthn",
+                "lookup_secret",
+                "totp",
+                "webauthn",
+                "lookup_secret",
+              ],
+            })
+          })
+        })
+      })
+    })
+  })
+})

test/e2e/cypress/integration/profiles/mfa/settings.spec.ts

@@ -0,0 +1,68 @@
+// Copyright © 2023 Ory Corp
+// SPDX-License-Identifier: Apache-2.0
+
+import { appPrefix, gen, website } from "../../../helpers"
+import { routes as express } from "../../../helpers/express"
+import { routes as react } from "../../../helpers/react"
+
+context("2FA UI settings tests", () => {
+  ;[
+    {
+      settings: react.settings,
+      base: react.base,
+      app: "react" as "react",
+      profile: "spa",
+    },
+    {
+      settings: express.settings,
+      base: express.base,
+      app: "express" as "express",
+      profile: "mfa",
+    },
+  ].forEach(({ settings, profile, base, app }) => {
+    describe(`for app ${app}`, () => {
+      before(() => {
+        cy.useConfigProfile(profile)
+        cy.proxy(app)
+      })
+
+      const email = gen.email()
+      const password = gen.password()
+
+      before(() => {
+        cy.registerApi({
+          email,
+          password,
+          fields: { "traits.website": website },
+        })
+      })
+
+      beforeEach(() => {
+        cy.clearAllCookies()
+        cy.useConfig((builder) => builder.disableCodeMfa())
+        cy.login({ email, password, cookieUrl: base })
+        cy.visit(settings)
+      })
+
+      it("shows all settings forms", () => {
+        cy.get(appPrefix(app) + "h3").should("contain.text", "Profile Settings")
+        cy.get("h3").should("contain.text", "Change Password")
+        cy.get("h3").should("contain.text", "Manage 2FA Backup Recovery Codes")
+        cy.get("h3").should("contain.text", "Manage 2FA TOTP Authenticator App")
+        cy.get("h3").should("contain.text", "Manage Hardware Tokens")
+        cy.get('input[name="traits.email"]').should("contain.value", email)
+        cy.get('input[name="traits.website"]').should("contain.value", website)
+
+        cy.get('[data-testid="node/text/totp_secret_key/label"]').should(
+          "contain.text",
+          "This is your authenticator app secret",
+        )
+        cy.get("button").should(
+          "contain.text",
+          "Generate new backup recovery codes",
+        )
+        cy.get("button").should("contain.text", "Add security key")
+      })
+    })
+  })
+})

test/e2e/cypress/integration/profiles/mfa/totp.spec.ts

@@ -0,0 +1,364 @@
+// Copyright © 2023 Ory Corp
+// SPDX-License-Identifier: Apache-2.0
+
+import { gen, website } from "../../../helpers"
+import { routes as express } from "../../../helpers/express"
+import { routes as react } from "../../../helpers/react"
+import { TOTP } from "otpauth"
+
+context("2FA TOTP", () => {
+  ;[
+    {
+      login: react.login,
+      settings: react.settings,
+      base: react.base,
+      app: "react" as "react",
+      profile: "spa",
+    },
+    {
+      login: express.login,
+      settings: express.settings,
+      base: express.base,
+      app: "express" as "express",
+      profile: "mfa",
+    },
+  ].forEach(({ settings, login, profile, app, base }) => {
+    describe(`for app ${app}`, () => {
+      before(() => {
+        cy.useConfigProfile(profile)
+        cy.proxy(app)
+      })
+
+      let email = gen.email()
+      let password = gen.password()
+
+      beforeEach(() => {
+        cy.useConfig((builder) =>
+          builder.longPrivilegedSessionTime().useLaxAal().disableCodeMfa(),
+        )
+        email = gen.email()
+        password = gen.password()
+
+        cy.register({
+          email,
+          password,
+          fields: { "traits.website": website },
+        })
+      })
+
+      // playwright:migrated
+      it("should be be asked to sign in with 2fa if set up", () => {
+        cy.visit(settings)
+        cy.requireStrictAal()
+
+        let secret: string
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').then(($e) => {
+          secret = $e.text().trim()
+        })
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.expectSettingsSaved()
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: ["password", "totp"],
+        })
+
+        cy.clearAllCookies()
+        cy.visit(login)
+
+        cy.get('input[name="identifier"]').type(email)
+        cy.get('input[name="password"]').type(password)
+        cy.submitPasswordForm()
+
+        // MFA is now requested
+        cy.shouldShow2FAScreen()
+
+        // If we visit settings page we still end up at 2fa screen
+        cy.visit(settings)
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.include("/login")
+        })
+
+        cy.shouldShow2FAScreen()
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.oneOf(["/welcome", "/", "/sessions", "/settings"])
+        })
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: ["password", "totp"],
+        })
+      })
+
+      it("signin with 2fa and be redirected", () => {
+        if (app !== "express") {
+          return
+        }
+
+        cy.visit(settings)
+        cy.requireStrictAal()
+
+        let secret: string
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').then(($e) => {
+          secret = $e.text().trim()
+        })
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.expectSettingsSaved()
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: ["password", "totp"],
+        })
+
+        cy.clearAllCookies()
+        cy.visit(`${login}?return_to=https://www.example.org/`)
+
+        cy.get('input[name="identifier"]').type(email)
+        cy.get('input[name="password"]').type(password)
+        cy.submitPasswordForm()
+
+        // MFA is now requested
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.include("/login")
+        })
+        cy.shouldShow2FAScreen()
+
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.include("/login")
+        })
+
+        cy.shouldShow2FAScreen()
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.url().should("eq", "https://www.example.org/")
+      })
+
+      // playwright:migrated
+      it("should go through several totp lifecycles", () => {
+        cy.visit(settings)
+
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').should("exist")
+        cy.get('img[data-testid="node/image/totp_qr"]').should("exist")
+
+        // Set up TOTP
+        let secret: string
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').then(($e) => {
+          secret = $e.text().trim()
+        })
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.expectSettingsSaved()
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').should(
+          "not.exist",
+        )
+        cy.get('img[data-testid="node/image/totp_qr"]').should("not.exist")
+        cy.get('*[name="method"][value="totp"]').should("not.exist")
+        cy.get('*[name="totp_unlink"]').should("exist")
+
+        // Let's try to do 2FA
+        cy.visit(login + "?aal=aal2&refresh=true")
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.include("/login")
+        })
+        cy.get('*[name="method"][value="password"]').should("not.exist")
+
+        // Typing a wrong code leaves us with an error message
+        cy.get('*[name="totp_code"]').type("111111")
+        cy.get('*[name="method"][value="totp"]').click()
+
+        cy.get('[data-testid="ui/message/4000008"]').should(
+          "contain.text",
+          "The provided authentication code is invalid, please try again.",
+        )
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.location("pathname").should("not.contain", "/login")
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: ["password", "totp", "totp"],
+        })
+
+        // Going to settings and unlinking the device
+        cy.visit(settings)
+        cy.get('*[name="totp_unlink"]').click()
+        cy.expectSettingsSaved()
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').should("exist")
+        cy.get('img[data-testid="node/image/totp_qr"]').should("exist")
+        cy.get('*[name="method"][value="totp"]').should("exist")
+        cy.get('*[name="totp_unlink"]').should("not.exist")
+
+        // 2FA should be gone
+        cy.visit(login + "?aal=aal2&refresh=true")
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.include("/login")
+        })
+        cy.get('*[name="method"][value="totp"]').should("not.exist")
+
+        // Linking a new device works
+        cy.visit(settings)
+        let newSecret: string
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').then(($e) => {
+          newSecret = $e.text().trim()
+        })
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret: newSecret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.expectSettingsSaved()
+
+        // Old secret no longer works in login
+        cy.visit(login + "?aal=aal2&refresh=true")
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.include("/login")
+        })
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.get('[data-testid="ui/message/4000008"]').should(
+          "contain.text",
+          "The provided authentication code is invalid, please try again.",
+        )
+
+        // But new one does!
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret: newSecret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.not.include("/login")
+        })
+
+        cy.getSession({
+          expectAal: "aal2",
+          expectMethods: ["password", "totp", "totp", "totp", "totp"],
+        })
+
+        // The React app keeps using the same flow. The following scenario used to be broken,
+        // because the internal context wasn't populated properly in the flow after settings were saved.
+        cy.visit(settings)
+        cy.get('*[name="totp_unlink"]').click()
+        cy.expectSettingsSaved()
+
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').then(($e) => {
+          secret = $e.text().trim()
+        })
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.expectSettingsSaved()
+      })
+
+      // playwright:migrated
+      it("should not show totp as an option if not configured", () => {
+        cy.visit(login + "?aal=aal2")
+        cy.location("pathname").should((loc) => {
+          expect(loc).to.include("/login")
+        })
+
+        cy.get('*[name="method"][value="totp"]').should("not.exist")
+        cy.get('*[name="method"][value="password"]').should("not.exist")
+        cy.shouldShow2FAScreen()
+
+        cy.get('[data-testid="logout-link"]').click()
+        cy.location().should((loc) => {
+          expect(loc.href).to.include("/login")
+          expect(loc.search).to.not.include("aal")
+          expect(loc.search).to.not.include("refresh")
+        })
+        cy.noSession()
+      })
+
+      // playwright:migrated
+      it("should fail to set up totp if verify code is wrong", () => {
+        cy.visit(settings)
+        cy.get('input[name="totp_code"]').type("12345678")
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.get('[data-testid="ui/message/4000008"]').should(
+          "contain.text",
+          "The provided authentication code is invalid, please try again.",
+        )
+      })
+
+      // The React app keeps using the same flow. The following scenario used to be broken,
+      // because the internal context wasn't populated properly in the flow after settings were saved.
+      // playwright:migrated
+      it("should allow changing other settings and then setting up totp", () => {
+        cy.visit(settings)
+        cy.get('input[name="traits.website"]')
+          .clear()
+          .type("https://some-website.com")
+        cy.get('*[name="method"][value="profile"]').click()
+        cy.expectSettingsSaved()
+
+        let secret: string
+        cy.get('[data-testid="node/text/totp_secret_key/text"]').then(($e) => {
+          secret = $e.text().trim()
+        })
+        cy.get('input[name="totp_code"]').then(($e) => {
+          cy.wrap($e).type(
+            new TOTP({
+              secret,
+            }).generate(),
+          )
+        })
+        cy.get('*[name="method"][value="totp"]').click()
+        cy.expectSettingsSaved()
+      })
+    })
+  })
+})

test/e2e/cypress/integration/profiles/mfa/webauthn.spec.ts

@@ -0,0 +1,331 @@
+// Copyright © 2023 Ory Corp
+// SPDX-License-Identifier: Apache-2.0
+
+import { appPrefix, gen, website } from "../../../helpers"
+import { routes as react } from "../../../helpers/react"
+import { routes as express } from "../../../helpers/express"
+
+context("2FA WebAuthn", () => {
+  beforeEach(() => {
+    cy.task("resetCRI", {})
+  })
+  ;[
+    {
+      login: express.login,
+      settings: express.settings,
+      base: express.base,
+      app: "express" as "express",
+      profile: "mfa",
+    },
+    {
+      login: react.login,
+      settings: react.settings,
+      base: react.base,
+      app: "react" as "react",
+      profile: "spa",
+    },
+  ].forEach(({ settings, login, profile, app, base }) => {
+    describe(`for app ${app}`, () => {
+      before(() => {
+        cy.useConfigProfile(profile)
+        cy.proxy(app)
+      })
+
+      let email = gen.email()
+      let password = gen.password()
+
+      beforeEach(() => {
+        cy.clearAllCookies()
+
+        cy.useConfig((builder) => builder.disableCodeMfa())
+        email = gen.email()
+        password = gen.password()
+        cy.registerApi({
+          email,
+          password,
+          fields: { "traits.website": website },
+        })
+
+        cy.login({ email, password })
+
+        cy.longPrivilegedSessionTime()
+        cy.task("sendCRI", {
+          query: "WebAuthn.disable",
+          opts: {},
+        })
+      })
+
+      it("should be able to identify if the authenticator is wrong", () => {
+        cy.visit(settings)
+
+        // Set up virtual authenticator
+        cy.task("sendCRI", {
+          query: "WebAuthn.enable",
+          opts: {},
+        }).then(() => {
+          cy.task("sendCRI", {
+            query: "WebAuthn.addVirtualAuthenticator",
+            opts: {
+              options: {
+                protocol: "ctap2",
+                transport: "usb",
+                hasResidentKey: true,
+                hasUserVerification: true,
+                isUserVerified: true,
+              },
+            },
+          }).then((addResult) => {
+            cy.get(
+              appPrefix(app) + '[name="webauthn_register_displayname"]',
+            ).type("key1")
+
+            cy.clickWebAuthButton("register")
+
+            cy.get('*[name="webauthn_remove"]').should("have.length", 1)
+
+            cy.task("sendCRI", {
+              query: "WebAuthn.removeVirtualAuthenticator",
+              opts: addResult,
+            }).then(() => {
+              cy.visit(login + "?aal=aal2&refresh=true")
+              cy.location().should((loc) => {
+                expect(loc.href).to.include("/login")
+              })
+              cy.clickWebAuthButton("login")
+              cy.location().should((loc) => {
+                expect(loc.href).to.include("/login")
+              })
+              cy.getSession({
+                expectAal: "aal2",
+                expectMethods: ["password", "webauthn"],
+              })
+
+              cy.task("sendCRI", {
+                query: "WebAuthn.addVirtualAuthenticator",
+                opts: {
+                  options: {
+                    protocol: "ctap2",
+                    transport: "usb",
+                    hasResidentKey: true,
+                    hasUserVerification: true,
+                    isUserVerified: true,
+                  },
+                },
+              }).then((addResult) => {
+                cy.visit(login + "?aal=aal2&refresh=true")
+                cy.location().should((loc) => {
+                  expect(loc.href).to.include("/login")
+                })
+                cy.clickWebAuthButton("login")
+
+                cy.location().should((loc) => {
+                  expect(loc.href).to.include("/login")
+                })
+
+                cy.getSession({
+                  expectAal: "aal2",
+                  expectMethods: ["password", "webauthn"],
+                })
+              })
+            })
+          })
+        })
+      })
+
+      it("should be able to link multiple authenticators", () => {
+        cy.visit(settings)
+
+        cy.task("sendCRI", {
+          query: "WebAuthn.enable",
+          opts: {},
+        }).then(() => {
+          // Register the first credential with the first virtual authenticator.
+          cy.task("sendCRI", {
+            query: "WebAuthn.addVirtualAuthenticator",
+            opts: {
+              options: {
+                protocol: "ctap2",
+                transport: "usb",
+                hasResidentKey: true,
+                hasUserVerification: true,
+                isUserVerified: true,
+              },
+            },
+          }).then((firstAuthenticator) => {
+            cy.get('*[name="webauthn_register_displayname"]').type("key1")
+            cy.clickWebAuthButton("register")
+            cy.get('*[name="webauthn_remove"]').should("have.length", 1)
+
+            // Swap in a second authenticator for the next credential. The
+            // settings flow lists the first credential in excludeCredentials;
+            // with both authenticators attached, create() would race the
+            // excluded authenticator's InvalidStateError against the new one, so
+            // remove the first before registering on the second. The identity
+            // keeps both credentials server-side either way.
+            cy.task("sendCRI", {
+              query: "WebAuthn.removeVirtualAuthenticator",
+              opts: firstAuthenticator,
+            })
+            cy.task("sendCRI", {
+              query: "WebAuthn.addVirtualAuthenticator",
+              opts: {
+                options: {
+                  protocol: "ctap2",
+                  transport: "usb",
+                  hasResidentKey: true,
+                  hasUserVerification: true,
+                  isUserVerified: true,
+                },
+              },
+            }).then(() => {
+              cy.get('*[name="webauthn_register_displayname"]').type("key2")
+              cy.clickWebAuthButton("register")
+
+              cy.get('*[name="webauthn_remove"]').should("have.length", 2)
+
+              cy.visit(login + "?aal=aal2&refresh=true")
+              cy.location().should((loc) => {
+                expect(loc.href).to.include("/login")
+              })
+              cy.get('*[name="webauthn_login_trigger"]').should(
+                "have.length",
+                1,
+              )
+              cy.clickWebAuthButton("login")
+            })
+          })
+        })
+      })
+
+      it("should not register the same authenticator twice", () => {
+        cy.visit(settings)
+
+        cy.task("sendCRI", {
+          query: "WebAuthn.enable",
+          opts: {},
+        }).then(() => {
+          cy.task("sendCRI", {
+            query: "WebAuthn.addVirtualAuthenticator",
+            opts: {
+              options: {
+                protocol: "ctap2",
+                transport: "usb",
+                hasResidentKey: true,
+                hasUserVerification: true,
+                isUserVerified: true,
+              },
+            },
+          }).then(() => {
+            cy.get('*[name="webauthn_register_displayname"]').type("key1")
+            cy.clickWebAuthButton("register")
+            cy.get('*[name="webauthn_remove"]').should("have.length", 1)
+
+            // Registering again with the same authenticator must be rejected:
+            // the settings flow lists the existing credential in
+            // excludeCredentials, so the browser refuses to create a duplicate
+            // and the credential count stays at one.
+            cy.get('*[name="webauthn_register_displayname"]').type("key2")
+            cy.clickWebAuthButton("register")
+
+            cy.get('*[name="webauthn_remove"]').should("have.length", 1)
+          })
+        })
+      })
+
+      it("should be not be able to link provider if webauth is not enabled", () => {
+        cy.visit(settings)
+        cy.get('*[name="webauthn_register_displayname"]').type("my-key")
+        cy.clickWebAuthButton("register")
+        cy.get('*[name="webauthn_remove"]').should("not.exist")
+      })
+
+      it("should be able to link a webauthn provider", () => {
+        cy.visit(settings)
+
+        // Set up virtual authenticator
+        cy.task("sendCRI", {
+          query: "WebAuthn.enable",
+          opts: {},
+        }).then(() => {
+          cy.task("sendCRI", {
+            query: "WebAuthn.addVirtualAuthenticator",
+            opts: {
+              options: {
+                protocol: "ctap2",
+                transport: "usb",
+                hasResidentKey: true,
+                hasUserVerification: true,
+                isUserVerified: true,
+              },
+            },
+          }).then((addResult) => {
+            // Signing up without a display name causes an error
+            cy.get('*[name="webauthn_remove"]').should("not.exist")
+
+            cy.clickWebAuthButton("register")
+
+            cy.get('[data-testid="ui/message/4000002"]').should(
+              "contain.text",
+              "Property webauthn_register_displayname is missing.",
+            )
+
+            // Setting up with key works
+            cy.get('*[name="webauthn_register_displayname"]').type("my-key")
+
+            // We need a workaround here. So first we click, then we submit
+            cy.clickWebAuthButton("register")
+
+            cy.expectSettingsSaved()
+            cy.get('*[name="webauthn_remove"]').should("exist")
+
+            // Login without refresh
+            cy.login({ email, password })
+            cy.visit(login + "?aal=aal2")
+            cy.location().should((loc) => {
+              expect(loc.href).to.include("/login")
+            })
+
+            cy.get('*[name="webauthn_login_trigger"]').should("have.length", 1)
+            cy.clickWebAuthButton("login")
+            cy.location().should((loc) => {
+              expect(loc.href).to.not.include("/login")
+            })
+
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: ["password", "webauthn"],
+            })
+
+            // Login with refresh
+            cy.visit(login + "?aal=aal2&refresh=true")
+            cy.location().should((loc) => {
+              expect(loc.href).to.include("/login")
+            })
+
+            cy.get('*[name="webauthn_login_trigger"]').should("have.length", 1)
+            cy.clickWebAuthButton("login")
+            cy.location().should((loc) => {
+              expect(loc.href).to.not.include("/login")
+            })
+
+            cy.getSession({
+              expectAal: "aal2",
+              expectMethods: ["password", "webauthn", "webauthn"],
+            })
+            cy.visit(settings)
+            cy.get('*[name="webauthn_remove"]').click()
+            cy.get('*[name="webauthn_remove"]').should("not.exist")
+
+            cy.visit(login + "?aal=aal2&refresh=true")
+            cy.location().should((loc) => {
+              expect(loc.href).to.include("/login")
+            })
+
+            cy.get('button[name="webauthn_login_trigger"]').should("not.exist")
+            cy.get('[data-testid="ui/message/1010003"]').should("exist")
+          })
+        })
+      })
+    })
+  })
+})