Run and ship
This is the working loop after scaffolding: watch, paste, preview, build, and hand off.
Release checklist
- Run the watcher for the variation you are editing.
- Paste the matching clipboard bundle into Adobe Target.
- Refresh the Target preview after every meaningful change.
- Run
pnpm formatbefore review or handoff. - Run
pnpm buildbefore shipping. - Copy the production bundle from
dist/vN-index.jsxinto the matching Target variation.
Choose a command
| Goal | Command | Use it when |
|---|---|---|
| Edit one variation | pnpm start 0 | You are working on v1 and want the bundle copied to the clipboard after every save. |
| Edit all variations | pnpm start | You want watch output for every generated variation. |
| Preview with injection | pnpm live | You want the tool to open targetUrl and inject the watched bundle. |
| Prepare for shipping | pnpm build | You need final IIFE files in dist/ after the lint gate passes. |
Watch and paste
Run watch mode for the variation you are editing:
pnpm start 0The command index is zero-based and follows discovered variation order. Numeric folders are ordered first, followed by named folders such as control:
| Command index | Variation folder | Output bundle |
|---|---|---|
0 | src/js/v1 | dist/v1-index.jsx |
1 | src/js/v2 | dist/v2-index.jsx |
2 | src/js/v3 | dist/v3-index.jsx |
| next index | src/js/control | dist/control-index.jsx |
On each successful rebuild, the generated IIFE is copied to your clipboard. Paste it into Adobe Target custom code and refresh the preview page.
WARNING
Paste the bundle into the matching Target variation. pnpm start 1 builds v2, not v1.
Live injection
Live injection opens the target page and inserts the watched bundle:
pnpm livepnpm live reads experiment.config.js, opens targetUrl, watches the bundle, injects it into the page, and shows an overlay with status information.
Injection succeeds when the bundle registers on window[globalObject][packageName]. The overlay may also show which selector from src/config.js matched, but a missing selector does not block injection. Experiments that only change text, styles, or tracking still preview correctly as long as runScript registers the package name.
To reuse one browser cache profile across experiments:
pnpm live -- --profile sharedUse the shared profile when login, consent, or cached market state would otherwise slow down repeated checks.
You can override live options without editing config:
pnpm live -- --variation v2
pnpm live -- --variation control
pnpm live -- --url https://www.samsung.com/de/
pnpm live -- --overlay hidden
pnpm live -- --profile sharedvariation accepts a zero-based index or a discovered folder name such as v2 or control.
Production build
Run:
pnpm buildThe command:
- Runs the Biome lint gate.
- Builds each
src/js/vN/index.jsxentry as an IIFE. - Writes bundles to
dist/vN-index.jsx. - Prints raw and gzip bundle sizes.
If Biome reports errors, the build aborts before bundling. Run pnpm format first, then manually fix any diagnostics that remain.
Add another variation
Create a new variation from v1:
pnpm new-variation 3
pnpm new-variation control
pnpm start 2pnpm new-variation 3 creates src/js/v3/index.jsx from v1 and copies src/js/v1/styles.module.scss when present. pnpm new-variation control creates src/js/control/index.jsx from v1.
After creation:
- Update labels in
src/js/v3/index.jsx. - Change selector, props, or component logic for the variation.
- Run
pnpm start 2while editingv3. - Use the printed
pnpm start <index>command when editing a named variation such ascontrol. - Run
pnpm buildbefore shipping.
Failure modes
| Symptom | Check |
|---|---|
| Clipboard bundle appears in the wrong variation | Confirm the command index and Target variation match. |
| Build stops before bundling | Run pnpm format, then fix remaining Biome diagnostics manually. |
| Live preview opens but does not inject | Check targetUrl, runtime.globalObject, and the selected live variation in experiment.config.js. |
| Target preview does not change | Save the Target custom code editor, refresh the preview page, and paste the latest clipboard bundle. |