Changeset b8ef4ab in OpenWorkouts-current

Timestamp:

Feb 19, 2019, 6:58:39 PM (5 years ago)

Author:

Borja Lopez <borja@…>

Branches:

current, feature/docs, master

Children:

42d775c

Parents:

07f5190

Message:

(#61) Better templates for "verify your account" emails:

• Send a multipart text/html email (instead text only)
• Added some styling to the html version of the email, based on our current login page styles.

Important: as the html version contains html code generated using
request.resource_url() and request.static_url(), when running in
development mode under ​http://localhost, the links to images
and css files in the rendered email point to localhost, so they
won't work outside the machine running openworkouts.

Location:

ow

Files:

• mail.py (modified) (1 diff)
• static/css/main.css (modified) (1 diff)
• static/less/main.less (modified) (1 diff)
• static/less/pages/verify_account.less (added)
• templates/mail_verify_account_html.pt (added)
• templates/mail_verify_account_txt.pt (moved) (moved from ow/templates/mail_verify_account.pt)
• tests/test_mail.py (modified) (2 diffs)

ow/mail.py

@@ -39 +39 @@
 def send_verification_email(request, user):
     subject = _('Welcome to OpenWorkouts')
-    template = 'ow:templates/mail_verify_account.pt'
+    txt_template = 'ow:templates/mail_verify_account_txt.pt'
+    html_template = 'ow:templates/mail_verify_account_html.pt'
     verify_link = request.resource_url(user, 'verify', user.verification_token)
     context = {'user': user, 'verify_link': verify_link}
     mailer = get_mailer(request)
-    body = render(template, context, request)
-    message = Message(subject=subject, recipients=[user.email], body=body)
+    txt_body = render(txt_template, context, request)
+    html_body = render(html_template, context, request)
+    message = Message(
+        subject=subject,
+        recipients=[user.email],
+        body=txt_body,
+        html=html_body
+    )
     message = idna_encode_recipients(message)
     mailer.send_to_queue(message)

ow/static/css/main.css

@@ -1486 +1486 @@
   font-size: 0.8125rem;
 }
+.verify-account-content {
+  background-position: center;
+  background-size: cover;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: calc(100vh - 98px);
+  padding: 1em 0;
+  color: #e1e1e1;
+}
+.verify-account-content .info {
+  max-width: 580px;
+  background-color: rgba(21, 21, 21, 0.6);
+  border-radius: 6px;
+  padding: 2em 1.5em;
+}
+.verify-account-content .info div {
+  margin-bottom: 1.5em;
+}
+.verify-account-content a {
+  color: #e1e1e1;
+  font-size: 13px;
+  text-decoration: none;
+  margin-right: 0.75em;
+}
+.verify-account-content a:hover {
+  color: white;
+}
+.verify-account-content .button {
+  transition: all 500ms ease-in-out;
+  background-color: #EE4056;
+  color: white;
+  text-transform: uppercase;
+}
+.verify-account-content .button:hover {
+  background-color: #e6152f;
+}

ow/static/less/main.less

@@ -32 +32 @@
 @import "pages/login.less";
 @import "pages/profile.less";
+@import "pages/verify_account.less";

ow/tests/test_mail.py

@@ -41 +41 @@
         message.recipients = ['user@example.net']
         m.return_value = message
-        body = Mock()
-        r.return_value = body
+
+        txt_body = Mock()
+        html_body = Mock()
+        r.side_effect = [txt_body, html_body]
+
         request = DummyRequest()
         request.root = root
@@ -49 +52 @@
         verify_link = request.resource_url(
             user, 'verify', user.verification_token)
-        r.assert_called_once_with(
-            'ow:templates/mail_verify_account.pt',
-            {'user': user, 'verify_link': verify_link},
-            request
-        )
+
+        # two render calls
+        assert r.call_count == 2
+
+        # first call renders the text version of the email
+        assert r.call_args_list[0][0][0] == (
+            'ow:templates/mail_verify_account_txt.pt')
+        assert r.call_args_list[0][0][1] == (
+            {'user': user, 'verify_link': verify_link})
+        assert r.call_args_list[0][0][2] == request
+
+        # second call renders the html version of the email
+        assert r.call_args_list[1][0][0] == (
+            'ow:templates/mail_verify_account_html.pt')
+        assert r.call_args_list[1][0][1] == (
+            {'user': user, 'verify_link': verify_link})
+        assert r.call_args_list[1][0][2] == request
+
         m.assert_called_once
         m.call_args_list[0][1]['recipients'] == user.email
-        m.call_args_list[0][1]['body'] == body
+        m.call_args_list[0][1]['body'] == txt_body
+        m.call_args_list[0][1]['html'] == html_body
         mailer.send_to_queue.assert_called_once_with(message)