From fa213d95ee9c963559da315b7600b8ff2d29a9ec Mon Sep 17 00:00:00 2001
From: Bernard Siebens <bernard@siebens.org>
Date: Mon, 13 Jul 2026 23:11:06 +0200
Subject: [PATCH] Drop the placeholder from the otp field

allauth sets placeholder="Code" on the field. Grey text sitting inside the otp
boxes reads as an already-typed code, so it goes -- the sr-only label outside the
box still names the field.

Suppressed with placeholder=False rather than by deleting the key: as_widget()
merges the widget's own attrs back in at render time, so popping it from a copy
does nothing. Django's attribute template omits attrs whose value is False.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 authentication/tests.py                |  4 ++++
 controlpanel/templatetags/ui.py        | 15 +++++++++++++++
 templates/allauth/elements/fields.html |  2 +-
 3 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/authentication/tests.py b/authentication/tests.py
index b0c0270..6edb60b 100644
--- a/authentication/tests.py
+++ b/authentication/tests.py
@@ -265,6 +265,10 @@ class TwoFactorPageTests(TestCase):
         self.assertContains(self.response, 'name="code"')
         self.assertContains(self.response, "otp otp-lg")
 
+    def test_the_otp_field_has_no_placeholder(self):
+        # allauth sets placeholder="Code"; inside the boxes it reads as a typed-in code.
+        self.assertNotContains(self.response, 'placeholder="Code"')
+
     def test_cancel_sits_beside_sign_in_and_is_not_primary(self):
         self.assertContains(self.response, '<button class="btn gap-2" type="submit" form="logout-from-stage">')
         self.assertContains(self.response, '<button class="btn btn-primary gap-2" type="submit">')
diff --git a/controlpanel/templatetags/ui.py b/controlpanel/templatetags/ui.py
index 199a249..e132d78 100644
--- a/controlpanel/templatetags/ui.py
+++ b/controlpanel/templatetags/ui.py
@@ -68,6 +68,21 @@ def is_otp(field):
     return field.name in OTP_FIELDS
 
 
+@register.filter
+def as_otp(field):
+    """Render the code input for the boxed otp layout.
+
+    No daisy classes — the wrapping div carries them — and no placeholder: allauth sets
+    one ("Code"), and grey text sitting inside the boxes reads as an already-typed code.
+    The label lives outside the box as an sr-only element, so nothing is lost.
+
+    False, not a pop: as_widget() merges the widget's own attrs back in, so deleting the
+    placeholder from a copy achieves nothing. Django's attribute template omits any attr
+    whose value is False, which is the only way to actually suppress one.
+    """
+    return field.as_widget(attrs={"class": "", "placeholder": False})
+
+
 @register.filter
 def field_icon(field):
     return FIELD_ICONS.get(field.name, "")
diff --git a/templates/allauth/elements/fields.html b/templates/allauth/elements/fields.html
index 372d767..163444a 100644
--- a/templates/allauth/elements/fields.html
+++ b/templates/allauth/elements/fields.html
@@ -50,7 +50,7 @@
                     {% if attrs.unlabeled %}<label class="sr-only" for="{{ field.id_for_label }}">{{ field.label }}</label>{% endif %}
                     <div class="flex justify-center">
                         <div class="otp otp-lg" data-otp>
-                            {{ field|daisy:"" }}
+                            {{ field|as_otp }}
                             <span></span>
                             <span></span>
                             <span></span>