Track form validation errors in Google analytics

We started tracking upload errors in eb264f34b7

This has been useful.

This commit adds tracking of other form validation errors, so we can
pick up if there’s a form field that’s causing people particular
trouble.

Also had to rewrite a very old test to look for page content in a
smarter way.

app/templates/components/list-entry.html

@@ -18,7 +18,7 @@
             </span>
           {% endif %}
           {% if field.errors %}
-            <span class="error-message">
+            <span class="error-message" data-module="track-error" data-error-type="{{ field.errors[0][0] }}" data-error-label="{{ field.name }}">
               {{ field.errors[0][0] }}
             </span>
           {% endif %}

app/templates/components/radios.html

@@ -9,7 +9,7 @@
       <legend class="form-label">
         {{ field.label.text|safe }}
         {% if field.errors %}
-          <span class="error-message">
+          <span class="error-message" data-module="track-error" data-error-type="{{ field.errors[0] }}" data-error-label="{{ field.name }}">
             {{ field.errors[0] }}
           </span>
         {% endif %}
@@ -50,7 +50,7 @@
      <legend class="form-label">
        {{ field.label.text }}
        {% if field.errors %}
-         <span class="error-message">
+         <span class="error-message" data-module="track-error" data-error-type="{{ field.errors[0] }}" data-error-label="{{ field.name }}">
            {{ field.errors[0] }}
          </span>
        {% endif %}
@@ -89,7 +89,7 @@
           {{ field.label.text }}
         {% endif %}
         {% if field.errors %}
-            <span class="error-message">
+            <span class="error-message" data-module="track-error" data-error-type="{{ field.errors[0] }}" data-error-label="{{ field.name }}">
               {{ field.errors[0] }}
             </span>
         {% endif %}

app/templates/components/textbox.html

@@ -24,7 +24,7 @@
         </span>
       {% endif %}
       {% if field.errors %}
-        <span class="error-message">
+        <span class="error-message" data-module="track-error" data-error-type="{{ field.errors[0] }}" data-error-label="{{ field.name }}">
           {% if not safe_error_message %}{{ field.errors[0] }}{% else %}{{ field.errors[0]|safe }}{% endif %}
         </span>
       {% endif %}

tests/app/main/views/test_verify.py

@@ -4,6 +4,8 @@ import json
 from flask import url_for
 from bs4 import BeautifulSoup
 
+from tests.conftest import normalize_spaces
+
 
 def test_should_return_verify_template(
     client,
@@ -68,17 +70,23 @@ def test_should_activate_user_after_verify(
 
 
 def test_should_return_200_when_sms_code_is_wrong(
-    client,
+    client_request,
     api_user_active,
     mock_check_verify_code_code_not_found,
 ):
-    with client.session_transaction() as session:
+    with client_request.session_transaction() as session:
         session['user_details'] = {'email_address': api_user_active.email_address, 'id': api_user_active.id}
-    response = client.post(url_for('main.verify'),
-                           data={'sms_code': '12345'})
-    assert response.status_code == 200
-    resp_data = response.get_data(as_text=True)
-    assert resp_data.count('Code not found') == 1
+
+    page = client_request.post(
+        'main.verify',
+        _data={'sms_code': '12345'},
+        _expected_status=200,
+    )
+
+    assert len(page.select('.error-message')) == 1
+    assert normalize_spaces(page.select_one('.error-message').text) == (
+        'Code not found'
+    )
 
 
 def test_verify_email_redirects_to_verify_if_token_valid(