From fd54eeaeb7552f547d3e20a5c8650cab04e6b6b2 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Sat, 20 Feb 2016 14:11:33 +0000
Subject: [PATCH] Inline images in CSS
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Because this commit’s parent added a few new images, we are now serving at
least a handful of images, therefore a few additional HTTP requests. It’s better
to combine multiple HTTP requests into one for performance reasons (up to a
point).

This commit adds an extra step to the preprocessing of SASS files which takes
any images it finds, base64 encodes them and inlines them into the distributed
CSS files.

It also modifies the content security policy to allow inline images.
---
 app/__init__.py                      | 2 +-
 gulpfile.babel.js                    | 1 +
 package.json                         | 1 +
 tests/app/main/views/test_headers.py | 2 +-
 4 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/__init__.py b/app/__init__.py
index 281cc747e..cf4529634 100644
--- a/app/__init__.py
+++ b/app/__init__.py
@@ -155,7 +155,7 @@ def useful_headers_after_request(response):
     response.headers.add('X-Content-Type-Options', 'nosniff')
     response.headers.add('X-XSS-Protection', '1; mode=block')
     response.headers.add('Content-Security-Policy',
-                         "default-src 'self' 'unsafe-inline'; font-src 'self' data:;")  # noqa
+                         "default-src 'self' 'unsafe-inline'; font-src 'self' data:; img-src 'self' data:;")  # noqa
     if 'Cache-Control' in response.headers:
         del response.headers['Cache-Control']
     response.headers.add(
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
index 3938b00a8..273ad7801 100644
--- a/gulpfile.babel.js
+++ b/gulpfile.babel.js
@@ -62,6 +62,7 @@ gulp.task('sass', () => gulp
       paths.npm + 'govuk_frontend_toolkit/stylesheets/'
     ]
   }))
+  .pipe(plugins.base64({baseDir: 'app', debug: true}))
   .pipe(gulp.dest(paths.dist + '/stylesheets'))
 );
 
diff --git a/package.json b/package.json
index add7e8f76..fdc1d7edf 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "gulp": "3.9.0",
     "gulp-add-src": "0.2.0",
     "gulp-babel": "6.1.1",
+    "gulp-base64": "0.1.3",
     "gulp-concat": "2.6.0",
     "gulp-include": "2.1.0",
     "gulp-jquery": "1.1.1",
diff --git a/tests/app/main/views/test_headers.py b/tests/app/main/views/test_headers.py
index 4fd7148fb..bf6303f25 100644
--- a/tests/app/main/views/test_headers.py
+++ b/tests/app/main/views/test_headers.py
@@ -6,4 +6,4 @@ def test_owasp_useful_headers_set(app_):
     assert response.headers['X-Frame-Options'] == 'deny'
     assert response.headers['X-Content-Type-Options'] == 'nosniff'
     assert response.headers['X-XSS-Protection'] == '1; mode=block'
-    assert response.headers['Content-Security-Policy'] == "default-src 'self' 'unsafe-inline'; font-src 'self' data:;"  # noqa
+    assert response.headers['Content-Security-Policy'] == "default-src 'self' 'unsafe-inline'; font-src 'self' data:; img-src 'self' data:;"  # noqa