[5.x]: Error trying to setup Passkey

[jonleverrier]

What happened?

Description

I can't setup passkey on my user account

Steps to reproduce

1. Log in to control panel
2. Head to your user account
3. Click on "Add passkey" button
4. Enter name for key and press OK

At this point a "Type error" toast notification appears. Error in browser console:

[Error] There is no trigger element set for this modal. Set one with modal.$triggerElement = $(...) (anonymous function) (garnish.js:2:95587)

I was using Safari Version 18.6 (20621.3.11.11.3) at the time.

Expected behavior

Actual behavior

Craft CMS version

5.9.17

PHP version

8.4

Operating system and version

Mac

Database type and version

No response

Image driver and version

No response

Installed plugins and versions

[linear]

CMS-1916

[i-just]

Hi, thanks for getting in touch! Could you please share the full text from that toast notification (or was it actually only saying “Type error”)? Could you also post a stack trace from when this happens? The “no trigger element set for this modal” error you see in the console looks unrelated, but I’m looking into it too.

[jonleverrier]

Hi @i-just - the toast notification just says "Type error". I can't find a full stack trace anywhere. I'm trying to setup passkeys on local dev. my dev site url ends in .local

[i-just]

Thanks for the extra info @jonleverrier! Any chance you can try setting up a passkey in Chrome and see if it works as expected?

[jonleverrier]

So, I tried Chrome (Version 146.0.7680.81 (Official Build) (arm64)) and it let me save my passkey. When I logged out and tried to use it by clicking the "Sign in with a passkey" button nothing happens (the text briefly changes to a spinner icon). There's no errors in the browser console.

[i-just]

Thanks! Unfortunately, I’m not able to reproduce. I tried Chrome (same version as yours) and was able to create a passkey and use it to log in. I also tried Safari - I’m on 26.3.1, but I also tried iOS 18.2 and 18.6 simulators. In all the cases, it either fully works or shows the message that passkeys are not supported (which is also expected behaviour).

Because of security issues, we had to update the underlying libraries in cms version 5.9.16. Any chance you could try downgrading to 5.9.15 and see if you get the same behaviour in Safari and Chrome?

[beatjoerg]

I think version 5.9.17 was accidentally released with the old version of @simplewebauthn/browser.
If you do a search on the vendor\craftcms\cms\src\web\assets\cp\dist\cp.js.map you will find "@simplewebauthn/browser@7.4.0" and the old definition
function startAuthentication(requestOptionsJSON, useBrowserAutofill = false)
That stops passkeys working correctly.
I think in version 5.9.16 it was fine.

[i-just]

Thanks @beatjoerg, I think you’re right!

Apologies, @jonleverrier. When I tested this, I accidentally used my local version of the CMS, which had the correct versions of all the dependencies.

This is already fixed on the 5.x branch. Additionally, I raised a PR that should make it easier to catch issues like this in the future.

Also, @gcamacho079 raised a PR that fixes the modal.$triggerElement problem (which wasn’t related to this issue).

[brandonkelly]

Craft 5.9.18 is out with that fix. Thanks again!