From e306316b07c61d2e9ae6bfe9bb33c56da1c94142 Mon Sep 17 00:00:00 2001 From: Aral Roca Date: Thu, 5 Dec 2024 23:53:25 +0100 Subject: [PATCH 1/2] fix(build): co-relate details with the correct output --- .../client-build/pages-build/index.test.ts | 41 +++++++++++++++++++ .../utils/client-build/pages-build/index.ts | 28 ++++++++----- .../utils/snake-to-camelcase/index.test.ts | 4 ++ .../src/utils/snake-to-camelcase/index.ts | 4 +- 4 files changed, 64 insertions(+), 13 deletions(-) diff --git a/packages/brisa/src/utils/client-build/pages-build/index.test.ts b/packages/brisa/src/utils/client-build/pages-build/index.test.ts index de77e325a..68305afc0 100644 --- a/packages/brisa/src/utils/client-build/pages-build/index.test.ts +++ b/packages/brisa/src/utils/client-build/pages-build/index.test.ts @@ -5,6 +5,7 @@ import clientPageBuild from '.'; import { getConstants } from '@/constants'; import getWebComponentsList from '@/utils/get-web-components-list'; import type { BuildArtifact } from 'bun'; +import type { WCsEntrypoints } from '../types'; const src = path.join(import.meta.dir, '..', '..', '..', '__fixtures__'); const build = path.join(src, `out-${crypto.randomUUID()}}`); @@ -189,4 +190,44 @@ describe('client-build', () => { // Brisa element usage expect(output[0].code).toContain('._P)'); }); + + it('should correctly associate web components with entrypoints', async () => { + const temp = path.join(src, 'pages', '.temp-test-files'); + + if (fs.existsSync(temp)) { + fs.rmSync(temp, { recursive: true }); + } + fs.mkdirSync(temp); + + const entrypoints = []; + const webComponentsPerEntrypoint: WCsEntrypoints = {}; + const allWCs = {}; + + for (let i = 0; i < 20; i += 1) { + const id = crypto.randomUUID(); + const wcPath = path.join(temp, `wc-${id}-test.tsx`); + + fs.writeFileSync(wcPath, `export default () => ;`); + entrypoints.push(wcPath); + Object.assign(allWCs, { [`wc-${id}-test`]: wcPath }); + + Object.assign(webComponentsPerEntrypoint, { + [wcPath]: { [`wc-${id}-test`]: wcPath }, + }); + } + + const output = await clientPageBuild(entrypoints.map(toArtifact), { + allWebComponents: allWCs, + webComponentsPerEntrypoint, + layoutWebComponents: {}, + }); + + fs.rmSync(temp, { recursive: true }); + expect(output.length).toEqual(entrypoints.length); + + for (const details of output) { + const pathname = path.parse(details.pagePath).name; + expect(details.code).toContain(pathname); + } + }); }); diff --git a/packages/brisa/src/utils/client-build/pages-build/index.ts b/packages/brisa/src/utils/client-build/pages-build/index.ts index 22645d6c8..997e1d4a8 100644 --- a/packages/brisa/src/utils/client-build/pages-build/index.ts +++ b/packages/brisa/src/utils/client-build/pages-build/index.ts @@ -1,4 +1,5 @@ import type { BuildArtifact } from 'bun'; +import { parse } from 'node:path'; import { log, logBuildError } from '../../log/log-build'; import { removeTempEntrypoints } from '../fs-temp-entrypoint-manager'; import { getClientBuildDetails } from '../get-client-build-details'; @@ -17,11 +18,7 @@ export default async function clientPageBuild( let clientBuildDetails = await getClientBuildDetails(pages, options); - const entrypointsData = clientBuildDetails.reduce((acc, curr, index) => { - if (curr.entrypoint) acc.push({ ...curr, index }); - return acc; - }, [] as EntryPointData[]); - + const entrypointsData = clientBuildDetails.filter((p) => p.entrypoint); const entrypoints = entrypointsData.map((p) => p.entrypoint!); if (entrypoints.length === 0) { @@ -46,14 +43,23 @@ export default async function clientPageBuild( return clientBuildDetails; } + const outputsPerFilename = outputs.reduce( + (acc, artifact) => { + acc[parse(artifact.path).name] = artifact; + return acc; + }, + {} as Record, + ); + await Promise.all( - outputs.map(async (output, i) => { - const index = entrypointsData[i].index!; + clientBuildDetails.map(async (details) => { + if (!details.entrypoint) return; + + const filename = parse(details.entrypoint).name; + const code = await outputsPerFilename[filename].text(); - clientBuildDetails[index] = { - ...clientBuildDetails[index], - ...processI18n(await output.text()), - }; + // Mutate the details object to include the compiled code + i18n details + Object.assign(details, processI18n(code)); }), ); diff --git a/packages/brisa/src/utils/snake-to-camelcase/index.test.ts b/packages/brisa/src/utils/snake-to-camelcase/index.test.ts index 45811b769..2a7e5549e 100644 --- a/packages/brisa/src/utils/snake-to-camelcase/index.test.ts +++ b/packages/brisa/src/utils/snake-to-camelcase/index.test.ts @@ -14,5 +14,9 @@ describe('utils', () => { it('should work with upper case letters', () => { expect(snakeToCamelCase('some-EXAMPLE-1')).toBe('someExample1'); }); + + it('should remove "."', () => { + expect(snakeToCamelCase('some.example')).toBe('someExample'); + }); }); }); diff --git a/packages/brisa/src/utils/snake-to-camelcase/index.ts b/packages/brisa/src/utils/snake-to-camelcase/index.ts index 4f496dca9..5e552034f 100644 --- a/packages/brisa/src/utils/snake-to-camelcase/index.ts +++ b/packages/brisa/src/utils/snake-to-camelcase/index.ts @@ -1,4 +1,4 @@ -const SNAKE_TO_CAMEL_CASE_REGEX = /([-_]([a-z]|[0-9]))/g; +const SNAKE_TO_CAMEL_CASE_REGEX = /([-_\.]([a-z]|[0-9]))/g; export default function snakeToCamelCase(str: string) { return str @@ -7,5 +7,5 @@ export default function snakeToCamelCase(str: string) { } function replaceSnakeToCamelCase(group: string) { - return group.toUpperCase().replace('-', '').replace('_', ''); + return group.toUpperCase().replace('-', '').replace('_', '').replace('.', ''); } From 511b54716ac018082d07cee1c804f433a58948ee Mon Sep 17 00:00:00 2001 From: Aral Roca Date: Thu, 5 Dec 2024 23:58:04 +0100 Subject: [PATCH 2/2] test: change randomUUID to index --- .../src/utils/client-build/pages-build/index.test.ts | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/brisa/src/utils/client-build/pages-build/index.test.ts b/packages/brisa/src/utils/client-build/pages-build/index.test.ts index 68305afc0..cb4acb326 100644 --- a/packages/brisa/src/utils/client-build/pages-build/index.test.ts +++ b/packages/brisa/src/utils/client-build/pages-build/index.test.ts @@ -204,15 +204,14 @@ describe('client-build', () => { const allWCs = {}; for (let i = 0; i < 20; i += 1) { - const id = crypto.randomUUID(); - const wcPath = path.join(temp, `wc-${id}-test.tsx`); + const wcPath = path.join(temp, `wc-${i}-test.tsx`); - fs.writeFileSync(wcPath, `export default () => ;`); + fs.writeFileSync(wcPath, `export default () => ;`); entrypoints.push(wcPath); - Object.assign(allWCs, { [`wc-${id}-test`]: wcPath }); + Object.assign(allWCs, { [`wc-${i}-test`]: wcPath }); Object.assign(webComponentsPerEntrypoint, { - [wcPath]: { [`wc-${id}-test`]: wcPath }, + [wcPath]: { [`wc-${i}-test`]: wcPath }, }); }