Safari Autofill TOTP via iCloud Keychain

General
1

Hey,

I am not able to use iCloud Keychain Autofill for TOTP in kite. I went and dinged up a bit and found below with the help of AI.

<input type="number" placeholder="••••••" id="userid" autocorrect="off"
  required="required" minlength="6" maxlength="6" autofocus="autofocus"
  pattern="[0-9]+" label="External TOTP" rules="" dynamicwidthoffset="4"
  icon="shield" staticlabel="true" autocomplete="off">

Why Safari isn’t auto-filling

  1. autocomplete="off"

    • This explicitly tells the browser: “don’t use autofill here.”
    • Safari will usually respect that and won’t auto-suggest passwords / codes unless you manually invoke it (right-click → Passwords…, which is what you’re doing now).

  2. No autocomplete="one-time-code"

    • For OTP/TOTP fields, Safari looks for something like:

      autocomplete="one-time-code"

    • Without this, it just treats it as a normal numeric field, not a “verification code” box.

  3. id="userid" is misleading

    • Name/ID like userid make the field look like a username, not a code.
    • Not a blocker by itself, but it doesn’t help Safari’s heuristics.

  4. type="number" + custom stuff

    • Apple’s own examples usually use type="text" with inputmode="numeric".
    • type="number" can work, but again, combined with autocomplete="off" it’s not ideal.

What Zerodha should use (for proper auto-fill)

Something like this would make Safari (and Chrome, iOS, etc.) behave nicely:

<input
  type="text"
  inputmode="numeric"
  pattern="[0-9]*"
  name="external_totp"
  id="external-totp"
  autocomplete="one-time-code"
  minlength="6"
  maxlength="6"
  required
>

Or at least:

  • Remove autocomplete="off"
  • Add autocomplete="one-time-code"

For you right now

You’re already doing the best possible UX given their markup:

  • Click in the field → right-click → Passwords… (or press ⌘ + ⇧ + .)
  • Select Zerodha → TOTP gets filled from iCloud Keychain.

If you want to nudge them, you can literally send their support/devs:

“Your External TOTP input uses autocomplete="off" and no autocomplete="one-time-code", so Safari/iCloud Keychain can’t auto-fill the 6-digit TOTP. If you change it to autocomplete="one-time-code" (and drop off), Apple’s and other browsers’ OTP autofill will start working.”

Is it possible for you guys to enable autofill here ?

1 Like
2

One way to make it work as it exists now is : type a key on TOTP field, delete it, now Apple Passwords auto fill shows up.

3

Thanks, This is better that Right Click → Autofill → Password flow that I am currently using.

I would like proper implementation by zerodha though.

4

I do exactly the same. A bit of friction but it works.