Add honeypot field to newsletter form to prevent spam submissions

Fixes #16231

- Added `office_fax` as a honeypot field in the form to trap bots.
- Implemented validation to check for any input in the honeypot field, logging a warning if filled.
- Updated the newsletter subscription view to handle errors related to the honeypot field.
- Added corresponding tests to ensure the honeypot functionality works as intended.
- Styled the honeypot field to be hidden from users while remaining accessible to bots.

Author: localjo

bedrock/newsletter/forms.py

@@ -10,7 +10,7 @@
 
 from product_details import product_details
 
-from bedrock.mozorg.forms import EmailInput, PrivacyWidget, strip_parenthetical
+from bedrock.mozorg.forms import EmailInput, PrivacyWidget, HoneyPotWidget, strip_parenthetical
 from bedrock.newsletter import utils
 from lib.l10n_utils.fluent import ftl, ftl_lazy
 
@@ -186,6 +186,8 @@ class NewsletterFooterForm(forms.Form):
     privacy = forms.BooleanField(widget=PrivacyWidget(attrs={"data-testid": "newsletter-privacy-checkbox"}))
     source_url = forms.CharField(required=False)
     newsletters = forms.MultipleChoiceField(widget=forms.CheckboxSelectMultiple())
+    # office_fax is a honeypot field
+    office_fax = forms.CharField(widget=HoneyPotWidget(), required=False, empty_value='')
 
     # has to take a newsletters argument so it can figure
     # out which languages to list in the form.
@@ -251,6 +253,16 @@ def clean_source_url(self):
 
         return su
 
+    def clean_office_fax(self):
+        # Check raw data to catch any value, including whitespace-only
+        office_fax = self.data.get('office_fax', '')
+        if office_fax:
+            import logging
+            logger = logging.getLogger('b.newsletter')
+            logger.warning(f'Honeypot field filled with value: "{office_fax}"')
+            raise forms.ValidationError('Invalid submission')
+        return ''
+
 
 class EmailForm(forms.Form):
     """

bedrock/newsletter/templates/newsletter/includes/form.html

@@ -15,6 +15,9 @@
     {% endif %}
     <input type="hidden" name="source_url" value="{{ request.build_absolute_uri() }}">
 
+    {# Honeypot field #}
+    {{ form.office_fax|safe }}
+
     {% if include_title and is_multi_newsletter_form %}
     <header class="mzp-c-newsletter-header">
       <h3 class="mzp-c-newsletter-title">{{ title|d(ftl('multi-newsletter-form-title'), true) }}</h3>

bedrock/newsletter/tests/test_forms.py

@@ -233,3 +233,41 @@ def test_multiple_newsletters(self):
         form = NewsletterFooterForm(spacey_newsletters, "en-US", data=data.copy())
         self.assertTrue(form.is_valid())
         self.assertEqual(form.cleaned_data["newsletters"], newsletters)
+
+    def test_honeypot_empty_valid(self):
+        """Honeypot field should be valid when empty"""
+        data = {
+            "email": "[email protected]",
+            "lang": "fr",
+            "privacy": True,
+            "newsletters": [self.newsletter_name],
+            "office_fax": "",  # honeypot field
+        }
+        form = NewsletterFooterForm(self.newsletter_name, locale="en-US", data=data.copy())
+        self.assertTrue(form.is_valid(), form.errors)
+
+    def test_honeypot_filled_invalid(self):
+        """Honeypot field should be invalid when filled"""
+        data = {
+            "email": "[email protected]",
+            "lang": "fr",
+            "privacy": True,
+            "newsletters": [self.newsletter_name],
+            "office_fax": "some value",  # honeypot field
+        }
+        form = NewsletterFooterForm(self.newsletter_name, locale="en-US", data=data.copy())
+        self.assertFalse(form.is_valid())
+        self.assertIn("office_fax", form.errors)
+
+    def test_honeypot_whitespace_invalid(self):
+        """Honeypot field should be invalid when filled with whitespace only"""
+        data = {
+            "email": "[email protected]",
+            "lang": "fr",
+            "privacy": True,
+            "newsletters": [self.newsletter_name],
+            "office_fax": "   ",  # honeypot field
+        }
+        form = NewsletterFooterForm(self.newsletter_name, locale="en-US", data=data.copy())
+        self.assertFalse(form.is_valid())
+        self.assertIn("office_fax", form.errors)

bedrock/newsletter/views.py

@@ -262,6 +262,9 @@ def newsletter_subscribe(request):
                 errors.append(ftl("newsletter-form-please-enter-a-valid"))
             if "privacy" in form.errors:
                 errors.append(ftl("newsletter-form-you-must-agree-to"))
+            if "office_fax" in form.errors:
+                # Honeypot field was filled
+                errors.append(ftl("newsletter-form-we-are-sorry-but-there"))
             for fieldname in ("newsletters", "lang", "country"):
                 if fieldname in form.errors:
                     errors.extend(form.errors[fieldname])

media/css/protocol/components/newsletter-form.scss

@@ -43,3 +43,25 @@ $image-path: '/media/protocol/img';
 }
 
 /* stylelint-enable declaration-no-important */
+
+// Honeypot field styling - hide from users but keep accessible to bots
+.super-priority-field {
+    position: absolute !important;
+    left: -9999px !important;
+    top: -9999px !important;
+    width: 1px !important;
+    height: 1px !important;
+    overflow: hidden !important;
+    opacity: 0 !important;
+    pointer-events: none !important;
+
+    // Ensure it's not in tab order
+    input {
+        tab-index: -1 !important;
+    }
+
+    // Hide from screen readers
+    label {
+        display: none !important;
+    }
+}