Merge pull request #2903 from alphagov/update-node-version

Update node version

.babelrc

@@ -1,3 +0,0 @@
-{
-  "presets": ["es2015"]
-}

README.md

@@ -22,19 +22,19 @@ Brew is a package manager for OSX. The following command installs brew:
 
 Languages needed
 - Python 3.4
-- [Node](https://nodejs.org/) 5.0.0 or greater
+- [Node](https://nodejs.org/) 10.15.3 or greater
-- [npm](https://www.npmjs.com/) 3.0.0 or greater
+- [npm](https://www.npmjs.com/) 6.4.1 or greater
 ```shell
     brew install node
 ```
 
 
 [NPM](npmjs.org) is Node's package management tool. `n` is a tool for managing
-different versions of Node. The following installs `n` and uses the latest
+different versions of Node. The following installs `n` and uses the long term support (LTS)
 version of Node.
 ```shell
     npm install -g n
-    n latest
+    n lts
     npm rebuild node-sass
 ```
 

app/assets/javascripts/updateContent.js

@@ -2,7 +2,7 @@
   "use strict";
 
   var queues = {};
-  var dd = new diffDOM();
+  var dd = new diffDOM.DiffDOM();
 
   var getRenderer = $component => response => dd.apply(
     $component.get(0),

app/assets/stylesheets/_url-helpers.scss

@@ -0,0 +1,14 @@
+// Copy of _url-helpers.scss in govuk_frontend_toolkit
+// to allow us to use gulp-base64-inline on all our images
+// gulp-base64-inline requires you to specify which of your
+// images you want encoded by using the `inline()` function
+// see https://github.com/goschevski/gulp-base64-inline
+@function file-url($file) {
+  $url: '';
+  @if $path {
+    $url: inline($path + $file);
+  } @else {
+    $url: image-url($file);
+  }
+  @return $url;
+}

app/assets/stylesheets/components/vendor/previous-next-navigation.scss

@@ -4,8 +4,6 @@ https://github.com/alphagov/static/blob/3d93a762b9d7af54615c77ae3e479131c03b8175
 and
 https://github.com/alphagov/static/blob/da8aeeaa749093eab30286d7fc9f965533b66f47/app/assets/stylesheets/styleguide/_conditionals2.scss
 */
-@import "_colours.scss";
-@import "_typography.scss";
 
 // Media query helpers. These make producing IE layouts
 // super easy.

app/assets/stylesheets/main.scss

@@ -11,9 +11,11 @@ $path: '/static/images/';
 @import 'typography';
 @import 'grid_layout';
 @import 'helpers';
-@import 'url-helpers';
 @import 'design-patterns/buttons';
 
+// Dependencies from GOVU.UK Frontend Toolkit, rewritten for this application
+@import 'url-helpers';
+
 // Dependencies from GOV.UK Elements
 // https://github.com/alphagov/govuk_elements
 @import 'elements/helpers';

docker/Dockerfile

@@ -6,7 +6,7 @@ ARG NO_PROXY
 
 ENV PYTHONUNBUFFERED=1 \
 	DEBIAN_FRONTEND=noninteractive \
-	NODEJS_VERSION=6.3.1-1nodesource1~jessie1 \
+	NODEJS_VERSION=10.x \
 	GOSU_VERSION=1.10
 
 RUN \
@@ -42,8 +42,8 @@ RUN \
 
 	&& echo "Install nodejs" \
 	&& cd /tmp \
-	&& curl -x "$HTTP_PROXY" -sSLO https://deb.nodesource.com/node_6.x/pool/main/n/nodejs/nodejs_${NODEJS_VERSION}_amd64.deb \
+	&& curl -x "$HTTP_PROXY" -sL https://deb.nodesource.com/setup_${NODEJS_VERSION} | bash - \
-	&& dpkg -i /tmp/nodejs_${NODEJS_VERSION}_amd64.deb \
+	&& apt-get install -y --no-install-recommends nodejs \
 
 	&& echo "Clean up" \
 	&& rm -rf /var/lib/apt/lists/* /tmp/*

gulpfile.babel.js

@@ -1,182 +0,0 @@
-// GULPFILE
-// - - - - - - - - - - - - - - -
-// This file processes all of the assets in the "src" folder
-// and outputs the finished files in the "dist" folder.
-
-// 1. LIBRARIES
-// - - - - - - - - - - - - - - -
-import gulp from 'gulp';
-import loadPlugins from 'gulp-load-plugins';
-import stylish from 'jshint-stylish';
-import runSequence from 'run-sequence';
-
-const plugins = loadPlugins(),
-
-// 2. CONFIGURATION
-// - - - - - - - - - - - - - - -
-    paths = {
-        src: 'app/assets/',
-        dist: 'app/static/',
-        templates: 'app/templates/',
-        npm: 'node_modules/',
-        template: 'node_modules/govuk_template_jinja/',
-        toolkit: 'node_modules/govuk_frontend_toolkit/'
-    };
-
-// 3. TASKS
-// - - - - - - - - - - - - - - -
-
-// Move GOV.UK template resources
-
-gulp.task('copy:govuk_template:template', () => gulp.src(paths.template + 'views/layouts/govuk_template.html')
-  .pipe(gulp.dest(paths.templates))
-);
-
-gulp.task('copy:govuk_template:css', () => gulp.src(paths.template + 'assets/stylesheets/**/*.css')
-  .pipe(plugins.sass({
-    outputStyle: 'compressed'
-  }))
-  .on('error', plugins.sass.logError)
-  .pipe(plugins.cssUrlAdjuster({
-    prependRelative: process.env.NOTIFY_ENVIRONMENT == 'development' ? '/static/' : '/',
-  }))
-  .pipe(gulp.dest(paths.dist + 'stylesheets/'))
-);
-
-gulp.task('copy:govuk_template:js', () => gulp.src(paths.template + 'assets/javascripts/**/*.js')
-  .pipe(plugins.uglify())
-  .pipe(gulp.dest(paths.dist + 'javascripts/'))
-);
-
-gulp.task('copy:govuk_template:images', () => gulp.src(paths.template + 'assets/stylesheets/images/**/*')
-  .pipe(gulp.dest(paths.dist + 'images/'))
-);
-
-gulp.task('copy:govuk_template:fonts', () => gulp.src(paths.template + 'assets/stylesheets/fonts/**/*')
-  .pipe(gulp.dest(paths.dist + 'fonts/'))
-);
-
-gulp.task('javascripts', () => gulp
-  .src([
-    paths.toolkit + 'javascripts/govuk/modules.js',
-    paths.toolkit + 'javascripts/govuk/show-hide-content.js',
-    paths.src + 'javascripts/stick-to-window-when-scrolling.js',
-    paths.src + 'javascripts/detailsPolyfill.js',
-    paths.src + 'javascripts/apiKey.js',
-    paths.src + 'javascripts/autofocus.js',
-    paths.src + 'javascripts/highlightTags.js',
-    paths.src + 'javascripts/fileUpload.js',
-    paths.src + 'javascripts/expandCollapse.js',
-    paths.src + 'javascripts/radioSelect.js',
-    paths.src + 'javascripts/updateContent.js',
-    paths.src + 'javascripts/listEntry.js',
-    paths.src + 'javascripts/liveSearch.js',
-    paths.src + 'javascripts/errorTracking.js',
-    paths.src + 'javascripts/preventDuplicateFormSubmissions.js',
-    paths.src + 'javascripts/fullscreenTable.js',
-    paths.src + 'javascripts/previewPane.js',
-    paths.src + 'javascripts/colourPreview.js',
-    paths.src + 'javascripts/templateFolderForm.js',
-    paths.src + 'javascripts/main.js'
-  ])
-  .pipe(plugins.prettyerror())
-  .pipe(plugins.babel({
-    presets: ['es2015']
-  }))
-  .pipe(plugins.addSrc.prepend([
-    paths.npm + 'hogan.js/dist/hogan-3.0.2.js',
-    paths.npm + 'jquery/dist/jquery.min.js',
-    paths.npm + 'query-command-supported/dist/queryCommandSupported.min.js',
-    paths.npm + 'diff-dom/diffDOM.js',
-    paths.npm + 'timeago/jquery.timeago.js',
-    paths.npm + 'textarea-caret/index.js'
-  ]))
-  .pipe(plugins.uglify())
-  .pipe(plugins.concat('all.js'))
-  .pipe(gulp.dest(paths.dist + 'javascripts/'))
-);
-
-gulp.task('sass', () => gulp
-  .src(paths.src + '/stylesheets/main*.scss')
-  .pipe(plugins.prettyerror())
-  .pipe(plugins.sass({
-    outputStyle: 'compressed',
-    includePaths: [
-      paths.npm + 'govuk-elements-sass/public/sass/',
-      paths.toolkit + 'stylesheets/'
-    ]
-  }))
-  .pipe(plugins.base64({baseDir: 'app'}))
-  .pipe(gulp.dest(paths.dist + 'stylesheets/'))
-);
-
-
-// Copy images
-
-gulp.task('images', () => gulp
-  .src([
-    paths.src + 'images/**/*',
-    paths.toolkit + 'images/**/*',
-    paths.template + 'assets/images/**/*'
-  ])
-  .pipe(gulp.dest(paths.dist + 'images/'))
-);
-
-gulp.task('copy:govuk_template:error_page', () => gulp.src(paths.src + 'error_pages/**/*')
-  .pipe(gulp.dest(paths.dist + 'error_pages/'))
-);
-
-
-// Watch for changes and re-run tasks
-gulp.task('watchForChanges', function() {
-  gulp.watch(paths.src + 'javascripts/**/*', ['javascripts']);
-  gulp.watch(paths.src + 'stylesheets/**/*', ['sass']);
-  gulp.watch(paths.src + 'images/**/*', ['images']);
-  gulp.watch('gulpfile.babel.js', ['default']);
-});
-
-gulp.task('lint:sass', () => gulp
-  .src([
-    paths.src + 'stylesheets/*.scss',
-    paths.src + 'stylesheets/components/*.scss',
-    paths.src + 'stylesheets/views/*.scss',
-  ])
-    .pipe(plugins.sassLint())
-    .pipe(plugins.sassLint.format(stylish))
-    .pipe(plugins.sassLint.failOnError())
-);
-
-gulp.task('lint:js', () => gulp
-  .src(paths.src + 'javascripts/**/*.js')
-    .pipe(plugins.jshint())
-    .pipe(plugins.jshint.reporter(stylish))
-    .pipe(plugins.jshint.reporter('fail'))
-);
-
-gulp.task('lint',
-  ['lint:sass', 'lint:js']
-);
-
-// Default: compile everything
-gulp.task('default', function() {
-  runSequence(
-    [
-      'copy:govuk_template:template',
-      'copy:govuk_template:images',
-      'copy:govuk_template:fonts',
-      'copy:govuk_template:css',
-      'copy:govuk_template:js',
-      'images',
-    ],
-    [
-      'copy:govuk_template:error_page',
-      'javascripts',
-      'sass'
-    ]
-  );
-});
-
-// Optional: recompile on changes
-gulp.task('watch',
-    ['default', 'watchForChanges']
-);

gulpfile.js

@@ -0,0 +1,196 @@
+// GULPFILE
+// - - - - - - - - - - - - - - -
+// This file processes all of the assets in the "src" folder
+// and outputs the finished files in the "dist" folder.
+
+// 1. LIBRARIES
+// - - - - - - - - - - - - - - -
+const { src, pipe, dest, series, parallel } = require('gulp');
+const stylish = require('jshint-stylish');
+
+const plugins = {};
+plugins.addSrc = require('gulp-add-src');
+plugins.babel = require('gulp-babel');
+plugins.base64 = require('gulp-base64-inline');
+plugins.concat = require('gulp-concat');
+plugins.cssUrlAdjuster = require('gulp-css-url-adjuster');
+plugins.jshint = require('gulp-jshint');
+plugins.prettyerror = require('gulp-prettyerror');
+plugins.sass = require('gulp-sass');
+plugins.sassLint = require('gulp-sass-lint');
+plugins.uglify = require('gulp-uglify');
+
+// 2. CONFIGURATION
+// - - - - - - - - - - - - - - -
+const paths = {
+  src: 'app/assets/',
+  dist: 'app/static/',
+  templates: 'app/templates/',
+  npm: 'node_modules/',
+  template: 'node_modules/govuk_template_jinja/',
+  toolkit: 'node_modules/govuk_frontend_toolkit/'
+};
+
+// 3. TASKS
+// - - - - - - - - - - - - - - -
+
+// Move GOV.UK template resources
+
+const copy = {
+  govuk_template: {
+    template: () => {
+      return src(paths.template + 'views/layouts/govuk_template.html')
+       .pipe(dest(paths.templates));
+    },
+    css: () => {
+      return src(paths.template + 'assets/stylesheets/**/*.css')
+        .pipe(plugins.sass({
+          outputStyle: 'compressed'
+        }))
+        .on('error', plugins.sass.logError)
+        .pipe(plugins.cssUrlAdjuster({
+          prependRelative: process.env.NOTIFY_ENVIRONMENT == 'development' ? '/static/' : '/',
+        }))
+        .pipe(dest(paths.dist + 'stylesheets/'));
+    },
+    js: () => {
+      return src(paths.template + 'assets/javascripts/**/*.js')
+        .pipe(plugins.uglify())
+        .pipe(dest(paths.dist + 'javascripts/'));
+    },
+    images: () => {
+      return src(paths.template + 'assets/stylesheets/images/**/*')
+        .pipe(dest(paths.dist + 'images/'));
+    },
+    fonts: () => {
+      return src(paths.template + 'assets/stylesheets/fonts/**/*')
+        .pipe(dest(paths.dist + 'fonts/'));
+    },
+    error_page: () => {
+      return src(paths.src + 'error_pages/**/*')
+        .pipe(dest(paths.dist + 'error_pages/'))
+    }
+  }
+};
+
+
+const javascripts = () => {
+  return src([
+      paths.toolkit + 'javascripts/govuk/modules.js',
+      paths.toolkit + 'javascripts/govuk/show-hide-content.js',
+      paths.src + 'javascripts/stick-to-window-when-scrolling.js',
+      paths.src + 'javascripts/detailsPolyfill.js',
+      paths.src + 'javascripts/apiKey.js',
+      paths.src + 'javascripts/autofocus.js',
+      paths.src + 'javascripts/highlightTags.js',
+      paths.src + 'javascripts/fileUpload.js',
+      paths.src + 'javascripts/expandCollapse.js',
+      paths.src + 'javascripts/radioSelect.js',
+      paths.src + 'javascripts/updateContent.js',
+      paths.src + 'javascripts/listEntry.js',
+      paths.src + 'javascripts/liveSearch.js',
+      paths.src + 'javascripts/errorTracking.js',
+      paths.src + 'javascripts/preventDuplicateFormSubmissions.js',
+      paths.src + 'javascripts/fullscreenTable.js',
+      paths.src + 'javascripts/previewPane.js',
+      paths.src + 'javascripts/colourPreview.js',
+      paths.src + 'javascripts/templateFolderForm.js',
+      paths.src + 'javascripts/main.js'
+    ])
+    .pipe(plugins.prettyerror())
+    .pipe(plugins.babel({
+      presets: ['@babel/preset-env']
+    }))
+    .pipe(plugins.addSrc.prepend([
+      paths.npm + 'hogan.js/dist/hogan-3.0.2.js',
+      paths.npm + 'jquery/dist/jquery.min.js',
+      paths.npm + 'query-command-supported/dist/queryCommandSupported.min.js',
+      paths.npm + 'diff-dom/browser/diffDOM.js',
+      paths.npm + 'timeago/jquery.timeago.js',
+      paths.npm + 'textarea-caret/index.js'
+    ]))
+    .pipe(plugins.uglify())
+    .pipe(plugins.concat('all.js'))
+    .pipe(dest(paths.dist + 'javascripts/'))
+};
+
+
+const sass = () => {
+  return src(paths.src + '/stylesheets/main*.scss')
+    .pipe(plugins.prettyerror())
+    .pipe(plugins.sass({
+      outputStyle: 'compressed',
+      includePaths: [
+        paths.npm + 'govuk-elements-sass/public/sass/',
+        paths.toolkit + 'stylesheets/'
+      ]
+    }))
+    .pipe(plugins.base64('../..'))
+    .pipe(dest(paths.dist + 'stylesheets/'))
+};
+
+
+// Copy images
+
+const images = () => {
+  return src([
+      paths.src + 'images/**/*',
+      paths.toolkit + 'images/**/*',
+      paths.template + 'assets/images/**/*'
+    ])
+    .pipe(dest(paths.dist + 'images/'))
+};
+
+
+// Watch for changes and re-run tasks
+const watchForChanges = () => {
+  return watch(paths.src + 'javascripts/**/*', ['javascripts'])
+    .watch(paths.src + 'stylesheets/**/*', ['sass'])
+    .watch(paths.src + 'images/**/*', ['images'])
+    .watch('gulpfile.js', ['default']);
+};
+
+const lint = {
+  'sass': () => {
+    return src([
+        paths.src + 'stylesheets/*.scss',
+        paths.src + 'stylesheets/components/*.scss',
+        paths.src + 'stylesheets/views/*.scss',
+      ])
+      .pipe(plugins.sassLint({
+        'options': { 'formatter': 'stylish' }
+      }))
+      .pipe(plugins.sassLint.format())
+      .pipe(plugins.sassLint.failOnError());
+  },
+  'js': (cb) => {
+    return src(paths.src + 'javascripts/**/*.js')
+      .pipe(plugins.jshint())
+      .pipe(plugins.jshint.reporter(stylish))
+      .pipe(plugins.jshint.reporter('fail'))
+  }
+};
+
+// Default: compile everything
+const defaultTask = parallel(
+  series(
+    copy.govuk_template.template,
+    copy.govuk_template.images,
+    copy.govuk_template.fonts,
+    copy.govuk_template.css,
+    copy.govuk_template.js,
+    images
+  ),
+  series(
+    copy.govuk_template.error_page,
+    javascripts,
+    sass
+  )
+);
+
+exports.default = defaultTask;
+
+exports.lint = series(lint.sass, lint.js);
+
+// Optional: recompile on changes
+exports.watch = series(defaultTask, watchForChanges);

package.json

@@ -3,7 +3,7 @@
   "version": "0.0.1",
   "description": "Admin front end for GOV.UK Notify",
   "engines": {
-    "node": "5.0.0"
+    "node": "10.15.3"
   },
   "scripts": {
     "test": "gulp lint",
@@ -18,34 +18,35 @@
   "license": "MIT",
   "homepage": "https://github.com/alphagov/notifications-admin#readme",
   "dependencies": {
-    "babel-core": "6.26.0",
+    "@babel/core": "7.4.0",
-    "babel-preset-es2015": "6.24.1",
+    "@babel/preset-env": "7.4.2",
-    "diff-dom": "2.3.1",
+    "diff-dom": "https://github.com/fiduswriter/diffDOM/archive/v3.1.0.tar.gz",
-    "govuk-elements-sass": "3.1.2",
+    "govuk-elements-sass": "3.1.3",
-    "govuk_frontend_toolkit": "7.2.0",
+    "govuk_frontend_toolkit": "8.1.0",
-    "govuk_template_jinja": "0.24.0",
+    "govuk_template_jinja": "0.24.1",
-    "gulp": "3.9.1",
+    "gulp": "4.0.0",
     "gulp-add-src": "1.0.0",
-    "gulp-babel": "7.0.0",
+    "gulp-babel": "8.0.0",
-    "gulp-base64": "0.1.3",
+    "gulp-base64-inline": "1.0.4",
     "gulp-concat": "2.6.1",
     "gulp-include": "2.3.1",
-    "gulp-load-plugins": "1.5.0",
+    "gulp-sass": "4.0.2",
-    "gulp-sass": "3.1.0",
+    "gulp-uglify": "3.0.2",
-    "gulp-uglify": "3.0.0",
     "hogan": "1.0.2",
     "jquery": "1.12.4",
     "query-command-supported": "1.0.0",
-    "textarea-caret": "^3.1.0",
+    "textarea-caret": "3.1.0",
-    "timeago": "1.6.1"
+    "timeago": "1.6.5"
   },
   "devDependencies": {
     "gulp-css-url-adjuster": "0.2.3",
     "gulp-jshint": "2.1.0",
     "gulp-prettyerror": "1.2.1",
-    "gulp-sass-lint": "1.2.0",
+    "gulp-sass-lint": "1.4.0",
-    "jshint": "2.9.5",
+    "jshint": "2.10.2",
-    "jshint-stylish": "2.2.1",
+    "jshint-stylish": "2.2.1"
-    "run-sequence": "2.2.1"
+  },
+  "peerDependencies": {
+    "rollup": "1.10.0"
   }
 }