Build prototype kit config to ./package

docs/contributing/tasks.md

@@ -35,6 +35,7 @@ npm scripts are defined in `package.json`. These trigger a number of Gulp tasks.
 - clean the `./package` folder
 - copy Sass files, applying Autoprefixer via PostCSS
 - copy Nunjucks component template/macro files, including JSON configs
+- copy GOV.UK Prototype Kit config files
 - copy JavaScript ESM source files
 - compile JavaScript ESM to CommonJS (`gulp js:compile`)
 - runs `npm run test:build:package` (which will test the output is correct)

gulpfile.js

@@ -12,6 +12,7 @@ require('./tasks/gulp/watch.js')
 
 // Node tasks
 const { updateDistAssetsVersion } = require('./tasks/asset-version.js')
+const { updatePrototypeKitConfig } = require('./tasks/prototype-kit-config.js')
 const { clean } = require('./tasks/clean.js')
 const { npmScriptTask } = require('./tasks/run.js')
 
@@ -73,7 +74,8 @@ gulp.task('dev', gulp.series(
 gulp.task('build:package', gulp.series(
   clean,
   'copy:files',
-  'js:compile'
+  'js:compile',
+  updatePrototypeKitConfig
 ))
 
 /**

src/govuk-prototype-kit/govuk-prototype-kit.config.mjs

@@ -1,21 +1,28 @@
+import { join, relative } from 'path'
 import slash from 'slash'
-import { getDirectories } from '../../lib/file-helper.js'
+
+import { filterPath, getDirectories, getListing } from '../../lib/file-helper.js'
 import { componentNameToMacroName } from '../../lib/helper-functions.js'
 import configPaths from '../../config/paths.js'
 
 /**
  * GOV.UK Prototype Kit config builder
  */
 export default async () => {
-  const componentsFiles = await getDirectories(configPaths.components)
+  const componentsFiles = await getListing(configPaths.components)
+  const componentNames = await getDirectories(configPaths.components)
 
   // Build array of macros
-  const nunjucksMacros = [...componentsFiles]
-    .map(([componentName, { entries }]) => {
-      const importFrom = slash(entries.get('macro.njk').path)
+  const nunjucksMacros = componentNames
+    .map((componentName) => {
+      const [macroPath] = componentsFiles
+        .filter(filterPath([`${componentName}/macro.njk`]))
+
+      // Relative path to src without 'govuk'
+      const rootPath = join(configPaths.src, '../')
 
       return {
-        importFrom: importFrom.replace(configPaths.src, 'govuk/'),
+        importFrom: slash(relative(rootPath, join(configPaths.components, macroPath))),
         macroName: componentNameToMacroName(componentName)
       }
     })

tasks/gulp/__tests__/after-build-package.test.js

@@ -35,6 +35,7 @@ describe('package/', () => {
       '!**/*.test.*',
       '!**/__snapshots__/',
       '!**/__snapshots__/**',
+      '!govuk-prototype-kit.config.mjs',
       '!govuk/README.md'
     ]
 
@@ -86,6 +87,29 @@ describe('package/', () => {
     })
   })
 
+  describe('GOV.UK Prototype Kit', () => {
+    let listingPackagePrototype
+
+    beforeAll(async () => {
+      listingPackagePrototype = await getListing(join(configPaths.package, 'govuk-prototype-kit'))
+    })
+
+    it('should have JSON config', () => {
+      expect(listingPackage)
+        .toEqual(expect.arrayContaining(['govuk-prototype-kit.config.json']))
+    })
+
+    it('should have init.js', () => {
+      expect(listingPackagePrototype)
+        .toEqual(expect.arrayContaining(['init.js']))
+    })
+
+    it('should have init.scss', () => {
+      expect(listingPackagePrototype)
+        .toEqual(expect.arrayContaining(['init.scss']))
+    })
+  })
+
   describe('all.scss', () => {
     it('should compile without throwing an exception', async () => {
       const allScssFile = join(configPaths.package, 'govuk', 'all.scss')

tasks/prototype-kit-config.js

@@ -0,0 +1,49 @@
+const { copyFile, mkdir, writeFile } = require('fs/promises')
+const { EOL } = require('os')
+const { dirname, join } = require('path')
+const { cwd } = require('process')
+
+const { destination } = require('./task-arguments.js')
+
+/**
+ * Write GOV.UK Prototype Kit config
+ *
+ * @returns {Promise<void>}
+ */
+async function updatePrototypeKitConfig () {
+  const { default: configFn } = await import('../src/govuk-prototype-kit/govuk-prototype-kit.config.mjs')
+
+  // Files to copy
+  const copyFiles = [
+    join('govuk-prototype-kit', 'init.js'),
+    join('govuk-prototype-kit', 'init.scss')
+  ]
+
+  // Copy files to destination
+  const configTasks = copyFiles.map(async (file) => {
+    const fileSource = join(cwd(), 'src', file)
+    const fileTarget = join(cwd(), destination, file)
+
+    // Create destination directory
+    await mkdir(dirname(fileTarget), { recursive: true })
+
+    // Copy file to destination
+    return copyFile(fileSource, fileTarget)
+  })
+
+  // JSON config file path + contents
+  const configPath = join(destination, 'govuk-prototype-kit.config.json')
+  const configJSON = JSON.stringify(await configFn(), null, 2) + EOL
+
+  // Write JSON config file
+  configTasks.push(writeFile(configPath, configJSON))
+
+  // Resolve on completion
+  return Promise.all(configTasks)
+}
+
+updatePrototypeKitConfig.displayName = 'update-prototype-kit-config'
+
+module.exports = {
+  updatePrototypeKitConfig
+}