Refactor favicon generator to be an Astro integration, remove circular dependencies from ClientScriptError tool chain

Author: webstackdev

astro.config.ts

@@ -20,12 +20,15 @@ import {
   environmentalVariablesConfig,
   getSentryAuthToken,
   getSiteUrl,
+  isUnitTest,
   isVercel,
   markdownConfig,
   serviceWorkerConfig,
   vercelConfig,
 } from './src/lib/config'
 import { callToActionValidator } from './src/integrations/CtaValidator'
+import { faviconGenerator } from './src/integrations/FaviconGenerator'
+import { packageRelease } from './src/integrations/PackageRelease'
 import { privacyPolicyVersion } from './src/integrations/PrivacyPolicyVersion'
 import { createSerializeFunction, pagesJsonWriter } from './src/integrations/sitemapSerialize'
 
@@ -35,16 +38,27 @@ export default defineConfig({
     enabled: false,
   },
   env: environmentalVariablesConfig,
-  integrations: [
+  /**
+   * Astro sets substantial Vite config internally in the framework. When you use Vitest
+   * in an Astro project, you use Astro's getViteConfig helper to get the resolved internal
+   * Vite syntax along with any Vite syntax set in this astro.config.ts file. Since integrations
+   * can change config, they're ran when the helper's called. This causes problems for 
+   * unit testing integrations.
+   */
+  integrations: isUnitTest() ? [] : [
     AstroPWA(serviceWorkerConfig),
     icon(),
     mdx(markdownConfig),
     preact({ devtools: true }),
+    /** Generate favicons and PWA icons from source SVG */
+    faviconGenerator(),
     /** Verify number of call to actions included in Markdown files */
     callToActionValidator({
       /** Enable debug logging to see validation details */
       debug: true
     }),
+    /** Inject package release (name@version) for tracking regressions between releases */
+    packageRelease(),
     /** Inject privacy policy version from git commit date for GDPR record keeping */
     privacyPolicyVersion(),
     /** Only include Sentry integration in Vercel environments */

package.json

@@ -26,12 +26,11 @@
     "not IE 11"
   ],
   "scripts": {
-    "build": "cross-env NODE_ENV=production npm run build:favicons && npx astro build",
-    "build:dev": "cross-env NODE_ENV=development npm run build:favicons && npx astro build",
-    "build:favicons": "npx ts-node ./scripts/build/favicon.ts",
+    "build": "cross-env NODE_ENV=production npx astro build",
+    "build:dev": "cross-env NODE_ENV=development npx astro build",
     "check": "npx astro check",
     "clean": "npx rimraf dist && npx rimraf .astro",
-    "dev": "npm run sync && npm run build:favicons && cross-env NODE_ENV=development npx vercel dev",
+    "dev": "npm run sync && cross-env NODE_ENV=development npx vercel dev",
     "format": "npm run format:json && npm run format:code && npm run format:style",
     "format:code": "npx prettier --write \"@types/**/*.{js,ts}\" \"scripts/**/*.{js,ts}\" \"src/**/*.{js,ts,tsx,astro}\" --plugin=prettier-plugin-astro",
     "format:json": "npx prettier --write '**/*.json' --cache --ignore-path .gitignore",
@@ -40,7 +39,7 @@
     "lint:code": "npx eslint \"@types/**/*.{js,ts}\" \"scripts/**/*.{js,ts}\" \"src/**/*.{js,ts,tsx,astro}\"",
     "lint:json": "npx prettier --write '**/*.json' --cache --ignore-path .gitignore",
     "lint:style": "npx stylelint \"src/**/*.{css,astro}\"",
-    "preview": "npm run build:favicons && npx astro build && astro preview",
+    "preview": "npx astro build && astro preview",
     "sync": "npx astro sync",
     "test": "npm run test:unit && npm run test:e2e",
     "test:coverage": "npx vitest run --coverage",
@@ -103,7 +102,6 @@
     "tailwindcss": "^4.1.16",
     "title-case": "4.3.2",
     "to-ico": "1.1.5",
-    "ts-node": "10.9.2",
     "uuid": "^13.0.0",
     "vite": "^7.1.12",
     "workbox-build": "7.3.0",