fix: Theme App Extension only allows assets/blocks/snippets/locales dirs

`shopify app dev` failed dev preview with "Only assets, blocks, snippets,
locales directories are allowed" — the widget's TypeScript source lived in
extensions/datetime-widget/src/, which isn't one of the four directories a
Theme App Extension may contain. Moved it to widget-src/datetime-widget/
(a plain, non-extension folder outside extensions/) and updated
build:widget's esbuild input path accordingly; the bundled output still
lands in the same place (extensions/datetime-widget/assets/).

Also fixed a theme-check warning surfaced during the same run:
`script_tag` renders a parser-blocking <script> with no way to defer it —
switched to a manual <script defer> tag for the widget's JS asset.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
metatroncubeswdev 2026-08-23 21:51:54 -04:00
parent 381c52d01a
commit e116a6c87a
4 changed files with 9 additions and 4 deletions

View File

@ -45,8 +45,13 @@ slot-holds) are complete. See §6 of `IMPLEMENTATION_PLAN.md` for the phased
build order and acceptance criteria — next up is Phase 5 (multi-location, build order and acceptance criteria — next up is Phase 5 (multi-location,
zones, rates, auto-assignment). zones, rates, auto-assignment).
Editing the storefront widget's `extensions/datetime-widget/src/`? Run The storefront widget's TypeScript source lives in `widget-src/datetime-widget/`,
`npm run build:widget` to rebuild `assets/datetime-widget.js` — it also runs **not** inside `extensions/datetime-widget/` — a Theme App Extension's
directory may only contain `assets`, `blocks`, `snippets`, and `locales`
(the CLI hard-rejects anything else, e.g. a `src/` folder, with "Only
assets, blocks, snippets, locales directories are allowed"). Editing the
widget? Run `npm run build:widget` to bundle it into
`extensions/datetime-widget/assets/datetime-widget.js` — it also runs
automatically before `npm run dev` / `npm run deploy`. automatically before `npm run dev` / `npm run deploy`.
**Functions are JavaScript, not Rust** (`extensions/validation-slot/`, **Functions are JavaScript, not Rust** (`extensions/validation-slot/`,

View File

@ -1,5 +1,5 @@
{{ 'datetime-widget.css' | asset_url | stylesheet_tag }} {{ 'datetime-widget.css' | asset_url | stylesheet_tag }}
{{ 'datetime-widget.js' | asset_url | script_tag }} <script src="{{ 'datetime-widget.js' | asset_url }}" defer="defer"></script>
{% schema %} {% schema %}
{ {

View File

@ -22,7 +22,7 @@
"test": "vitest", "test": "vitest",
"test:integration": "vitest run --config vitest.integration.config.ts", "test:integration": "vitest run --config vitest.integration.config.ts",
"test:e2e": "playwright test", "test:e2e": "playwright test",
"build:widget": "esbuild extensions/datetime-widget/src/datetime-widget.ts --bundle --minify --target=es2019 --outfile=extensions/datetime-widget/assets/datetime-widget.js", "build:widget": "esbuild widget-src/datetime-widget/datetime-widget.ts --bundle --minify --target=es2019 --outfile=extensions/datetime-widget/assets/datetime-widget.js",
"worker": "tsx jobs/worker.ts", "worker": "tsx jobs/worker.ts",
"shopify": "shopify", "shopify": "shopify",
"prisma": "prisma", "prisma": "prisma",