Compile GOV.UK Prototype Kit config to package top level

alphagov · May 12, 2023 · c37a3bf · c37a3bf
1 parent 693c35f
commit c37a3bf
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 56 deletions.
diff --git a/packages/govuk-frontend/.gitignore b/packages/govuk-frontend/.gitignore
@@ -0,0 +1 @@
+govuk-prototype-kit.config.json
diff --git a/packages/govuk-frontend/src/govuk-prototype-kit/govuk-prototype-kit.config.mjs b/packages/govuk-frontend/src/govuk-prototype-kit/govuk-prototype-kit.config.mjs
@@ -1,5 +1,3 @@
-import { join } from 'path'
-
 import { filterPath, getDirectories, getListing } from 'govuk-frontend-lib/files'
 import { componentNameToMacroName, packageNameToPath } from 'govuk-frontend-lib/names'
 import slash from 'slash'
@@ -10,35 +8,35 @@ import slash from 'slash'
  * @returns {Promise<PrototypeKitConfig>} GOV.UK Prototype Kit config
  */
 export default async () => {
-  const componentsFiles = await getListing(packageNameToPath('govuk-frontend', 'src/govuk/components'))
-  const componentNames = await getDirectories(packageNameToPath('govuk-frontend', 'src/govuk/components'))
+  const componentMacros = await getListing(packageNameToPath('govuk-frontend'), 'dist/govuk/components/**/macro.njk')
+  const componentNames = await getDirectories(packageNameToPath('govuk-frontend', 'dist/govuk/components'))
 
   // Build array of macros
   const nunjucksMacros = componentNames
     .map((componentName) => {
-      const [macroPath] = componentsFiles
+      const [macroPath = ''] = componentMacros
         .filter(filterPath([`**/${componentName}/macro.njk`]))
 
       return {
-        importFrom: slash(join('govuk/components', macroPath)),
+        importFrom: slash(macroPath),
         macroName: componentNameToMacroName(componentName)
       }
     })
 
   return {
     assets: [
-      '/govuk/assets',
-      '/govuk/all.js.map'
+      '/dist/govuk/assets',
+      '/dist/govuk/all.js.map'
     ],
     sass: [
-      '/govuk-prototype-kit/init.scss'
+      '/dist/govuk-prototype-kit/init.scss'
     ],
     scripts: [
-      '/govuk/all.js',
-      '/govuk-prototype-kit/init.js'
+      '/dist/govuk/all.js',
+      '/dist/govuk-prototype-kit/init.js'
     ],
     nunjucksMacros,
-    nunjucksPaths: ['/']
+    nunjucksPaths: ['/dist']
   }
 }
 

diff --git a/packages/govuk-frontend/src/govuk-prototype-kit/govuk-prototype-kit.config.unit.test.mjs b/packages/govuk-frontend/src/govuk-prototype-kit/govuk-prototype-kit.config.unit.test.mjs
@@ -10,156 +10,156 @@ describe('GOV.UK Prototype Kit config', () => {
 
   it('includes paths for assets, scripts, sass', () => {
     expect(config.assets).toEqual([
-      '/govuk/assets',
-      '/govuk/all.js.map'
+      '/dist/govuk/assets',
+      '/dist/govuk/all.js.map'
     ])
 
     expect(config.sass).toEqual([
-      '/govuk-prototype-kit/init.scss'
+      '/dist/govuk-prototype-kit/init.scss'
     ])
 
     expect(config.scripts).toEqual([
-      '/govuk/all.js',
-      '/govuk-prototype-kit/init.js'
+      '/dist/govuk/all.js',
+      '/dist/govuk-prototype-kit/init.js'
     ])
   })
 
   describe('Nunjucks', () => {
     it('includes macros list', () => {
       expect(config.nunjucksMacros).toEqual([
         {
-          importFrom: 'govuk/components/accordion/macro.njk',
+          importFrom: 'dist/govuk/components/accordion/macro.njk',
           macroName: 'govukAccordion'
         },
         {
-          importFrom: 'govuk/components/back-link/macro.njk',
+          importFrom: 'dist/govuk/components/back-link/macro.njk',
           macroName: 'govukBackLink'
         },
         {
-          importFrom: 'govuk/components/breadcrumbs/macro.njk',
+          importFrom: 'dist/govuk/components/breadcrumbs/macro.njk',
           macroName: 'govukBreadcrumbs'
         },
         {
-          importFrom: 'govuk/components/button/macro.njk',
+          importFrom: 'dist/govuk/components/button/macro.njk',
           macroName: 'govukButton'
         },
         {
-          importFrom: 'govuk/components/character-count/macro.njk',
+          importFrom: 'dist/govuk/components/character-count/macro.njk',
           macroName: 'govukCharacterCount'
         },
         {
-          importFrom: 'govuk/components/checkboxes/macro.njk',
+          importFrom: 'dist/govuk/components/checkboxes/macro.njk',
           macroName: 'govukCheckboxes'
         },
         {
-          importFrom: 'govuk/components/cookie-banner/macro.njk',
+          importFrom: 'dist/govuk/components/cookie-banner/macro.njk',
           macroName: 'govukCookieBanner'
         },
         {
-          importFrom: 'govuk/components/date-input/macro.njk',
+          importFrom: 'dist/govuk/components/date-input/macro.njk',
           macroName: 'govukDateInput'
         },
         {
-          importFrom: 'govuk/components/details/macro.njk',
+          importFrom: 'dist/govuk/components/details/macro.njk',
           macroName: 'govukDetails'
         },
         {
-          importFrom: 'govuk/components/error-message/macro.njk',
+          importFrom: 'dist/govuk/components/error-message/macro.njk',
           macroName: 'govukErrorMessage'
         },
         {
-          importFrom: 'govuk/components/error-summary/macro.njk',
+          importFrom: 'dist/govuk/components/error-summary/macro.njk',
           macroName: 'govukErrorSummary'
         },
         {
-          importFrom: 'govuk/components/fieldset/macro.njk',
+          importFrom: 'dist/govuk/components/fieldset/macro.njk',
           macroName: 'govukFieldset'
         },
         {
-          importFrom: 'govuk/components/file-upload/macro.njk',
+          importFrom: 'dist/govuk/components/file-upload/macro.njk',
           macroName: 'govukFileUpload'
         },
         {
-          importFrom: 'govuk/components/footer/macro.njk',
+          importFrom: 'dist/govuk/components/footer/macro.njk',
           macroName: 'govukFooter'
         },
         {
-          importFrom: 'govuk/components/header/macro.njk',
+          importFrom: 'dist/govuk/components/header/macro.njk',
           macroName: 'govukHeader'
         },
         {
-          importFrom: 'govuk/components/hint/macro.njk',
+          importFrom: 'dist/govuk/components/hint/macro.njk',
           macroName: 'govukHint'
         },
         {
-          importFrom: 'govuk/components/input/macro.njk',
+          importFrom: 'dist/govuk/components/input/macro.njk',
           macroName: 'govukInput'
         },
         {
-          importFrom: 'govuk/components/inset-text/macro.njk',
+          importFrom: 'dist/govuk/components/inset-text/macro.njk',
           macroName: 'govukInsetText'
         },
         {
-          importFrom: 'govuk/components/label/macro.njk',
+          importFrom: 'dist/govuk/components/label/macro.njk',
           macroName: 'govukLabel'
         },
         {
-          importFrom: 'govuk/components/notification-banner/macro.njk',
+          importFrom: 'dist/govuk/components/notification-banner/macro.njk',
           macroName: 'govukNotificationBanner'
         },
         {
-          importFrom: 'govuk/components/pagination/macro.njk',
+          importFrom: 'dist/govuk/components/pagination/macro.njk',
           macroName: 'govukPagination'
         },
         {
-          importFrom: 'govuk/components/panel/macro.njk',
+          importFrom: 'dist/govuk/components/panel/macro.njk',
           macroName: 'govukPanel'
         },
         {
-          importFrom: 'govuk/components/phase-banner/macro.njk',
+          importFrom: 'dist/govuk/components/phase-banner/macro.njk',
           macroName: 'govukPhaseBanner'
         },
         {
-          importFrom: 'govuk/components/radios/macro.njk',
+          importFrom: 'dist/govuk/components/radios/macro.njk',
           macroName: 'govukRadios'
         },
         {
-          importFrom: 'govuk/components/select/macro.njk',
+          importFrom: 'dist/govuk/components/select/macro.njk',
           macroName: 'govukSelect'
         },
         {
-          importFrom: 'govuk/components/skip-link/macro.njk',
+          importFrom: 'dist/govuk/components/skip-link/macro.njk',
           macroName: 'govukSkipLink'
         },
         {
-          importFrom: 'govuk/components/summary-list/macro.njk',
+          importFrom: 'dist/govuk/components/summary-list/macro.njk',
           macroName: 'govukSummaryList'
         },
         {
-          importFrom: 'govuk/components/table/macro.njk',
+          importFrom: 'dist/govuk/components/table/macro.njk',
           macroName: 'govukTable'
         },
         {
-          importFrom: 'govuk/components/tabs/macro.njk',
+          importFrom: 'dist/govuk/components/tabs/macro.njk',
           macroName: 'govukTabs'
         },
         {
-          importFrom: 'govuk/components/tag/macro.njk',
+          importFrom: 'dist/govuk/components/tag/macro.njk',
           macroName: 'govukTag'
         },
         {
-          importFrom: 'govuk/components/textarea/macro.njk',
+          importFrom: 'dist/govuk/components/textarea/macro.njk',
           macroName: 'govukTextarea'
         },
         {
-          importFrom: 'govuk/components/warning-text/macro.njk',
+          importFrom: 'dist/govuk/components/warning-text/macro.njk',
           macroName: 'govukWarningText'
         }
       ])
     })
 
     it('includes paths', () => {
-      expect(config.nunjucksPaths).toEqual(['/'])
+      expect(config.nunjucksPaths).toEqual(['/dist'])
     })
   })
 })
diff --git a/packages/govuk-frontend/tasks/build/package.test.mjs b/packages/govuk-frontend/tasks/build/package.test.mjs
@@ -44,10 +44,8 @@ describe('packages/govuk-frontend/dist/', () => {
     const listingExpected = listingSource
       .filter(filterPath(filterPatterns))
 
-      // Replaces GOV.UK Prototype kit config with JSON
-      .flatMap(mapPathTo(['**/govuk-prototype-kit.config.mjs'], ({ dir: requirePath, name }) => [
-        join(requirePath, '../', `${name}.json`)
-      ]))
+      // Removes GOV.UK Prototype kit config ()
+      .flatMap(mapPathTo(['**/govuk-prototype-kit.config.mjs'], () => []))
 
       // Replaces all source '*.mjs' files
       .flatMap(mapPathTo(['**/*.mjs'], ({ dir: requirePath, name }) => {
@@ -93,6 +91,7 @@ describe('packages/govuk-frontend/dist/', () => {
     // Check top level package contents
     expect(listingPackage).toEqual([
       'README.md',
+      'govuk-prototype-kit.config.json',
       'gulpfile.mjs',
       'package.json',
       'postcss.config.mjs',

diff --git a/packages/govuk-frontend/tasks/scripts.mjs b/packages/govuk-frontend/tasks/scripts.mjs
@@ -1,4 +1,4 @@
-import { join } from 'path'
+import { join, resolve } from 'path'
 
 import { configs, scripts, task } from 'govuk-frontend-tasks'
 import gulp from 'gulp'
@@ -39,7 +39,7 @@ export const compile = (options) => gulp.series(
   task.name("compile:js 'govuk-prototype-kit'", () =>
     configs.compile('govuk-prototype-kit.config.mjs', {
       srcPath: join(options.srcPath, 'govuk-prototype-kit'),
-      destPath: options.destPath,
+      destPath: resolve(options.destPath, '../'), // Top level (not dist) for compatibility
 
       filePath (file) {
         return join(file.dir, `${file.name}.json`)