slicejs-web-framework 3.4.3 → 3.4.4

package/slicejs-cli/commands/utils/loadConfig.js

@@ -0,0 +1,31 @@
+import fs from 'fs-extra';
+import { getConfigPath } from './PathHelper.js';
+import Print from '../Print.js';
+
+export async function loadConfig(moduleUrl) {
+  try {
+    const configPath = getConfigPath(moduleUrl);
+    if (!await fs.pathExists(configPath)) {
+      return null;
+    }
+    const rawData = await fs.readFile(configPath, 'utf-8');
+    return JSON.parse(rawData);
+  } catch (error) {
+    Print.error(`Error loading configuration: ${error.message}`);
+    return null;
+  }
+}
+
+export function loadConfigSync(moduleUrl) {
+  try {
+    const configPath = getConfigPath(moduleUrl);
+    if (!fs.existsSync(configPath)) {
+      return null;
+    }
+    const rawData = fs.readFileSync(configPath, 'utf-8');
+    return JSON.parse(rawData);
+  } catch (error) {
+    Print.error(`Error loading configuration: ${error.message}`);
+    return null;
+  }
+}

package/slicejs-cli/commands/utils/sliceScripts.js

@@ -0,0 +1,48 @@
+// commands/utils/sliceScripts.js
+//
+// Single source of truth for the slice:* package scripts configured by the CLI.
+// Used by the `slice postinstall` command in
+// client.js, and `slice init` — so the three can never drift apart (they did:
+// client.js was missing slice:types, and none of them had slice:build).
+
+import fs from 'fs';
+
+/**
+ * Reads a project's package.json and verifies it contains all SLICE_SCRIPTS.
+ * Returns { missing: string[] } where each entry is the script name not found.
+ */
+export function verifySliceScriptsInPackageJson(pkgPath) {
+  const missing = [];
+  try {
+    if (!fs.existsSync(pkgPath)) {
+      return { missing: Object.keys(SLICE_SCRIPTS) };
+    }
+    const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'));
+    const scripts = pkg.scripts || {};
+    for (const script of Object.keys(SLICE_SCRIPTS)) {
+      if (!scripts[script]) {
+        missing.push(script);
+      }
+    }
+  } catch {
+    return { missing: Object.keys(SLICE_SCRIPTS) };
+  }
+  return { missing };
+}
+
+export const SLICE_SCRIPTS = {
+  'slice:init': 'node ./node_modules/slicejs-cli/client.js init',
+  'slice:dev': 'node ./node_modules/slicejs-cli/client.js dev',
+  'slice:build': 'node ./node_modules/slicejs-cli/client.js build',
+  'slice:start': 'node ./node_modules/slicejs-cli/client.js start',
+  'slice:create': 'node ./node_modules/slicejs-cli/client.js component create',
+  'slice:list': 'node ./node_modules/slicejs-cli/client.js component list',
+  'slice:delete': 'node ./node_modules/slicejs-cli/client.js component delete',
+  'slice:get': 'node ./node_modules/slicejs-cli/client.js get',
+  'slice:browse': 'node ./node_modules/slicejs-cli/client.js browse',
+  'slice:sync': 'node ./node_modules/slicejs-cli/client.js sync',
+  'slice:doctor': 'node ./node_modules/slicejs-cli/client.js doctor',
+  'slice:version': 'node ./node_modules/slicejs-cli/client.js version',
+  'slice:help': 'node ./node_modules/slicejs-cli/client.js --help',
+  'slice:types': 'node ./node_modules/slicejs-cli/client.js types generate',
+};

package/slicejs-cli/commands/utils/updateManager.js

@@ -0,0 +1,471 @@
+// commands/utils/updateManager.js
+
+import { exec } from "child_process";
+import { promisify } from "util";
+import inquirer from "inquirer";
+import ora from "ora";
+import Print from "../Print.js";
+import versionChecker from "./VersionChecker.js";
+import { getProjectRoot, getApiPath, getPath } from "../utils/PathHelper.js";
+import { resolvePackageManager, installCommand } from "../utils/PackageManager.js";
+import path from "path";
+import { fileURLToPath } from "url";
+import fs from "fs-extra";
+
+const execAsync = promisify(exec);
+
+export class UpdateManager {
+    constructor() {
+        this.packagesToUpdate = [];
+    }
+
+    getPackageManager() {
+        if (!this._packageManager) {
+            this._packageManager = resolvePackageManager(getProjectRoot(import.meta.url)).name;
+        }
+        return this._packageManager;
+    }
+
+    async detectCliInstall() {
+        try {
+            const moduleDir = path.dirname(fileURLToPath(import.meta.url));
+            const cliRoot = path.join(moduleDir, '../../');
+            const projectRoot = getProjectRoot(import.meta.url);
+            const packageManager = this.getPackageManager();
+            const localNodeModules = path.join(projectRoot, 'node_modules');
+
+            if (cliRoot.startsWith(localNodeModules)) {
+                return { type: 'local', cliRoot, projectRoot, packageManager };
+            }
+
+            // Global pnpm installs live under PNPM_HOME — `npm config get prefix`
+            // knows nothing about them (and npm may not even exist on the machine).
+            const pnpmHome = process.env.PNPM_HOME;
+            if (pnpmHome && cliRoot.startsWith(pnpmHome)) {
+                return { type: 'global', cliRoot, projectRoot, packageManager: 'pnpm' };
+            }
+
+            let globalPrefix = '';
+            try {
+                const { stdout } = await execAsync('npm config get prefix');
+                globalPrefix = stdout.toString().trim();
+            } catch {}
+            const globalNodeModules = globalPrefix ? path.join(globalPrefix, 'node_modules') : '';
+            if (globalNodeModules && cliRoot.startsWith(globalNodeModules)) {
+                return { type: 'global', cliRoot, projectRoot, packageManager: 'npm' };
+            }
+
+            return { type: 'unknown', cliRoot, projectRoot, packageManager };
+        } catch (error) {
+            return { type: 'unknown', packageManager: this.getPackageManager() };
+        }
+    }
+
+    /**
+     * Check for available updates and return structured info
+     */
+    async checkForUpdates(options = {}) {
+        const { silentErrors = false } = options;
+
+        try {
+            const updateInfo = await versionChecker.checkForUpdates(true); // Silent mode
+
+            if (!updateInfo) {
+                return null;
+            }
+
+            const updates = [];
+
+            if (updateInfo.cli.status === 'outdated') {
+                updates.push({
+                    name: 'slicejs-cli',
+                    displayName: 'Slice.js CLI',
+                    current: updateInfo.cli.current,
+                    latest: updateInfo.cli.latest,
+                    type: 'cli'
+                });
+            }
+
+            if (updateInfo.framework.status === 'outdated') {
+                updates.push({
+                    name: 'slicejs-web-framework',
+                    displayName: 'Slice.js Framework',
+                    current: updateInfo.framework.current,
+                    latest: updateInfo.framework.latest,
+                    type: 'framework'
+                });
+            }
+
+            return {
+                hasUpdates: updates.length > 0,
+                updates,
+                allCurrent: updateInfo.cli.status === 'current' && updateInfo.framework.status === 'current'
+            };
+        } catch (error) {
+            if (!silentErrors) {
+                Print.error(`Checking for updates: ${error.message}`);
+            }
+            return null;
+        }
+    }
+
+    async notifyAvailableUpdates() {
+        const updateInfo = await this.checkForUpdates({ silentErrors: true });
+
+        if (!updateInfo || !updateInfo.hasUpdates) {
+            return false;
+        }
+
+        this.displayUpdates(updateInfo);
+        Print.info("Use your package manager to install updates: npm/pnpm update slicejs-cli slicejs-web-framework");
+        return true;
+    }
+
+    /**
+     * Display available updates in a formatted way
+     */
+    displayUpdates(updateInfo) {
+        if (!updateInfo || !updateInfo.hasUpdates) {
+            return;
+        }
+
+        console.log('');
+        Print.warning('📦 Available Updates:');
+        console.log('');
+
+        updateInfo.updates.forEach(pkg => {
+            console.log(`   ${pkg.type === 'cli' ? '🔧' : '⚡'} ${pkg.displayName}`);
+            console.log(`      ${pkg.current} → ${pkg.latest}`);
+        });
+
+        console.log('');
+        console.log('   📚 Changelog: https://github.com/VKneider/slice.js/releases');
+        console.log('');
+    }
+
+    /**
+     * Prompt user to select which packages to update
+     */
+    async promptForUpdates(updateInfo, options = {}) {
+        if (!updateInfo || !updateInfo.hasUpdates) {
+            return [];
+        }
+
+        // If --yes flag is set, return all updates
+        if (options.yes) {
+            return updateInfo.updates.map(pkg => pkg.name);
+        }
+
+        // If specific package flags are set
+        if (options.cli || options.framework) {
+            const selected = [];
+            if (options.cli) {
+                const cliUpdate = updateInfo.updates.find(pkg => pkg.type === 'cli');
+                if (cliUpdate) selected.push(cliUpdate.name);
+            }
+            if (options.framework) {
+                const frameworkUpdate = updateInfo.updates.find(pkg => pkg.type === 'framework');
+                if (frameworkUpdate) selected.push(frameworkUpdate.name);
+            }
+            return selected;
+        }
+
+        // Interactive selection
+        const choices = updateInfo.updates.map(pkg => ({
+            name: `${pkg.displayName} (${pkg.current} → ${pkg.latest})`,
+            value: pkg.name,
+            checked: true
+        }));
+
+        const answers = await inquirer.prompt([
+            {
+                type: 'checkbox',
+                name: 'packages',
+                message: 'Which packages do you want to update?',
+                choices,
+                validate: (answer) => {
+                    if (answer.length === 0) {
+                        return 'You must select at least one package';
+                    }
+                    return true;
+                }
+            }
+        ]);
+
+        return answers.packages;
+    }
+
+    async buildUpdatePlan(packages) {
+        const plan = [];
+        const info = await this.detectCliInstall();
+        const pm = info.packageManager || this.getPackageManager();
+        for (const pkg of packages) {
+            if (pkg === 'slicejs-cli' && info.type === 'global') {
+                plan.push({ package: pkg, target: 'global', command: installCommand(pm, 'slicejs-cli@latest', { global: true }) });
+            } else {
+                plan.push({ package: pkg, target: 'project', command: installCommand(pm, `${pkg}@latest`) });
+            }
+        }
+        return plan;
+    }
+
+    /**
+     * Execute npm update command for a specific package
+     */
+    async updatePackage(packageName) {
+        try {
+            const pm = this.getPackageManager();
+            let installCmd = installCommand(pm, `${packageName}@latest`);
+            let options = {};
+
+            if (packageName === 'slicejs-cli') {
+                const info = await this.detectCliInstall();
+                if (info.type === 'global') {
+                    const globalPm = info.packageManager || pm;
+                    installCmd = installCommand(globalPm, 'slicejs-cli@latest', { global: true });
+                } else {
+                    options.cwd = info.projectRoot || getProjectRoot(import.meta.url);
+                }
+            } else {
+                options.cwd = getProjectRoot(import.meta.url);
+            }
+
+            // Install directly — npm/pnpm upgrade in place. (We used to uninstall
+            // first, which left the project without the package whenever the
+            // subsequent install failed, e.g. offline or under a release-age policy.)
+            const { stdout, stderr } = await execAsync(installCmd, options);
+
+            return {
+                success: true,
+                packageName,
+                stdout,
+                stderr
+            };
+        } catch (error) {
+            return {
+                success: false,
+                packageName,
+                error: error.message
+            };
+        }
+    }
+
+    /**
+     * Update multiple packages with progress indication
+     */
+    async installUpdates(packages) {
+        const results = [];
+
+        for (const packageName of packages) {
+            const spinner = ora(`Updating ${packageName}...`).start();
+
+            try {
+                const result = await this.updatePackage(packageName);
+
+                if (result.success) {
+                    spinner.succeed(`${packageName} updated successfully`);
+                    results.push({ packageName, success: true });
+                } else {
+                    spinner.fail(`Error updating ${packageName}`);
+                    Print.error(`Details: ${result.error}`);
+                    results.push({ packageName, success: false, error: result.error });
+                }
+            } catch (error) {
+                spinner.fail(`Error updating ${packageName}`);
+                Print.error(`Details: ${error.message}`);
+                results.push({ packageName, success: false, error: error.message });
+            }
+        }
+
+        return results;
+    }
+
+    /**
+     * Main method to check and prompt for updates
+     */
+    async checkAndPromptUpdates(options = {}) {
+        const spinner = ora('Checking for updates...').start();
+
+        try {
+            const updateInfo = await this.checkForUpdates();
+            spinner.stop();
+
+            if (!updateInfo) {
+                Print.error('Could not check for updates. Verify your internet connection.');
+                return false;
+            }
+
+            if (updateInfo.allCurrent || !updateInfo.hasUpdates) {
+                Print.success('✅ All components are up to date!');
+                // --update-api works even when no package update runs.
+                if (options.updateApi) {
+                    await this.updateApiIndexIfNeeded(options);
+                }
+                return true;
+            }
+
+            // Display available updates
+            this.displayUpdates(updateInfo);
+
+        // Get packages to update
+        const packagesToUpdate = await this.promptForUpdates(updateInfo, options);
+
+            if (!packagesToUpdate || packagesToUpdate.length === 0) {
+                Print.info('No packages selected for update.');
+                return false;
+            }
+
+        // Show plan and confirm installation if not auto-confirmed
+        let plan = await this.buildUpdatePlan(packagesToUpdate);
+        console.log('');
+        Print.info('🧭 Update plan:');
+        plan.forEach(item => {
+            const where = item.target === 'global' ? 'GLOBAL' : 'PROJECT';
+            console.log(`   • ${item.package} → ${where}`);
+            console.log(`     ${item.command}`);
+        });
+        console.log('');
+
+        const cliInfo = await this.detectCliInstall();
+        if (cliInfo.type === 'global' && !packagesToUpdate.includes('slicejs-cli')) {
+            if (!options.yes && !options.cli) {
+                const { addCli } = await inquirer.prompt([
+                    {
+                        type: 'confirm',
+                        name: 'addCli',
+                    message: 'Global CLI detected. Add the global CLI update to the plan?',
+                    default: true
+                }
+            ]);
+                if (addCli) {
+                    packagesToUpdate.push('slicejs-cli');
+                    plan = await this.buildUpdatePlan(packagesToUpdate);
+                    console.log('');
+                    Print.info('🧭 Updated plan:');
+                    plan.forEach(item => {
+                        const where = item.target === 'global' ? 'GLOBAL' : 'PROJECT';
+                        console.log(`   • ${item.package} → ${where}`);
+                        console.log(`     ${item.command}`);
+                    });
+                    console.log('');
+                }
+            } else {
+                Print.warning('Global CLI detected. It is recommended to update slicejs-cli globally to keep aligned with the framework.');
+                console.log(`   Suggestion: ${installCommand(cliInfo.packageManager || this.getPackageManager(), 'slicejs-cli@latest', { global: true })}`);
+                console.log('');
+            }
+        }
+
+        if (!options.yes && !options.cli && !options.framework) {
+            const { confirm } = await inquirer.prompt([
+                {
+                    type: 'confirm',
+                    name: 'confirm',
+                    message: 'Do you want to proceed with the update according to the plan shown?',
+                    default: true
+                }
+            ]);
+
+                if (!confirm) {
+                    Print.info('Update cancelled.');
+                    return false;
+                }
+            }
+
+            console.log(''); // Line break
+            Print.info('📥 Installing updates...');
+            console.log('');
+
+            // Install updates
+            const results = await this.installUpdates(packagesToUpdate);
+
+            // Summary
+            console.log('');
+            const successCount = results.filter(r => r.success).length;
+            const failCount = results.filter(r => !r.success).length;
+
+            if (failCount === 0) {
+                Print.success(`✅ ${successCount} package(s) updated successfully!`);
+            } else {
+                Print.warning(`⚠️  ${successCount} successful, ${failCount} failed`);
+            }
+
+            if (successCount > 0) {
+                console.log('');
+                Print.info('💡 It is recommended to restart the development server if it is running.');
+            }
+
+            const frameworkUpdated = results.find(r => r.packageName === 'slicejs-web-framework' && r.success);
+            if (frameworkUpdated || options.updateApi) {
+                await this.updateApiIndexIfNeeded(options);
+            }
+
+            return failCount === 0;
+
+        } catch (error) {
+            spinner.stop();
+            Print.error(`Error during update: ${error.message}`);
+            return false;
+        }
+    }
+
+    async updateApiIndexIfNeeded(options = {}) {
+        try {
+            const projectApiPath = getApiPath(import.meta.url, 'index.js');
+            const frameworkApiPath = getPath(import.meta.url, 'node_modules', 'slicejs-web-framework', 'api', 'index.js');
+
+            if (!await fs.pathExists(projectApiPath) || !await fs.pathExists(frameworkApiPath)) {
+                return;
+            }
+
+            const projectContent = await fs.readFile(projectApiPath, 'utf-8');
+            const frameworkContent = await fs.readFile(frameworkApiPath, 'utf-8');
+
+            if (projectContent === frameworkContent) {
+                return;
+            }
+
+            Print.warning('⚠️ Detected changes in framework api/index.js.');
+
+            // Overwriting api/index.js is opt-in: `--update-api` is the only way
+            // to auto-confirm. `-y/--yes` deliberately does NOT imply it — the
+            // project file may carry local changes, so a blanket "yes to updates"
+            // must not silently replace it.
+            let confirmUpdate = options.updateApi === true;
+            if (!confirmUpdate && options.yes === true) {
+                Print.info('Skipping api/index.js update (not updated by default).');
+                Print.info('Use --update-api to overwrite api/index.js from the framework template.');
+                return;
+            }
+            if (!confirmUpdate) {
+                const answers = await inquirer.prompt([
+                    {
+                        type: 'confirm',
+                        name: 'confirm',
+                        message: 'Update your project api/index.js to the latest framework version?',
+                        default: false
+                    }
+                ]);
+                confirmUpdate = answers.confirm;
+            }
+
+            if (!confirmUpdate) {
+                Print.info('Skipping api/index.js update.');
+                return;
+            }
+
+            const backupPath = `${projectApiPath}.bak`;
+            await fs.copy(projectApiPath, backupPath);
+            await fs.writeFile(projectApiPath, frameworkContent, 'utf-8');
+            Print.success('✅ api/index.js updated from framework template.');
+            Print.info(`Backup created at ${backupPath}`);
+        } catch (error) {
+            Print.error(`Failed to update api/index.js: ${error.message}`);
+        }
+    }
+}
+
+// Singleton instance
+const updateManager = new UpdateManager();
+
+export default updateManager;

package/slicejs-cli/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "slicejs-cli",
+  "version": "3.6.6",
+  "description": "Command client for developing web applications with Slice.js framework",
+  "main": "client.js",
+  "bin": {
+    "slice": "./client.js"
+  },
+  "engines": {
+    "node": ">=20.0.0"
+  },
+  "files": [
+    "client.js",
+    "commands",
+    "assets"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/vkneider/slicejs-cli.git"
+  },
+  "scripts": {
+    "test": "node --test",
+    "slice:dev": "slice dev",
+    "slice:build": "slice build",
+    "slice:start": "slice start",
+    "slice:create": "slice component create",
+    "slice:list": "slice component list",
+    "slice:delete": "slice component delete",
+    "slice:init": "slice init",
+    "slice:get": "slice get",
+    "slice:browse": "slice browse",
+    "slice:sync": "slice sync",
+    "slice:version": "slice version",
+    "slice:types": "slice types generate",
+    "slice:doctor": "node ./node_modules/slicejs-cli/client.js doctor",
+    "slice:help": "node ./node_modules/slicejs-cli/client.js --help"
+  },
+  "keywords": [
+    "framework",
+    "web",
+    "client",
+    "cli",
+    "slice",
+    "slicejs",
+    "component",
+    "development server"
+  ],
+  "author": "vkneider",
+  "type": "module",
+  "packageManager": "pnpm@11.1.1",
+  "preferGlobal": false,
+  "license": "ISC",
+  "dependencies": {
+    "@babel/parser": "^7.28.5",
+    "@babel/traverse": "^7.28.5",
+    "chalk": "^5.6.2",
+    "chokidar": "^3.6.0",
+    "clean-css": "^5.3.3",
+    "cli-table3": "^0.6.5",
+    "commander": "^12.0.0",
+    "fs-extra": "^11.2.0",
+    "html-minifier-terser": "^7.2.0",
+    "inquirer": "^12.4.2",
+    "ora": "^8.2.0",
+    "slicejs-web-framework": "latest",
+    "terser": "^5.43.1"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.60.0"
+  }
+}

package/slicejs-cli/playwright.config.js

@@ -0,0 +1,51 @@
+import { defineConfig, devices } from '@playwright/test';
+
+const PORT = process.env.E2E_PORT ? Number(process.env.E2E_PORT) : 3210;
+const UNMIN_PORT = PORT + 4;
+const BASE_URL = `http://127.0.0.1:${PORT}`;
+const UNMIN_URL = `http://127.0.0.1:${UNMIN_PORT}`;
+
+export default defineConfig({
+  testDir: './tests/e2e',
+  testMatch: '**/*.spec.js',
+  fullyParallel: false,
+  workers: 1,
+  timeout: 30_000,
+  expect: { timeout: 10_000 },
+  reporter: process.env.CI ? [['list'], ['html', { open: 'never' }]] : [['list']],
+  use: {
+    trace: 'retain-on-failure',
+  },
+  projects: [
+    {
+      name: 'chromium',
+      testIgnore: '**/unminified.spec.js',
+      use: { ...devices['Desktop Chrome'], baseURL: BASE_URL },
+    },
+    {
+      name: 'chromium-unminified',
+      testMatch: '**/unminified.spec.js',
+      use: { ...devices['Desktop Chrome'], baseURL: UNMIN_URL },
+    },
+  ],
+  webServer: [
+    {
+      command: 'node tests/e2e/serve.mjs',
+      url: `${BASE_URL}/slice-env.json`,
+      env: { E2E_PORT: String(PORT) },
+      timeout: 120_000,
+      reuseExistingServer: !process.env.CI,
+      stdout: 'pipe',
+      stderr: 'pipe',
+    },
+    {
+      command: 'node tests/e2e/serve.mjs',
+      url: `${UNMIN_URL}/slice-env.json`,
+      env: { E2E_PORT: String(UNMIN_PORT), E2E_MINIFY: 'false' },
+      timeout: 120_000,
+      reuseExistingServer: !process.env.CI,
+      stdout: 'pipe',
+      stderr: 'pipe',
+    },
+  ],
+});