Safari cannot enable totp

[hmt]

Steps to reproduce

1. Use latest Safari in latest NC, here 28.0.2 Enterprise
2. Click Checkbox to enable TOTP
3. See spinning icon nothing ever happens after that

Expected behaviour

The QR-Code is shown instead

Actual behaviour

The QR-Code never shows up, only the spinning icon

Server configuration

Operating system:
Ubuntu 22
Web server:
Apache
Database:
MariaDB 11.2
PHP version:
8.1
Version: (see admin page)
28.0.2 Enterprise
Updated from an older version or fresh install:
updated
List of activated apps:

Enabled:
  - activity: 2.20.0
  - admin_audit: 1.18.0
  - bbb: 2.5.0
  - bruteforcesettings: 2.8.0
  - calendar: 4.6.5
  - circles: 28.0.0-dev
  - cloud_federation_api: 1.11.0
  - contacts: 5.5.2
  - dav: 1.29.1
  - external: 5.3.1
  - federatedfilesharing: 1.18.0
  - files: 2.0.0
  - files_pdfviewer: 2.9.0
  - files_sharing: 1.20.0
  - files_trashbin: 1.18.0
  - firstrunwizard: 2.17.0
  - logreader: 2.13.0
  - lookup_server_connector: 1.16.0
  - notifications: 2.16.0
  - oauth2: 1.16.3
  - onlyoffice: 9.0.0
  - photos: 2.4.0
  - provisioning_api: 1.18.0
  - security_guard: 1.0.0
  - serverinfo: 1.18.0
  - settings: 1.10.1
  - theming: 2.3.0
  - twofactor_admin: 4.4.0
  - twofactor_backupcodes: 1.17.0
  - twofactor_totp: 10.0.0-beta.2
  - updatenotification: 1.18.0
  - user_ldap: 1.19.0
  - viewer: 2.2.0
  - workflowengine: 2.10.0

The content of config/config.php:

{
    "system": {                                                                                                                                                                                                                 16:53:00 [0/1602]
        "instanceid": "***REMOVED SENSITIVE VALUE***",
        "passwordsalt": "***REMOVED SENSITIVE VALUE***",
        "secret": "***REMOVED SENSITIVE VALUE***",
        "trusted_domains": [
            "nextcloud.example.de",
            "nextcloud.example1.de",
            "xxx.xxx.xxx.xxx"
        ],
        "datadirectory": "***REMOVED SENSITIVE VALUE***",
        "dbtype": "mysql",
        "version": "28.0.2.6",
        "dbname": "***REMOVED SENSITIVE VALUE***",
        "dbhost": "***REMOVED SENSITIVE VALUE***",
        "dbport": "",
        "dbtableprefix": "oc_",
        "dbuser": "***REMOVED SENSITIVE VALUE***",
        "dbpassword": "***REMOVED SENSITIVE VALUE***",
        "logtimezone": "UTC",
        "installed": true,
        "ldapIgnoreNamingRules": false,
        "ldapProviderFactory": "\\OCA\\User_LDAP\\LDAPProviderFactory",
        "memcache.local": "\\OC\\Memcache\\APCu",
        "memcache.distributed": "\\OC\\Memcache\\Redis",
        "memcache.locking": "\\OC\\Memcache\\Redis",
        "redis": {
            "host": "***REMOVED SENSITIVE VALUE***",
            "port": 6379
        },
        "maintenance": false,
        "theme": "",
        "loglevel": 0,
        "log_rotate_size": 104857600,
        "mail_from_address": "***REMOVED SENSITIVE VALUE***",
        "mail_smtpmode": "smtp",
        "mail_sendmailmode": "smtp",
        "mail_domain": "***REMOVED SENSITIVE VALUE***",
        "mail_smtpsecure": "ssl",
        "mail_smtphost": "***REMOVED SENSITIVE VALUE***",
        "mail_smtpport": "465",
        "mail_smtpauthtype": "LOGIN",
        "mail_smtpauth": 1,
        "mail_smtpname": "***REMOVED SENSITIVE VALUE***",
        "mail_smtppassword": "***REMOVED SENSITIVE VALUE***",
        "mysql.utf8mb4": true,
        "app_install_overwrite": [
            "external",
            "cms_pico",
            "files_readmemd",
            "githubmergetracker",
            "calendar",
            "bruteforcesettings",
            "bbb"
        ],
        "overwrite.cli.url": "https:\/\/nextcloud.example.de",
        "htaccess.RewriteBase": "\/",
        "apps_paths": [
            {
                "path": "\/var\/www\/nextcloud\/apps",
                "url": "\/apps",
                "writable": false
            },
            {
                "path": "\/var\/www\/nextcloud\/apps2",
                "url": "\/apps2",
                "writable": true
            }
        ],
        "updater.release.channel": "enterprise",
        "default_phone_region": "DE",
        "updater.server.url": "https:\/\/updates.nextcloud.com\/customers\/J3CWG-94D1Q-QCLLJ-A6V9Y-PJSIR\/",
        "maintenance_window_start": "1"
    }
}

Client configuration

Browser:
Safari

Operating system:
macOS 14.2.1

Logs

Web server error log

nothing

Server log (data/nextcloud.log)

nothing

Browser log

nothing

[doc75]

Same issue on my side on Nextcloud 28.0.3 (docker official image - not the all in one) when using Firefox 123.0.1 on Linux.
It is working fine with Ungoogled Chromium Version 113.0.5672.127
The issue seems to be in the Vue/js code as nothing can be seen in the server log (loglevel = 0)
I can see this in the console of Firefox:

Firefox console

Error: Your focus-trap must have at least one container with at least one tabbable node in it at all times
    p main.js:320
    activate main.js:320
    useFocusTrap main.js:1365
    fn main.js:7
    ln main.js:7
    promise callback*rn main.js:7
    fn main.js:7
    tr main.js:7
    update main.js:7
    notify main.js:5
    set main.js:5
    set main.js:14
    mounted main.js:1365
    en main.js:7
    Gn main.js:7
    insert main.js:7
    S main.js:15
    Ti main.js:15
    _update main.js:7
    r main.js:7
    get main.js:7
    e main.js:7
    mount main.js:7
    $mount main.js:15
    confirmPassword main.js:1848
    createTOTP PersonalTotpSettings.vue:98
    toggleEnabled PersonalTotpSettings.vue:86
    VueJS 19
    <anonymous> main-settings.js:42
    <anonymous> main-settings.js:44
    <anonymous> main-settings.js:44
[main.js:7:2095](webpack:///twofactor_totp/node_modules/@nextcloud/password-confirmation/dist/main.js)
    nn main.js:7
    tn main.js:7
    Qt main.js:7
    fn main.js:7
    ln main.js:7
    (Async: promise callback)
    rn main.js:7
    fn main.js:7
    tr main.js:7
    update main.js:7
    notify main.js:5
    set main.js:5
    set main.js:14
    mounted main.js:1365
    en main.js:7
    Gn main.js:7
    insert main.js:7
    S main.js:15
    Ti main.js:15
    _update main.js:7
    r main.js:7
    get main.js:7
    e main.js:7
    mount main.js:7
    $mount main.js:15
    confirmPassword main.js:1848
    createTOTP PersonalTotpSettings.vue:98
    toggleEnabled PersonalTotpSettings.vue:86
    VueJS 19
    <anonymous> main-settings.js:42
    <anonymous> main-settings.js:44
    <anonymous> main-settings.js:44
​```
</details>

[holzerseb]

Same issue, cannot enable TOTP through Safari. Works fine in Firefox

[susnux]

The QR-Code never shows up, only the spinning icon

Are you sure there are no messages in the browser console?

[hmt]

Yes, but we switched to required for all and now it shows up when you login and haven't yet set up totp. This is the best outcome and I should have done that from the start but didn't know it would work this way.
If anybody reads this issue and it doesn't work. Just require totp for all users and it will work across all browsers.