some updates!

Author: jycouet

packages/sv/lib/cli/add/index.ts

@@ -848,11 +848,12 @@ async function resolveCommunityAddons(cwd: string, community: string[]) {
 		});
 		p.log.message(packageInfos.join('\n'));
 
-		const confirm = await p.confirm({ message: 'Would you like to continue?' });
-		if (confirm !== true) {
-			p.cancel('Operation cancelled.');
-			process.exit(1);
-		}
+		// TODO JYC: remove for testing for now
+		// const confirm = await p.confirm({ message: 'Would you like to continue?' });
+		// if (confirm !== true) {
+		// 	p.cancel('Operation cancelled.');
+		// 	process.exit(1);
+		// }
 
 		start('Downloading community add-on packages');
 		const details = await Promise.all(pkgs.map(async (opts) => downloadPackage(opts)));

packages/sv/lib/cli/create.ts

@@ -219,10 +219,10 @@ async function createProject(cwd: ProjectPath, options: Options) {
 	const workspace = await createVirtualWorkspace({
 		cwd: projectPath,
 		template,
-		type: language
+		type: language as LanguageType
 	});
 
-	if ((options.addOns || options.add.length > 0) && options.template !== 'addon') {
+	if (options.template !== 'addon' && (options.addOns || options.add.length > 0)) {
 		const addons = options.add.reduce(addonArgsHandler, []);
 		sanitizedAddonsMap = sanitizeAddons(addons).reduce<Record<string, string[] | undefined>>(
 			(acc, curr) => {
@@ -252,7 +252,7 @@ async function createProject(cwd: ProjectPath, options: Options) {
 	createKit(projectPath, {
 		name: projectName,
 		template,
-		types: language
+		types: language as LanguageType
 	});
 
 	if (options.fromPlayground) {
@@ -264,7 +264,7 @@ async function createProject(cwd: ProjectPath, options: Options) {
 	let addOnNextSteps: string[] = [];
 	let argsFormattedAddons: string[] = [];
 	let addOnFilesToFormat: string[] = [];
-	if (options.addOns || options.add.length > 0) {
+	if (options.template !== 'addon' && (options.addOns || options.add.length > 0)) {
 		const {
 			nextSteps,
 			argsFormattedAddons: argsFormatted,

packages/sv/lib/cli/tests/cli.ts

@@ -6,6 +6,7 @@ import fs from 'node:fs';
 import { parseJson } from '../../core/tooling/index.ts';
 
 const monoRepoPath = path.resolve(__dirname, '..', '..', '..', '..', '..');
+const svBinPath = path.resolve(monoRepoPath, 'packages', 'sv', 'dist', 'bin.mjs');
 
 beforeAll(() => {
 	const testOutputCliPath = path.resolve(monoRepoPath, '.test-output', 'cli');
@@ -36,15 +37,20 @@ describe('cli', () => {
 				'mcp=ide:claude-code,cursor,gemini,opencode,vscode,other+setup:local'
 				// 'storybook' // No storybook addon during tests!
 			]
+		},
+		{
+			projectName: 'create-addon',
+			template: 'addon',
+			types: 'jsdoc',
+			args: ['--no-add-ons']
 		}
 	];
 
 	it.for(testCases)(
 		'should create a new project with name $projectName',
 		{ timeout: 10_000 },
 		async (testCase) => {
-			const { projectName, args } = testCase;
-			const svBinPath = path.resolve(monoRepoPath, 'packages', 'sv', 'dist', 'bin.mjs');
+			const { projectName, args, template = 'minimal', types = 'ts' } = testCase;
 			const testOutputPath = path.resolve(monoRepoPath, '.test-output', 'cli', projectName);
 
 			const result = await exec(
@@ -54,9 +60,9 @@ describe('cli', () => {
 					'create',
 					testOutputPath,
 					'--template',
-					'minimal',
+					template,
 					'--types',
-					'ts',
+					types,
 					'--no-install',
 					...args
 				],
@@ -105,6 +111,22 @@ describe('cli', () => {
 					`file "${relativeFile}" does not match snapshot`
 				);
 			}
+
+			if (template === 'addon') {
+				const cmds = [
+					['i'],
+					['run', 'demo-create'],
+					['run', 'demo-add'],
+					// TODO JYC: check is failing because it's requesting kit! :o
+					['run', 'check']
+				];
+				for (const cmd of cmds) {
+					const res = await exec('npm', cmd, {
+						nodeOptions: { stdio: 'pipe', cwd: testOutputPath }
+					});
+					expect(res.exitCode, `Error with cmd: '${cmd}' -> ${res.stderr}`).toBe(0);
+				}
+			}
 		}
 	);
 });

packages/sv/lib/cli/tests/snapshots/create-addon/.gitignore

@@ -0,0 +1,26 @@
+node_modules
+demo/
+
+# Output
+.output
+.vercel
+.netlify
+.wrangler
+/.svelte-kit
+/build
+/dist
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Env
+.env
+.env.*
+!.env.example
+!.env.test
+
+# Vite
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*
+

packages/sv/lib/cli/tests/snapshots/create-addon/README.md

@@ -0,0 +1,49 @@
+# sv community addon: create-addon
+
+> [!IMPORTANT]
+> Community add-ons are currently not supported. Please see [#184](https://github.com/sveltejs/cli/issues/184) for details.
+
+> [!IMPORTANT]
+> This template's dependencies may not be up-to-date; be sure to update them to the latest!
+
+> If you get stuck, check out the [implementations of official add-ons](https://github.com/sveltejs/cli/tree/main/packages/addons).
+
+created with [`sv`](https://svelte.dev/docs/cli/sv-create#Options-template-name).
+
+## Using the add-on
+
+To run the add-on, we'll first need a project to apply it to.
+
+Create the project with the following script:
+
+```shell
+npm run demo-create
+```
+
+This will create a SvelteKit project in the `demo` directory.
+
+To execute the add-on, run:
+
+```shell
+npm run demo-add
+```
+
+## Sharing your add-on
+
+When you're ready to publish your add-on to npm, run:
+
+```shell
+npm publish
+```
+
+Your published add-on can now be used by anyone!
+
+To execute the newly published package with `sv`, run:
+
+```shell
+npx sv add npm:create-addon
+```
+
+## Things to be aware of
+
+Community add-ons are **not permitted** to have any external dependencies outside of `sv`. If the use of a dependency is absolutely necessary, then they can be bundled using a bundler of your choosing (e.g. Rollup, Rolldown, tsup, etc.).

packages/sv/lib/cli/tests/snapshots/create-addon/jsconfig.json

@@ -0,0 +1,19 @@
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"allowJs": true,
+		"checkJs": true,
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true,
+		"moduleResolution": "bundler"
+	}
+	// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
+	// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files
+	//
+	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
+	// from the referenced tsconfig.json - TypeScript does not merge them in
+}

packages/sv/lib/cli/tests/snapshots/create-addon/package.json

@@ -0,0 +1,32 @@
+{
+	"name": "create-addon",
+	"version": "0.0.0",
+	"type": "module",
+	"license": "MIT",
+	"scripts": {
+		"demo-create": "sv create demo --types ts --template minimal --no-add-ons --no-install",
+		"demo-add": "sv add -C demo --community file:../ --no-git-check --no-install",
+		"test": "vitest run",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch"
+	},
+	"files": [
+		"src",
+		"!src/**/*.test.*"
+	],
+	"exports": "./src/index.js",
+	"dependencies": {
+		"sv": "file:../../packages/sv"
+	},
+	"devDependencies": {
+		"@playwright/test": "^1.56.1",
+		"svelte-check": "^4.3.4",
+		"typescript": "^5.9.3",
+		"vitest": "4.0.7"
+	},
+	"keywords": [
+		"svelte-add-on",
+		"sv",
+		"sv-add-on"
+	]
+}

packages/sv/lib/cli/tests/snapshots/create-addon/src/index.js

@@ -0,0 +1,48 @@
+import { js, parseSvelte, defineAddon, defineAddonOptions, svelte } from 'sv/core';
+
+export const options = defineAddonOptions()
+	// .add('demo', {
+	// 	question: 'Do you want to use a demo?',
+	// 	type: 'boolean',
+	// 	default: false
+	// })
+	.build();
+
+export default defineAddon({
+	id: 'create-addon',
+	options,
+	setup: ({ kit, unsupported }) => {
+		if (!kit) unsupported('Requires SvelteKit');
+	},
+	run: ({ sv, options, typescript }) => {
+		sv.file(`src/lib/create-addon/addon-template-demo.txt`, (content) => {
+			// if (!options.demo) return content;
+			return `This is a text file made by the Community Addon Template demo! with your add-on: create-addon!`;
+		});
+
+		sv.file(`src/lib/create-addon/DemoComponent.svelte`, (content) => {
+			// if (!options.demo) return content;
+			const { ast, generateCode } = parseSvelte(content);
+			const scriptAst = svelte.ensureScript(ast, { langTs: typescript });
+
+			js.imports.addDefault(scriptAst, { from: './addon-template-demo.txt?raw', as: 'demo' });
+
+			return generateCode();
+		});
+
+		sv.file('src/routes/+page.svelte', (content) => {
+			// if (!options.demo) return content;
+			const { ast, generateCode } = parseSvelte(content);
+			const scriptAst = svelte.ensureScript(ast, { langTs: typescript });
+
+			js.imports.addDefault(scriptAst, {
+				from: `$lib/create-addon/DemoComponent.svelte`,
+				as: 'DemoComponent'
+			});
+
+			ast.fragment.nodes.push(...svelte.toFragment('<DemoComponent />'));
+
+			return generateCode();
+		});
+	}
+});

packages/sv/lib/cli/tests/snapshots/create-addon/svelte.config.js

@@ -0,0 +1,13 @@
+import adapter from '@sveltejs/adapter-auto';
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	kit: {
+		// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
+		// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
+		// See https://svelte.dev/docs/kit/adapters for more information about adapters.
+		adapter: adapter()
+	}
+};
+
+export default config;

packages/sv/lib/cli/tests/snapshots/create-addon/tests/custom-addon.test.js

@@ -0,0 +1,28 @@
+import path from 'node:path';
+import { expect } from '@playwright/test';
+import { fixture, setupTest } from './setup/suite.js';
+import addon from '../src/index.js';
+
+const id = addon.id;
+const { test, variants, prepareServer } = setupTest({ [id]: addon });
+
+test.concurrent.for(variants)('demo - %s', async (variant, { page, ...ctx }) => {
+	const cwd = await ctx.run(variant, { [id]: { demo: true } });
+
+	// ...add files
+	if (variant.startsWith('kit')) {
+		const target = path.resolve(cwd, 'src', 'routes', '+page.svelte');
+		fixture({ name: '+page.svelte', target });
+	} else {
+		const target = path.resolve(cwd, 'src', 'App.svelte');
+		fixture({ name: 'App.svelte', target });
+	}
+
+	const { close } = await prepareServer({ cwd, page });
+	// kill server process when we're done
+	ctx.onTestFinished(async () => await close());
+
+	// expectations
+	const textContent = await page.getByTestId('demo').textContent();
+	expect(textContent).toContain('This is a text file made by the Community Addon Template demo!');
+});