feat(core): permit cdnjs library whitelist in generated artifacts by hqhq1025 · Pull Request #102 · OpenCoworkAI/open-codesign

hqhq1025 · 2026-04-19T08:44:15Z

Summary

Today's bug hunt revealed our generated dashboards look amateur because the system prompt banned all CDN scripts beyond Tailwind + Google Fonts, forcing the model to inline-SVG every chart. Web research confirms Claude Artifacts (Anthropic's reference product) actually permits scripts from a single trusted CDN host (cdnjs.cloudflare.com) and ships popular viz libraries inside its React Artifacts environment — that's why their dashboards look professional.

This PR mirrors that policy in our system prompt: relaxes the "Tailwind + Google Fonts only" rule to allow a tightly-scoped cdnjs whitelist of six libraries with exact-version pinning, while keeping the trust posture explicit.

What's now allowed

CSS (unchanged)

Tailwind via cdn.tailwindcss.com
Google Fonts via fonts.googleapis.com / fonts.gstatic.com

JS libraries (new — cdnjs.cloudflare.com whitelist only, exact-version pinned)

recharts — preferred for dashboards
chart.js — alternative charting
d3 — low-level visualization
three.js — 3D
lodash — utilities
papaparse — CSV parsing

URL format: https://cdnjs.cloudflare.com/ajax/libs/<lib>/<exact-version>/<file>.min.js

What's still forbidden

Arbitrary fetch() / XMLHttpRequest to external APIs (data must remain inline)
Scripts from any host other than cdnjs.cloudflare.com (no esm.sh, jsdelivr, unpkg — too open, no version verification)
Hotlinked photos from any host

Files touched

packages/core/src/prompts/output-rules.v1.txt — rewrote the "Permitted external resources" block
packages/core/src/prompts/index.ts — kept the inlined TS constant byte-for-byte aligned (drift test passes)
packages/core/src/generate.test.ts — added two assertions covering the cdnjs whitelist + the six approved libraries
packages/templates/src/system/design-generator.md + packages/templates/src/system/index.ts — same relaxation applied to the legacy generator prompt for consistency

PRINCIPLES checks

Compatibility: green — prompt-only change; no schema, no IPC, no exporter behavior shifts; existing artifacts continue to render.
Upgradeability: green — the whitelist lives in one place (output-rules.v1.txt) so future additions/removals are a single-file PR; section is versioned via the .v1 suffix already in use.
No bloat: green — zero new dependencies; the install size budget (≤80 MB) is unaffected.
Elegance: green — mirrors a real-world reference policy (Claude Artifacts) rather than inventing a bespoke matrix; the rule reads as intent ("trusted single host, pinned version") rather than ad-hoc exceptions.

Test plan

pnpm --filter @open-codesign/core exec vitest run — 133/133 pass, including the prompt section .txt-vs-TS drift test and the two new whitelist assertions
pnpm test (full workspace) — 10/10 task successful after rebase onto current origin/main
pnpm lint — clean (preexisting warnings only)
Manual: regenerate a dashboard prompt with a Claude 4 model and confirm Recharts URL appears

github-actions

Findings

[Major] Whitelisted cdnjs library IDs include non-existent aliases, which can produce 404 script URLs in generated artifacts and break chart/data functionality at runtime. Evidence packages/core/src/prompts/index.ts:87, packages/core/src/prompts/output-rules.v1.txt:32, packages/templates/src/system/design-generator.md:41, packages/templates/src/system/index.ts:29.
Suggested fix:

Approved: recharts, Chart.js, d3, three.js, lodash.js, PapaParse
# and keep the exact-version URL template unchanged
https://cdnjs.cloudflare.com/ajax/libs/<lib>/<exact-version>/<file>.min.js

[Minor] Prompt tests currently lock in the same incorrect aliases (chart.js, lodash, papaparse), so CI can pass while generated URLs remain invalid. Evidence packages/core/src/generate.test.ts:1024.
Suggested fix:

for (const lib of ['recharts', 'Chart.js', 'd3', 'three.js', 'lodash.js', 'PapaParse']) {
  expect(prompt, `missing approved cdnjs library: ${lib}`).toContain(lib);
}

Summary

Review mode: initial
2 issues found (1 Major, 1 Minor), both introduced by the whitelist update and directly affecting generation correctness.
docs/VISION.md and docs/PRINCIPLES.md: Not found in repo/docs.

Testing

Not run (automation)

open-codesign Bot

github-actions · 2026-04-19T08:47:17Z

+    - Google Fonts: \`<link rel="preconnect">\` + \`<link rel="stylesheet">\` from \`fonts.googleapis.com\` / \`fonts.gstatic.com\`
+  - **JS libraries** — \`cdnjs.cloudflare.com\` whitelist only. Pin an exact version. Format: \`https://cdnjs.cloudflare.com/ajax/libs/<lib>/<exact-version>/<file>.min.js\`. Approved libraries:
+    - \`recharts\` — data viz (preferred for dashboards)
+    - \`chart.js\` — alternative charting


chart.js, lodash, and papaparse do not map to cdnjs library IDs in ajax/libs paths. This can lead the model to emit 404 script URLs. Prefer Chart.js, lodash.js, and PapaParse here.

github-actions · 2026-04-19T08:47:17Z

+    - Google Fonts: `<link rel="preconnect">` + `<link rel="stylesheet">` from `fonts.googleapis.com` / `fonts.gstatic.com`
+  - **JS libraries** — `cdnjs.cloudflare.com` whitelist only. Pin an exact version. Format: `https://cdnjs.cloudflare.com/ajax/libs/<lib>/<exact-version>/<file>.min.js`. Approved libraries:
+    - `recharts` — data viz (preferred for dashboards)
+    - `chart.js` — alternative charting


This approved list includes aliases that are not valid cdnjs ajax/libs IDs (chart.js, lodash, papaparse). Use canonical IDs so generated URLs resolve.

github-actions · 2026-04-19T08:47:17Z

+     `fonts.googleapis.com` / `fonts.gstatic.com`.
+   - **JS libraries**: `cdnjs.cloudflare.com` whitelist only, exact-version
+     pinned (`https://cdnjs.cloudflare.com/ajax/libs/<lib>/<exact-version>/<file>.min.js`).
+     Approved: `recharts`, `chart.js`, `d3`, `three.js`, `lodash`, `papaparse`.


Mirrors the same invalid cdnjs aliases. If left as-is, generated artifacts can include broken script URLs. Please align to canonical cdnjs IDs.

github-actions · 2026-04-19T08:47:17Z

+
+  it('create mode lists the six approved chart / data libraries', () => {
+    const prompt = composeSystemPrompt({ mode: 'create' });
+    for (const lib of ['recharts', 'chart.js', 'd3', 'three.js', 'lodash', 'papaparse']) {


Test currently hard-codes the same alias set, so this regression is not caught. Update expected library IDs to canonical cdnjs names (Chart.js, lodash.js, PapaParse).

…rror Claude Artifacts) Relaxes the prior "Tailwind + Google Fonts only" rule in the design-generation system prompt to allow a tightly-scoped cdnjs.cloudflare.com whitelist (recharts, chart.js, d3, three.js, lodash, papaparse), matching Anthropic's actual stance in Claude Artifacts. Without real chart libraries the model was forced to inline-SVG everything, which is why generated dashboards looked amateur. Updates both the .txt section and the inlined TS constant so the byte-for-byte drift test still passes, and adds two tests asserting the new whitelist + the six approved libraries appear in the system prompt. The same scoping is reflected in packages/templates/src/system to keep the legacy generator prompt aligned. Forbidden list explicitly retains: arbitrary fetch() to external APIs, non-cdnjs script hosts (esm.sh / jsdelivr / unpkg — too open / unverifiable), and hotlinked photos.

cdnjs library slugs are case-sensitive. The original whitelist used `chart.js`, `lodash`, `papaparse` which return 404 against api.cdnjs.com. Updated to the verified slugs (`Chart.js`, `lodash.js`, `PapaParse`) so generated artifact URLs actually load. Verified each slug against https://api.cdnjs.com/libraries/<slug>?fields=name on 2026-04-19. Added a vitest assertion that the bullet-list lines mention only the verified slugs and not the broken ones.

hqhq1025 · 2026-04-19T08:52:55Z

Fixed slug casing — verified each library against https://api.cdnjs.com/libraries/<slug>?fields=name on 2026-04-19.

brief name	original slug	verified cdnjs slug	API result
recharts	`recharts`	`recharts`	200
chart.js	`chart.js`	`Chart.js`	404 → 200
d3	`d3`	`d3`	200
three.js	`three.js`	`three.js`	200 (not `three`, that 404s)
lodash	`lodash`	`lodash.js`	404 → 200
papaparse	`papaparse`	`PapaParse`	404 → 200

Updated output-rules.v1.txt, OUTPUT_RULES in prompts/index.ts, plus the parallel whitelist in packages/templates/src/system/{index.ts,design-generator.md}. Added a vitest assertion against the bullet lines so future regressions blow up. pnpm test + pnpm lint green.

github-actions

Findings

No issues found in added/modified lines with high confidence.

Summary

Review mode: follow-up after new commits
No new correctness, security, regression, or hard-constraint violations were found in this diff.
Residual risk/testing gap: changes are prompt-behavior updates; there is no end-to-end assertion here that generated artifacts using the approved cdnjs libraries always resolve at runtime.
docs/VISION.md: Not found in repo/docs.
docs/PRINCIPLES.md: Not found in repo/docs.

Testing

Not run (automation)

open-codesign Bot

Replaces the original esm.sh / jsdelivr references with deferral to the project's approved cdnjs whitelist (PR #102). The chart contract now: - Defers JS-library loading to output-rules' cdnjs whitelist (DRY) - Adds chart-recipe guidance: when to use bar vs line vs donut, axis labelling, accessible color choices, hover state — chart skill body content rather than just a CDN reference - Complements the data-viz-recharts skill instead of duplicating it

* feat(core): chart contract uses cdnjs whitelist (aligns with #102) Replaces the original esm.sh / jsdelivr references with deferral to the project's approved cdnjs whitelist (PR #102). The chart contract now: - Defers JS-library loading to output-rules' cdnjs whitelist (DRY) - Adds chart-recipe guidance: when to use bar vs line vs donut, axis labelling, accessible color choices, hover state — chart skill body content rather than just a CDN reference - Complements the data-viz-recharts skill instead of duplicating it * test(core): cover chart contract composition in revise mode

github-actions Bot reviewed Apr 19, 2026

View reviewed changes

hqhq1025 added 2 commits April 19, 2026 16:49

hqhq1025 force-pushed the wt/feat-cdn-policy-cdnjs-whitelist branch from c14e57f to 5bb5adc Compare April 19, 2026 08:52

github-actions Bot reviewed Apr 19, 2026

View reviewed changes

hqhq1025 merged commit 9139f58 into main Apr 19, 2026
5 of 6 checks passed

hqhq1025 deleted the wt/feat-cdn-policy-cdnjs-whitelist branch April 19, 2026 08:55

hqhq1025 mentioned this pull request Apr 19, 2026

feat(core): chart rendering contract #78

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(core): permit cdnjs library whitelist in generated artifacts#102

feat(core): permit cdnjs library whitelist in generated artifacts#102
hqhq1025 merged 2 commits intomainfrom
wt/feat-cdn-policy-cdnjs-whitelist

hqhq1025 commented Apr 19, 2026

Uh oh!

github-actions Bot left a comment

Uh oh!

github-actions Bot Apr 19, 2026

Uh oh!

github-actions Bot Apr 19, 2026

Uh oh!

github-actions Bot Apr 19, 2026

Uh oh!

github-actions Bot Apr 19, 2026

Uh oh!

hqhq1025 commented Apr 19, 2026

Uh oh!

github-actions Bot left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

hqhq1025 commented Apr 19, 2026

Summary

What's now allowed

What's still forbidden

Files touched

PRINCIPLES checks

Test plan

Uh oh!

github-actions Bot left a comment

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Apr 19, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Apr 19, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Apr 19, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Apr 19, 2026

Choose a reason for hiding this comment

Uh oh!

hqhq1025 commented Apr 19, 2026

Uh oh!

github-actions Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant