Allow globs in paths for getListing() and getDirectories()

First step in making our directory listings work with `govuk-frontend@4` again

For example using `**/govuk` instead of hard coding `src/govuk`

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

@@ -8,7 +8,10 @@ import slash from 'slash'
  * @returns {Promise<PrototypeKitConfig>} GOV.UK Prototype Kit config
  */
 export default async () => {
-  const componentMacros = await getListing(packageNameToPath('govuk-frontend', 'src'), '**/components/**/macro.njk')
+  const srcPath = packageNameToPath('govuk-frontend', 'src')
+
+  // Locate component macros
+  const componentMacros = await getListing('**/components/**/macro.njk', { cwd: srcPath })
   const componentNames = await getComponentNames()
 
   // Build array of macros

packages/govuk-frontend/src/govuk/components/components.test.js

@@ -8,7 +8,8 @@ describe('Components', () => {
   let sassFiles
 
   beforeAll(async () => {
-    sassFiles = await getListing(join(paths.package, 'src/govuk/components'), '**/*.scss', {
+    sassFiles = await getListing('**/src/govuk/components/**/*.scss', {
+      cwd: paths.package,
       ignore: [
         '**/_all.scss',
         '**/_index.scss'
@@ -28,7 +29,7 @@ describe('Components', () => {
 
     it('renders CSS for each component', () => {
       const sassTasks = sassFiles.map((sassFilePath) => {
-        const file = join(paths.package, 'src/govuk/components', sassFilePath)
+        const file = join(paths.package, sassFilePath)
 
         return expect(compileSassFile(file)).resolves.toMatchObject({
           css: expect.any(String),

packages/govuk-frontend/src/govuk/helpers/helpers.test.js

@@ -9,7 +9,8 @@ describe('The helpers layer', () => {
   let sassFiles
 
   beforeAll(async () => {
-    sassFiles = await getListing(paths.package, 'src/govuk/helpers/**/*.scss', {
+    sassFiles = await getListing('**/src/govuk/helpers/**/*.scss', {
+      cwd: paths.package,
       ignore: ['**/_all.scss']
     })
   })

packages/govuk-frontend/src/govuk/objects/objects.test.js

@@ -9,7 +9,8 @@ describe('The objects layer', () => {
   let sassFiles
 
   beforeAll(async () => {
-    sassFiles = await getListing(paths.package, 'src/govuk/objects/**/*.scss', {
+    sassFiles = await getListing('**/src/govuk/objects/**/*.scss', {
+      cwd: paths.package,
       ignore: ['**/_all.scss']
     })
   })

packages/govuk-frontend/src/govuk/settings/settings.test.js

@@ -9,7 +9,8 @@ describe('The settings layer', () => {
   let sassFiles
 
   beforeAll(async () => {
-    sassFiles = await getListing(paths.package, 'src/govuk/settings/**/*.scss', {
+    sassFiles = await getListing('**/src/govuk/settings/**/*.scss', {
+      cwd: paths.package,
       ignore: ['**/_all.scss']
     })
   })

packages/govuk-frontend/src/govuk/tools/tools.test.js

@@ -9,7 +9,8 @@ describe('The tools layer', () => {
   let sassFiles
 
   beforeAll(async () => {
-    sassFiles = await getListing(paths.package, 'src/govuk/tools/**/*.scss', {
+    sassFiles = await getListing('**/src/govuk/tools/**/*.scss', {
+      cwd: paths.package,
       ignore: ['**/_all.scss']
     })
   })

packages/govuk-frontend/tasks/build/package.test.mjs

@@ -18,13 +18,29 @@ describe('packages/govuk-frontend/dist/', () => {
   let componentNames
 
   beforeAll(async () => {
-    listingPackage = await getListing(paths.package, '*')
-    listingSource = await getListing(join(paths.package, 'src'))
-    listingDist = await getListing(join(paths.package, 'dist'))
+    listingPackage = await getListing('*', {
+      cwd: paths.package
+    })
+
+    listingSource = await getListing('**/*', {
+      cwd: join(paths.package, 'src')
+    })
+
+    listingDist = await getListing('**/*', {
+      cwd: join(paths.package, 'dist')
+    })
 
-    componentsFilesSource = await getListing(join(paths.package, 'src/govuk/components'))
-    componentsFilesDist = await getListing(join(paths.package, 'dist/govuk/components'))
-    componentsFilesDistESM = await getListing(join(paths.package, 'dist/govuk-esm/components'))
+    componentsFilesSource = await getListing('**/*', {
+      cwd: join(paths.package, 'src/govuk/components')
+    })
+
+    componentsFilesDist = await getListing('**/*', {
+      cwd: join(paths.package, 'dist/govuk/components')
+    })
+
+    componentsFilesDistESM = await getListing('**/*', {
+      cwd: join(paths.package, 'dist/govuk-esm/components')
+    })
 
     // Components list
     componentNames = await getComponentNames()

packages/govuk-frontend/tasks/build/release.test.mjs

@@ -10,8 +10,13 @@ describe('dist/', () => {
   let listingDistAssets
 
   beforeAll(async () => {
-    listingSourceAssets = await getListing(join(paths.package, 'src/govuk/assets'))
-    listingDistAssets = await getListing(join(paths.root, 'dist/assets'))
+    listingSourceAssets = await getListing('**/*', {
+      cwd: join(paths.package, 'src/govuk/assets')
+    })
+
+    listingDistAssets = await getListing('**/*', {
+      cwd: join(paths.root, 'dist/assets')
+    })
   })
 
   describe('assets/', () => {

shared/lib/files.js

@@ -1,7 +1,8 @@
 const { readFile } = require('fs/promises')
-const { join, parse, relative } = require('path')
+const { join, parse, relative, basename } = require('path')
 
 const { glob } = require('glob')
+const { paths } = require('govuk-frontend-config')
 const yaml = require('js-yaml')
 const { minimatch } = require('minimatch')
 
@@ -10,33 +11,37 @@ const { packageNameToPath } = require('./names')
 /**
  * Directory listing for path
  *
- * @param {string} directoryPath - Path to directory
- * @param {string} [pattern] - Minimatch pattern
+ * @param {string} directoryPath - Minimatch pattern to directory
  * @param {import('glob').GlobOptionsWithFileTypesUnset} [options] - Glob options
  * @returns {Promise<string[]>} File paths
  */
-const getListing = async (directoryPath, pattern = '**/*', options = {}) => {
-  const listing = await glob(pattern, {
+const getListing = async (directoryPath, options = {}) => {
+  const listing = await glob(directoryPath, {
     absolute: true,
-    cwd: directoryPath,
     nodir: true,
     realpath: true,
     ...options
   })
 
+  // Use relative paths
   return listing
-    .map((entryPath) => relative(directoryPath, entryPath))
+    .map((entryPath) => relative(options.cwd?.toString() ?? paths.root, entryPath))
     .sort()
 }
 
 /**
  * Directory listing (directories only)
  *
- * @param {string} directoryPath - Path to directory
- * @returns {Promise<string[]>} File paths
+ * @param {string} directoryPath - Minimatch pattern to directory
+ * @returns {Promise<string[]>} Directory names
  */
-const getDirectories = (directoryPath) => {
-  return getListing(directoryPath, '*/', { nodir: false })
+const getDirectories = async (directoryPath) => {
+  const listing = await getListing(`${directoryPath}/*/`, { nodir: false })
+
+  // Use directory names only
+  return listing
+    .map((directoryPath) => basename(directoryPath))
+    .sort()
 }
 
 /**
@@ -114,7 +119,7 @@ const getComponentsData = async () => {
  * @returns {Promise<string[]>} Component files
  */
 const getComponentFiles = (componentName = '') =>
-  getListing(packageNameToPath('govuk-frontend', join('src/govuk/components', componentName)))
+  getListing(packageNameToPath('govuk-frontend', join('src/govuk/components', componentName, '**/*')))
 
 /**
  * Get component names (with optional filter)
@@ -123,7 +128,7 @@ const getComponentFiles = (componentName = '') =>
  * @returns {Promise<string[]>} Component names
  */
 const getComponentNames = async (filter) => {
-  const componentNames = await getDirectories(packageNameToPath('govuk-frontend', 'src/govuk/components'))
+  const componentNames = await getDirectories(packageNameToPath('govuk-frontend', '**/src/govuk/components/'))
 
   if (filter) {
     const componentFiles = await getComponentFiles()

shared/tasks/components.mjs

@@ -12,7 +12,9 @@ import { files } from './index.mjs'
  * @param {Pick<AssetEntry[1], "srcPath" | "destPath">} options - Asset options
  */
 export async function generateFixtures (pattern, { srcPath, destPath }) {
-  const componentDataPaths = await getListing(srcPath, pattern)
+  const componentDataPaths = await getListing(pattern, {
+    cwd: srcPath
+  })
 
   // Loop component data paths
   const fixtures = componentDataPaths.map(async (componentDataPath) => {
@@ -44,7 +46,9 @@ export async function generateFixtures (pattern, { srcPath, destPath }) {
  * @param {Pick<AssetEntry[1], "srcPath" | "destPath">} options - Asset options
  */
 export async function generateMacroOptions (pattern, { srcPath, destPath }) {
-  const componentDataPaths = await getListing(srcPath, pattern)
+  const componentDataPaths = await getListing(pattern, {
+    cwd: srcPath
+  })
 
   // Loop component data paths
   const macroOptions = componentDataPaths.map(async (componentDataPath) => {

shared/tasks/scripts.mjs

@@ -12,7 +12,9 @@ import { loadConfigFile } from 'rollup/dist/loadConfigFile.js'
  * @param {AssetEntry[1]} [options] - Asset options for script(s)
  */
 export async function compile (pattern, options) {
-  const modulePaths = await getListing(options.srcPath, pattern)
+  const modulePaths = await getListing(pattern, {
+    cwd: options.srcPath
+  })
 
   // Increase Node.js max listeners warning threshold to silence
   // Rollup calling `process.on('warning')` once per bundle

shared/tasks/styles.mjs

@@ -20,7 +20,9 @@ import { assets } from './index.mjs'
  * @param {AssetEntry[1]} options - Asset options
  */
 export async function compile (pattern, options) {
-  const modulePaths = await getListing(options.srcPath, pattern)
+  const modulePaths = await getListing(pattern, {
+    cwd: options.srcPath
+  })
 
   try {
     const compileTasks = modulePaths