Allow html in multi image upload errors

- fixes #6824

CHANGELOG.txt

@@ -17,6 +17,7 @@ Changelog
  * Simplify generic admin view templates plus ensure `page_title` and `page_subtitle` are used consistently (Matt Westcott)
  * Extend support for collapsing edit panels from just MultiFieldPanels to all kinds of panels (Fabien Le Frapper, Robbie Mackay)
  * Add object count to header within modeladmin listing view (Jonathan "Yoni" Knoll)
+ * Add ability to return HTML in multiple image upload errors (Gordon Pendleton)
  * Fix: Delete button is now correct colour on snippets and modeladmin listings (Brandon Murch)
  * Fix: Ensure that StreamBlock / ListBlock-level validation errors are counted towards error counts (Matt Westcott)
  * Fix: InlinePanel add button is now keyboard navigatable (Jesse Menn)

docs/releases/2.15.rst

@@ -28,6 +28,7 @@ Other features
  * Simplify generic admin view templates plus ensure ``page_title`` and ``page_subtitle`` are used consistently (Matt Westcott)
  * Extend support for :ref:`collapsing edit panels <collapsible>` from just MultiFieldPanels to all kinds of panels (Fabien Le Frapper, Robbie Mackay)
  * Add object count to header within modeladmin listing view (Jonathan "Yoni" Knoll)
+ * Add ability to return HTML in multiple image upload errors (Gordon Pendleton)
 
 Bug fixes
 ~~~~~~~~~

wagtail/images/static_src/wagtailimages/js/add-multiple.js

@@ -59,7 +59,7 @@ $(function() {
                     data.context.each(function(index) {
                         var error = data.files[index].error;
                         if (error) {
-                            $(this).find('.error_messages').text(error);
+                            $(this).find('.error_messages').html(error);
                         }
                     });
                 }

wagtail/images/templates/wagtailimages/multiple/add.html

@@ -107,8 +107,8 @@
             accepted_file_types: /\.({{ allowed_extensions|join:"|" }})$/i, //must be regex
             max_file_size: {{ max_filesize|stringformat:"s"|default:"null" }}, //numeric format
             errormessages: {
-                max_file_size: "{{ error_max_file_size }}",
-                accepted_file_types: "{{ error_accepted_file_types }}"
+                max_file_size: "{{ error_max_file_size|escapejs }}",
+                accepted_file_types: "{{ error_accepted_file_types|escapejs }}"
             }
         }
         window.tagit_opts = {

wagtail/images/tests/test_admin_views.py

@@ -3,9 +3,13 @@ import json
 from django.contrib.auth.models import Group, Permission
 from django.core.files.uploadedfile import SimpleUploadedFile
 from django.template.defaultfilters import filesizeformat
-from django.test import TestCase, override_settings
+from django.template.loader import render_to_string
+from django.test import RequestFactory, TestCase, override_settings
 from django.urls import reverse
+from django.utils.encoding import force_str
+from django.utils.html import escapejs
 from django.utils.http import RFC3986_SUBDELIMS, urlquote
+from django.utils.safestring import mark_safe
 
 from wagtail.core.models import Collection, GroupCollectionPermission, get_root_collection_id
 from wagtail.images.models import UploadedImage
@@ -1296,7 +1300,7 @@ class TestMultipleImageUploader(TestCase, WagtailTestUtils):
     This tests the multiple image upload views located in wagtailimages/views/multiple.py
     """
     def setUp(self):
-        self.login()
+        self.user = self.login()
 
         # Create an image for running tests on
         self.image = Image.objects.create(
@@ -1329,6 +1333,54 @@ class TestMultipleImageUploader(TestCase, WagtailTestUtils):
             response.context['error_max_file_size'], "This file is too big. Maximum filesize 1000\xa0bytes."
         )
 
+    def test_add_error_max_file_size_escaped(self):
+        url = reverse('wagtailimages:add_multiple')
+        template_name = 'wagtailimages/multiple/add.html'
+        response = self.client.get(url)
+        self.assertEqual(response.status_code, 200)
+        self.assertTemplateUsed(response, template_name)
+
+        value = "Too big. <br/><br/><a href='/admin/images/add/'>Try this.</a>"
+        response_content = force_str(response.content)
+        self.assertNotIn(value, response_content)
+        self.assertNotIn(escapejs(value), response_content)
+
+        request = RequestFactory().get(url)
+        request.user = self.user
+        context = response.context_data.copy()
+        context['error_max_file_size'] = mark_safe(force_str(value))
+        data = render_to_string(
+            template_name,
+            context=context,
+            request=request,
+        )
+        self.assertNotIn(value, data)
+        self.assertIn(escapejs(value), data)
+
+    def test_add_error_accepted_file_types_escaped(self):
+        url = reverse('wagtailimages:add_multiple')
+        template_name = 'wagtailimages/multiple/add.html'
+        response = self.client.get(url)
+        self.assertEqual(response.status_code, 200)
+        self.assertTemplateUsed(response, template_name)
+
+        value = "Invalid image type. <a href='/help'>Get help.</a>"
+        response_content = force_str(response.content)
+        self.assertNotIn(value, response_content)
+        self.assertNotIn(escapejs(value), response_content)
+
+        request = RequestFactory().get(url)
+        request.user = self.user
+        context = response.context_data.copy()
+        context['error_accepted_file_types'] = mark_safe(force_str(value))
+        data = render_to_string(
+            template_name,
+            context=context,
+            request=request,
+        )
+        self.assertNotIn(value, data)
+        self.assertIn(escapejs(value), data)
+
     def test_add_post(self):
         """
         This tests that a POST request to the add view saves the image and returns an edit form