@rm-industries/create-forge 0.4.0-beta.3 → 0.4.0-beta.5

package/dist/template/docs/guides/content-and-cms.md

@@ -18,14 +18,14 @@ tags:
 draft: false
 ---
 
-# My first article
-
 Write the article body here.
 ```
 
 The file name becomes the article slug. Use a unique lowercase, hyphenated file
 name. Required fields, dates, defaults, and body content are validated during
-development, type checking, and builds.
+development, type checking, and builds. Do not repeat the title as a top-level
+Markdown heading: the front matter `title` is the article's document title, and
+the article layout renders it as the page heading.
 
 Set `draft: true` while writing. Draft articles appear during local development
 but are omitted from production article pages and RSS output. Before publishing:

package/dist/template/playwright.config.ts

@@ -1,5 +1,7 @@
 import { defineConfig, devices } from '@playwright/test';
 
+import { previewOrigin, resolvePreviewUrl } from './tests/preview';
+
 export default defineConfig({
   testDir: './tests',
   outputDir: 'test-results',
@@ -8,7 +10,7 @@ export default defineConfig({
   retries: process.env.CI ? 2 : 0,
   reporter: process.env.CI ? [['github'], ['html', { open: 'never' }]] : 'list',
   use: {
-    baseURL: 'http://127.0.0.1:4321',
+    baseURL: previewOrigin,
     screenshot: 'only-on-failure',
     trace: 'retain-on-failure',
   },
@@ -24,7 +26,7 @@ export default defineConfig({
       ...process.env,
       ASTRO_PREVIEW_BACKGROUND: '0',
     },
-    url: 'http://127.0.0.1:4321',
+    url: resolvePreviewUrl('/'),
     reuseExistingServer: !process.env.CI,
   },
 });

package/dist/template/scripts/documentation-examples.test.ts

@@ -0,0 +1,13 @@
+import { readFile } from 'node:fs/promises';
+
+import { describe, expect, it } from 'vitest';
+
+describe('documentation examples', () => {
+  it('does not duplicate the article title as a Markdown heading', async () => {
+    const guide = await readFile(new URL('../docs/guides/content-and-cms.md', import.meta.url), 'utf8');
+    const articleExample = /```md\n([\s\S]*?)\n```/u.exec(guide)?.[1];
+
+    expect(articleExample).toContain('title: My first article');
+    expect(articleExample).not.toMatch(/^# /mu);
+  });
+});

package/dist/template/tests/accessibility.spec.ts

@@ -2,6 +2,8 @@ import AxeBuilder from '@axe-core/playwright';
 import { expect, test } from '@playwright/test';
 import type { Page } from '@playwright/test';
 
+import { resolvePreviewPath } from './preview';
+
 const publicRoutes = [
   { name: 'home', path: '/' },
   { name: 'about', path: '/about/' },
@@ -22,7 +24,7 @@ for (const colorScheme of ['light', 'dark'] as const) {
   for (const route of publicRoutes) {
     test(`${route.name} has no serious or critical violations in ${colorScheme} mode`, async ({ page }) => {
       await page.emulateMedia({ colorScheme });
-      await page.goto(route.path);
+      await page.goto(resolvePreviewPath(route.path));
 
       expect(await analyzePage(page)).toEqual([]);
     });
@@ -31,7 +33,7 @@ for (const colorScheme of ['light', 'dark'] as const) {
 
 for (const route of publicRoutes) {
   test(`${route.name} exposes one main landmark and one level-one heading`, async ({ page }) => {
-    await page.goto(route.path);
+    await page.goto(resolvePreviewPath(route.path));
 
     await expect(page.getByRole('banner')).toHaveCount(1);
     await expect(page.getByRole('main')).toHaveCount(1);
@@ -41,14 +43,14 @@ for (const route of publicRoutes) {
 }
 
 test('identifies the current primary navigation item', async ({ page }) => {
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
 
   await expect(page.getByRole('navigation', { name: 'Primary navigation' })).toBeVisible();
   await expect(page.getByRole('link', { name: 'Home' })).toHaveAttribute('aria-current', 'page');
 });
 
 test('moves keyboard users directly to the main content', async ({ page }) => {
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
   await page.keyboard.press('Tab');
 
   const skipLink = page.getByRole('link', { name: 'Skip to content' });
@@ -62,7 +64,7 @@ test('moves keyboard users directly to the main content', async ({ page }) => {
 
 test('keeps navigation available without horizontal overflow on small screens', async ({ page }) => {
   await page.setViewportSize({ width: 320, height: 640 });
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
 
   await page.locator('summary').click();
   await expect(page.getByRole('navigation', { name: 'Mobile navigation' })).toBeVisible();
@@ -75,7 +77,7 @@ test('keeps navigation available without horizontal overflow on small screens',
 
 test('honors reduced-motion preferences', async ({ page }) => {
   await page.emulateMedia({ reducedMotion: 'reduce' });
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
 
   const motionStyles = await page.getByRole('link', { name: 'Browse the articles' }).evaluate((element) => {
     const styles = getComputedStyle(element);

package/dist/template/tests/navigation.spec.ts

@@ -1,13 +1,15 @@
 import { expect, test } from '@playwright/test';
 
+import { resolvePreviewPath, resolvePreviewUrl } from './preview';
+
 test('uses primary navigation to move between pages and identify the current page', async ({ page }) => {
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
 
   const navigation = page.getByRole('navigation', { name: 'Primary navigation' });
   await expect(navigation.getByRole('link', { name: 'Home' })).toHaveAttribute('aria-current', 'page');
 
   await navigation.getByRole('link', { name: 'Articles' }).click();
-  await expect(page).toHaveURL('/articles/');
+  await expect(page).toHaveURL(resolvePreviewUrl('/articles/'));
   await expect(page.getByRole('heading', { level: 1, name: 'Articles' })).toBeVisible();
   await expect(
     page.getByRole('navigation', { name: 'Primary navigation' }).getByRole('link', { name: 'Articles' }),
@@ -16,28 +18,28 @@ test('uses primary navigation to move between pages and identify the current pag
 
 test('opens mobile navigation and follows a configured link', async ({ page }) => {
   await page.setViewportSize({ width: 320, height: 640 });
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
 
   await page.locator('summary').filter({ hasText: 'Menu' }).click();
   const navigation = page.getByRole('navigation', { name: 'Mobile navigation' });
   await expect(navigation).toBeVisible();
   await navigation.getByRole('link', { name: 'About' }).click();
 
-  await expect(page).toHaveURL('/about/');
+  await expect(page).toHaveURL(resolvePreviewUrl('/about/'));
   await expect(
     page.getByRole('heading', { level: 1, name: 'A useful foundation, not a finished identity.' }),
   ).toBeVisible();
 });
 
 test('moves from the article listing into an article and through article pagination', async ({ page }) => {
-  await page.goto('/articles/');
+  await page.goto(resolvePreviewPath('/articles/'));
 
   await page.getByRole('link', { name: /Designing a calm starting point/u }).click();
-  await expect(page).toHaveURL('/articles/designing-a-calm-starting-point/');
+  await expect(page).toHaveURL(resolvePreviewUrl('/articles/designing-a-calm-starting-point/'));
   await expect(page.getByRole('heading', { level: 1, name: 'Designing a calm starting point' })).toBeVisible();
 
   const articleNavigation = page.getByRole('navigation', { name: 'Article navigation' });
   await articleNavigation.getByRole('link', { name: /Content that travels well/u }).click();
-  await expect(page).toHaveURL('/articles/content-that-travels-well/');
+  await expect(page).toHaveURL(resolvePreviewUrl('/articles/content-that-travels-well/'));
   await expect(page.getByRole('heading', { level: 1, name: 'Content that travels well' })).toBeVisible();
 });

package/dist/template/tests/preview.ts

@@ -0,0 +1,11 @@
+import { getDeploymentConfig } from '../src/config/deployment';
+import { site } from '../src/config/site';
+import { resolveSiteHref } from '../src/lib/paths';
+
+export const previewOrigin = 'http://127.0.0.1:4321';
+
+const deployment = getDeploymentConfig(site.url);
+
+export const resolvePreviewPath = (path: string): string => resolveSiteHref(path, deployment.base ?? '/');
+
+export const resolvePreviewUrl = (path: string): string => new URL(resolvePreviewPath(path), previewOrigin).href;

package/dist/template/tests/routes.spec.ts

@@ -1,22 +1,25 @@
 import { expect, test } from '@playwright/test';
 
 import { site } from '../src/config/site';
+import { resolvePreviewPath, resolvePreviewUrl } from './preview';
 
 const routes = ['/', '/about/', '/articles/', '/articles/designing-a-calm-starting-point/', '/admin/', '/404/'];
 
 test('serves every baseline page with configured canonical and social metadata', async ({ page }) => {
   for (const route of routes) {
-    await page.goto(route);
+    await page.goto(resolvePreviewPath(route));
 
-    await expect(page.locator('link[rel="canonical"]')).toHaveAttribute('href', new URL(route, site.url).href);
+    const canonicalUrl = new URL(resolvePreviewPath(route), site.url).href;
+
+    await expect(page.locator('link[rel="canonical"]')).toHaveAttribute('href', canonicalUrl);
     await expect(page.locator('meta[property="og:site_name"]')).toHaveAttribute('content', site.name);
-    await expect(page.locator('meta[property="og:url"]')).toHaveAttribute('content', new URL(route, site.url).href);
+    await expect(page.locator('meta[property="og:url"]')).toHaveAttribute('content', canonicalUrl);
     await expect(page.locator('meta[name="twitter:card"]')).toHaveAttribute('content', 'summary_large_image');
   }
 });
 
 test('serves the content manager without allowing search indexing', async ({ page }) => {
-  await page.goto('/admin/');
+  await page.goto(resolvePreviewPath('/admin/'));
 
   await expect(page.locator('meta[name="robots"][content="noindex, nofollow"]')).toHaveCount(1);
   await expect(page).toHaveTitle(/Content Manager/u);
@@ -24,19 +27,21 @@ test('serves the content manager without allowing search indexing', async ({ pag
 });
 
 test('renders generic article tags on listings and detail pages', async ({ page }) => {
-  await page.goto('/articles/');
+  await page.goto(resolvePreviewPath('/articles/'));
   await expect(
-    page.locator('a[href="/articles/designing-a-calm-starting-point/"]').getByLabel('Article tags'),
+    page
+      .locator(`a[href="${resolvePreviewPath('/articles/designing-a-calm-starting-point/')}"]`)
+      .getByLabel('Article tags'),
   ).toContainText('Design');
 
-  await page.goto('/articles/designing-a-calm-starting-point/');
+  await page.goto(resolvePreviewPath('/articles/designing-a-calm-starting-point/'));
   await expect(page.getByLabel('Article tags')).toContainText('Defaults');
 });
 
 test('resolves every internal page link', async ({ page, request }) => {
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
 
-  const pending = ['/'];
+  const pending = [resolvePreviewPath('/')];
   const visited = new Set<string>();
 
   while (pending.length > 0) {
@@ -52,7 +57,7 @@ test('resolves every internal page link', async ({ page, request }) => {
 
     for (const href of links) {
       const url = new URL(href);
-      if (url.origin !== 'http://127.0.0.1:4321') continue;
+      if (url.origin !== new URL(resolvePreviewUrl('/')).origin) continue;
 
       const linkedPath = url.pathname;
       const response = await request.get(linkedPath);
@@ -64,31 +69,31 @@ test('resolves every internal page link', async ({ page, request }) => {
 });
 
 test('serves feed, crawler, manifest, and not-found metadata', async ({ request }) => {
-  const feed = await request.get('/rss.xml');
+  const feed = await request.get(resolvePreviewPath('/rss.xml'));
   expect(feed.ok()).toBe(true);
   expect(await feed.text()).toContain(new URL('articles/designing-a-calm-starting-point/', site.url).href);
   expect(await feed.text()).not.toContain('future-draft');
 
-  const robots = await request.get('/robots.txt');
+  const robots = await request.get(resolvePreviewPath('/robots.txt'));
   expect(robots.ok()).toBe(true);
   expect(await robots.text()).toContain(`Sitemap: ${new URL('sitemap-index.xml', site.url).href}`);
 
-  const manifest = await request.get('/site.webmanifest');
+  const manifest = await request.get(resolvePreviewPath('/site.webmanifest'));
   expect(manifest.ok()).toBe(true);
   expect(manifest.headers()['content-type']).toMatch(/application\/manifest\+json/u);
-  expect(await manifest.json()).toMatchObject({ name: site.name, start_url: '/' });
+  expect(await manifest.json()).toMatchObject({ name: site.name, start_url: resolvePreviewPath('/') });
 
-  const missing = await request.get('/does-not-exist/');
+  const missing = await request.get(resolvePreviewPath('/does-not-exist/'));
   expect(missing.status()).toBe(404);
   expect(await missing.text()).toContain('That page is not here.');
 });
 
 test('helps visitors recover from a missing page', async ({ page }) => {
-  const response = await page.goto('/does-not-exist/');
+  const response = await page.goto(resolvePreviewPath('/does-not-exist/'));
 
   expect(response?.status()).toBe(404);
   await expect(page.getByRole('heading', { level: 1, name: 'That page is not here.' })).toBeVisible();
   await page.getByRole('link', { name: 'Return home' }).click();
-  await expect(page).toHaveURL('/');
+  await expect(page).toHaveURL(resolvePreviewUrl('/'));
   await expect(page.getByRole('heading', { level: 1 })).toBeVisible();
 });

package/dist/template/tests/theme.spec.ts

@@ -2,6 +2,8 @@ import { flavors } from '@catppuccin/palette';
 import { expect, test } from '@playwright/test';
 import type { Page } from '@playwright/test';
 
+import { previewOrigin, resolvePreviewPath } from './preview';
+
 const toRgb = (hex: string) => {
   const value = Number.parseInt(hex.slice(1), 16);
 
@@ -13,7 +15,7 @@ const pageBackground = async (page: Page) =>
 
 test('uses Latte for light mode and Mocha for dark mode', async ({ page }) => {
   await page.emulateMedia({ colorScheme: 'light' });
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
   await expect(page.locator('html')).toHaveCSS('background-color', toRgb(flavors.latte.colors.base.hex));
   await expect(page.locator('main h1')).toHaveCSS('color', toRgb(flavors.latte.colors.text.hex));
 
@@ -23,7 +25,7 @@ test('uses Latte for light mode and Mocha for dark mode', async ({ page }) => {
 });
 
 test('makes every Catppuccin flavor available explicitly', async ({ page }) => {
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
 
   for (const flavor of ['latte', 'frappe', 'macchiato', 'mocha'] as const) {
     await page.locator('html').evaluate((element, theme) => element.setAttribute('data-theme', theme), flavor);
@@ -37,11 +39,11 @@ test('serves fonts locally and presents a visible keyboard focus indicator', asy
     if (request.resourceType() === 'font') fontRequests.push(request.url());
   });
 
-  await page.goto('/');
+  await page.goto(resolvePreviewPath('/'));
   await page.keyboard.press('Tab');
 
   await expect(page.locator('a').first()).toBeFocused();
   await expect(page.locator('a').first()).not.toHaveCSS('outline-style', 'none');
   expect(fontRequests.length).toBeGreaterThan(0);
-  expect(fontRequests.every((url) => new URL(url).origin === 'http://127.0.0.1:4321')).toBe(true);
+  expect(fontRequests.every((url) => new URL(url).origin === previewOrigin)).toBe(true);
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rm-industries/create-forge",
-  "version": "0.4.0-beta.3",
+  "version": "0.4.0-beta.5",
   "description": "Create a content-driven Forge website",
   "keywords": [
     "astro",