@networkpro/web 1.3.0 → 1.4.2

package/_redirects

@@ -0,0 +1 @@
+https://www.netwk.pro/*  https://netwk.pro/:splat  301

package/eslint.config.mjs

@@ -75,6 +75,17 @@ export default [
       "jsdoc/check-types": "warn", // Checks if types in JSDoc are defined correctly
       "jsdoc/require-param": "warn", // Requires @param in JSDoc
       "jsdoc/require-returns": "warn", // Requires @returns in JSDoc
+      "jsdoc/require-jsdoc": [
+        "warn",
+        {
+          publicOnly: true,
+          require: {
+            FunctionDeclaration: true,
+            MethodDefinition: true,
+            ClassDeclaration: true,
+          },
+        },
+      ],
     },
   },
 

package/package.json

@@ -2,7 +2,7 @@
   "name": "@networkpro/web",
   "private": false,
   "sideEffects": false,
-  "version": "1.3.0",
+  "version": "1.4.2",
   "description": "Locking Down Networks, Unlocking Confidence | Security, Networking, Privacy — Network Pro Strategies",
   "keywords": [
     "security",
@@ -30,41 +30,61 @@
   },
   "type": "module",
   "engines": {
-    "node": ">=22"
+    "node": ">=22.0.0 <25",
+    "npm": ">=11.0.0 <12"
   },
-  "main": "src/app.html",
   "style": "src/lib/styles/global.min.css",
-  "scripts": {
-    "upgrade": "npx npm-check-updates -u",
-    "dev": "vite dev",
-    "build": "vite build",
-    "build:netlify": "netlify build",
-    "preview": "vite preview",
-    "prepare": "svelte-kit sync || echo ''",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
-    "clean": "rm -rf build/* node_modules package-lock.json && npm install",
-    "format": "prettier --check .",
-    "format:fix": "prettier --write .",
-    "lint": "eslint --ext .mjs,.js,.svelte --config eslint.config.mjs .",
-    "lint:fix": "eslint --ext .mjs,.js,.svelte --config eslint.config.mjs . --fix",
-    "lint:md": "npx markdownlint-cli2 \"**/*.{md,markdown}\" \"#node_modules/**\" \"#build/**\"",
-    "lint:css": "stylelint \"**/*.{css,svelte}\" --ignore-path .stylelintignore",
-    "lint:all": "npm run lint && npm run lint:md && npm run lint:css && npm run format",
-    "lhci": "lhci",
-    "lighthouse": "npm run lighthouse:local",
-    "lighthouse:local": "npm run build && npm run preview & wait-on http://localhost:4173 && npm run lhci:run",
-    "lhci:run": "lhci autorun --config=.lighthouserc.cjs",
-    "test": "npm run test:all",
-    "test:all": "npm run test:client -- --run && npm run test:server -- --run",
-    "test:client": "vitest --config vitest.config.client.js",
-    "test:server": "vitest --config vitest.config.server.js",
-    "test:watch": "vitest --config vitest.config.client.js --watch",
-    "test:coverage": "npm run test:client -- --run --coverage && npm run test:server -- --run --coverage",
-    "css:bundle": "node scripts/bundleCss.js",
-    "head:flatten": "node scripts/flattenHeaders.js",
-    "head:validate": "node scripts/validateHeaders.js",
-    "checkout": "npm run test:all && npm run lint:all && npm run check"
+"scripts": {
+  "dev": "vite dev",
+  "preview": "vite preview",
+  "start": "npm run dev",
+
+  "build": "vite build",
+  "build:netlify": "netlify build",
+  "css:bundle": "node scripts/bundleCss.js",
+
+  "prepare": "svelte-kit sync || echo ''",
+  "check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
+  "check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
+  "check:env": "node scripts/checkEnv.js",
+  "check:node": "node scripts/checkNode.js",
+
+  "checkout": "npm run check:node && npm run test:all && npm run lint:all && npm run check && npm run audit:scripts",
+  "verify": "npm run checkout",
+
+  "delete": "rm -rf build .svelte-kit node_modules package-lock.json",
+  "clean": "npm run delete && npm cache clean --force && npm install",
+  "upgrade": "npx npm-check-updates -u",
+
+  "test": "npm run test:all",
+  "test:all": "npm run test:client -- --run && npm run test:server -- --run",
+  "test:client": "vitest --config vitest.config.client.js",
+  "test:server": "vitest --config vitest.config.server.js",
+  "test:watch": "vitest --config vitest.config.client.js --watch",
+  "test:coverage": "npm run test:client -- --run --coverage && npm run test:server -- --run --coverage",
+
+  "lint": "eslint . --ext .mjs,.js,.svelte",
+  "lint:fix": "eslint . --ext .mjs,.js,.svelte --fix",
+  "lint:jsdoc": "eslint . --ext .js,.mjs,.svelte --max-warnings=0",
+  "lint:css": "stylelint \"**/*.{css,svelte}\" --ignore-path .stylelintignore",
+  "lint:md": "npx markdownlint-cli2 \"**/*.{md,markdown}\" \"#node_modules/**\" \"#build/**\"",
+  "lint:all": "npm run lint && npm run lint:md && npm run lint:css && npm run format",
+  "format": "prettier --check .",
+  "format:fix": "prettier --write .",
+
+  "lhci": "lhci",
+  "lighthouse": "npm run lighthouse:local",
+  "lighthouse:local": "npm run build && npm run preview & wait-on http://localhost:4173 && npm run lhci:run",
+  "lhci:run": "lhci autorun --config=.lighthouserc.cjs",
+
+  "audit:scripts": "node scripts/auditScripts.js",
+  "head:flatten": "node scripts/flattenHeaders.js",
+  "head:validate": "node scripts/validateHeaders.js",
+
+  "postinstall": "npm run check:node"
+},
+  "dependencies": {
+    "svelte": "5.31.1"
   },
   "devDependencies": {
     "@eslint/compat": "^1.2.9",
@@ -72,21 +92,20 @@
     "@netlify/plugin-sitemap": "^0.8.1",
     "@playwright/test": "^1.52.0",
     "@sveltejs/adapter-netlify": "^5.0.2",
-    "@sveltejs/kit": "^2.21.1",
-    "@sveltejs/vite-plugin-svelte": "^5.0.3",
+    "@sveltejs/kit": "2.21.1",
+    "@sveltejs/vite-plugin-svelte": "5.0.3",
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/svelte": "^5.2.7",
-    "@vitest/coverage-v8": "^3.1.3",
+    "@testing-library/svelte": "^5.2.8",
+    "@vitest/coverage-v8": "^3.1.4",
     "autoprefixer": "^10.4.21",
     "browserslist": "^4.24.5",
     "eslint": "^9.27.0",
     "eslint-config-prettier": "^10.1.5",
     "eslint-plugin-jsdoc": "^50.6.17",
-    "eslint-plugin-svelte": "^3.8.1",
+    "eslint-plugin-svelte": "^3.8.2",
     "globals": "^16.1.0",
     "jsdom": "^26.1.0",
     "lightningcss": "^1.30.1",
-    "lightningcss-cli": "^1.30.1",
     "markdownlint": "^0.38.0",
     "markdownlint-cli2": "^0.18.1",
     "mdsvex": "^0.12.6",
@@ -95,18 +114,18 @@
     "postcss-html": "^1.8.0",
     "prettier": "^3.5.3",
     "prettier-plugin-svelte": "^3.4.0",
+    "semver": "^7.7.2",
     "stylelint": "^16.19.1",
     "stylelint-config-html": "^1.1.0",
     "stylelint-config-recommended": "^16.0.0",
     "stylelint-order": "^7.0.0",
-    "svelte": "^5.30.2",
     "svelte-check": "^4.2.1",
     "svelte-eslint-parser": "^1.2.0",
     "svelte-preprocess": "^6.0.3",
     "typescript": "^5.8.3",
     "vite": "^6.3.5",
     "vite-plugin-lightningcss": "^0.0.5",
-    "vitest": "^3.1.3"
+    "vitest": "^3.1.4"
   },
   "overrides": {
     "@sveltejs/kit": {

package/playwright.config.js

@@ -12,7 +12,8 @@ import { defineConfig, devices } from "@playwright/test";
  * @see https://playwright.dev/docs/test-configuration
  */
 export default defineConfig({
-  testDir: "./tests",
+  testDir: "./tests/e2e",
+  testMatch: "*.spec.js",
 
   /* Run tests in files in parallel */
   fullyParallel: true,

package/scripts/auditScripts.js

@@ -0,0 +1,94 @@
+/* ==========================================================================
+scripts/auditScripts.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * Audit for untested script modules in scripts/
+ * Looks for any .js/.mjs files without a matching test in tests/
+ *
+ * @module scripts/
+ * @author SunDevil311
+ * @updated 2025-05-21
+ */
+
+import fs from "fs";
+import path from "path";
+
+const scriptsDir = path.resolve("./scripts");
+const testsDir = path.resolve("./tests");
+
+// Scripts intentionally excluded from test coverage
+const allowList = new Set([
+  "checkNode.js",
+  "auditScripts.js", // itself
+]);
+
+// Recursively gather all test files
+function getAllTestFiles(dir) {
+  const entries = fs.readdirSync(dir, { withFileTypes: true });
+  const files = [];
+
+  for (const entry of entries) {
+    const fullPath = path.join(dir, entry.name);
+    if (entry.isDirectory()) {
+      files.push(...getAllTestFiles(fullPath));
+    } else if (
+      entry.isFile() &&
+      (entry.name.endsWith(".test.js") ||
+        entry.name.endsWith(".spec.js") ||
+        entry.name.endsWith(".test.mjs") ||
+        entry.name.endsWith(".spec.mjs"))
+    ) {
+      files.push(fullPath);
+    }
+  }
+
+  return files;
+}
+
+// Get base names of tested modules (no extension or test specifier)
+const testFiles = getAllTestFiles(testsDir);
+const testedModules = new Set(
+  testFiles.map((filePath) =>
+    path
+      .basename(filePath)
+      .replace(/\.test\.js$|\.spec\.js$|\.test\.mjs$|\.spec\.mjs$/, ""),
+  ),
+);
+
+// Gather all scripts (.js and .mjs)
+const scriptFiles = fs
+  .readdirSync(scriptsDir)
+  .filter((file) => file.endsWith(".js") || file.endsWith(".mjs"));
+
+const untested = scriptFiles.filter((file) => {
+  const base = file.replace(/\.(js|mjs)$/, "");
+  return !allowList.has(file) && !testedModules.has(base);
+});
+
+const pathRelative = (file) =>
+  path.relative(process.cwd(), path.join(scriptsDir, file));
+
+// Output results
+if (untested.length) {
+  console.warn("\n⚠ Untested script files detected:\n");
+
+  untested.forEach((file) => {
+    const filePath = pathRelative(file);
+    console.warn(
+      `::warning file=${filePath},line=1,col=1::Missing test file for ${file}`,
+    );
+  });
+
+  console.warn(
+    `\nAdd a corresponding test file in /tests (e.g., ${untested[0].replace(
+      /\.(js|mjs)$/,
+      ".test.js",
+    )})`,
+  );
+} else {
+  console.log("✅ All script files have corresponding tests.");
+}

package/scripts/checkEnv.js

@@ -0,0 +1,66 @@
+/* ==========================================================================
+scripts/checkEnv.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * Utility to validate execution environment
+ * Ensures `ENV_MODE` is defined and matches allowed environments
+ *
+ * @module scripts/
+ * @author SunDevil311
+ * @updated 2025-05-21
+ */
+
+import { basename } from "path";
+import { fileURLToPath } from "url";
+
+const validEnvs = new Set(["dev", "test", "ci", "prod", "preview"]);
+
+/**
+ * Checks and returns validation for ENV_MODE
+ * @returns {{
+ *   mode: string,
+ *   valid: boolean,
+ *   wasDefaulted: boolean,
+ *   allowed: string[]
+ * }}
+ */
+export function checkEnv() {
+  const current = process.env.ENV_MODE;
+  let mode = current;
+  let valid = false;
+  let wasDefaulted = false;
+
+  if (!mode) {
+    mode = "dev";
+    process.env.ENV_MODE = mode;
+    wasDefaulted = true;
+    console.warn("⚠️ ENV_MODE not set. Defaulting to 'dev'.");
+  }
+
+  valid = validEnvs.has(mode);
+
+  if (valid) {
+    const tag = wasDefaulted ? "[info]" : "[ok]";
+    console.log(`${tag} ENV_MODE is set to: "${mode}"`);
+  } else {
+    console.error(
+      `❌ Invalid ENV_MODE "${mode}". Must be one of: ${[...validEnvs].join(", ")}`,
+    );
+  }
+
+  return {
+    mode,
+    valid,
+    wasDefaulted,
+    allowed: [...validEnvs].sort(),
+  };
+}
+
+// ✅ Run only if called directly via CLI
+if (basename(fileURLToPath(import.meta.url)) === basename(process.argv[1])) {
+  checkEnv();
+}

package/scripts/checkNode.js

@@ -0,0 +1,54 @@
+/* ==========================================================================
+scripts/checkNode.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * Utility to check Node.js and NPM version
+ * Ensures the current environment matches the required versions from package.json
+ *
+ * @module scripts/
+ * @author SunDevil311
+ * @updated 2025-05-20
+ */
+
+import { execSync } from "child_process";
+import fs from "fs";
+import path from "path";
+import semver from "semver";
+
+// Load engines from package.json
+const pkg = JSON.parse(fs.readFileSync(path.resolve("./package.json"), "utf8"));
+const { node: nodeRange, npm: npmRange } = pkg.engines;
+
+// Check Node version
+if (!semver.satisfies(process.version, nodeRange)) {
+  console.error(
+    `⚠️ Node version ${process.version} does not match required range: ${nodeRange}`,
+  );
+  process.exit(1);
+}
+
+// Check NPM version
+let npmVersion;
+
+try {
+  npmVersion = execSync("npm --version").toString().trim();
+  if (!semver.satisfies(npmVersion, npmRange)) {
+    console.error(
+      `⚠️ NPM version ${npmVersion} does not match required range: ${npmRange}`,
+    );
+    process.exit(1);
+  }
+} catch (err) {
+  console.error("❌ Failed to check NPM version:", err.message);
+  process.exit(1);
+}
+
+if (!process.env.CI || process.env.VERBOSE === "true") {
+  console.log(
+    `✅ Node (${process.version}) matches ${nodeRange}, and NPM (${npmVersion}) matches ${npmRange}`,
+  );
+}

package/scripts/checkVersions.js

@@ -0,0 +1,58 @@
+/* ==========================================================================
+scripts/checkVersions.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * Utility to check Node.js and NPM version (non-blocking)
+ * Returns version info, can be unit tested, and doesn't kill process during
+ * test runs
+ *
+ * @module scripts/
+ * @author SunDevil311
+ * @updated 2025-05-20
+ */
+
+import { execSync } from "child_process";
+import fs from "fs";
+import path from "path";
+import semver from "semver";
+
+/**
+ * @typedef {object} VersionCheckResult
+ * @property {string} nodeVersion
+ * @property {string} npmVersion
+ * @property {string} nodeRange
+ * @property {string} npmRange
+ * @property {boolean} nodeValid
+ * @property {boolean} npmValid
+ */
+
+/**
+ * Returns an object with validation results for Node and NPM versions.
+ *
+ * @returns {VersionCheckResult}
+ */
+export function checkVersions() {
+  const pkg = JSON.parse(
+    fs.readFileSync(path.resolve("./package.json"), "utf8"),
+  );
+  const { node: nodeRange, npm: npmRange } = pkg.engines;
+
+  const nodeVersion = process.version;
+  const npmVersion = execSync("npm --version").toString().trim();
+
+  const nodeValid = semver.satisfies(nodeVersion, nodeRange);
+  const npmValid = semver.satisfies(npmVersion, npmRange);
+
+  return {
+    nodeVersion,
+    npmVersion,
+    nodeRange,
+    npmRange,
+    nodeValid,
+    npmValid,
+  };
+}

package/src/lib/components/foss/FossItemContent.svelte

@@ -6,6 +6,8 @@ This file is part of Network Pro.
 ========================================================================== -->
 
 <script>
+  /* eslint-disable svelte/no-at-html-tags */
+
   import FossFeatures from "$lib/components/foss/FossFeatures.svelte";
   // Import directly from $lib by way of image utility
   import { obtainiumPng, obtainiumWbp } from "$lib";
@@ -85,14 +87,17 @@ This file is part of Network Pro.
 
   <h3>{fossItem.headline}</h3>
 
-  {@html fossItem.headlineDescription}
+  <!-- Trusted input, from internal CMS -->
+  {@html fossItem.detailsDescription}
 
   <FossFeatures features={fossItem.features} />
 
+  <!-- Trusted input, from internal CMS -->
   {@html fossItem.detailsDescription}
 
   {#each fossItem.notes as note}
     <blockquote class="bquote">
+      <!-- Trusted input, from internal CMS -->
       {@html note}
     </blockquote>
   {/each}

package/static/robots.txt

@@ -6,7 +6,22 @@
 # www.robotstxt.org/
 
 User-agent: *
-Disallow: *.jsonc$
-Disallow: *.json$
-Disallow: *.mjs$
-Disallow: *.js$
+
+# Disallow dev and CI/CD artifacts
+Disallow: /tests/
+Disallow: /scripts/
+Disallow: /playwright-report/
+Disallow: /reports/
+Disallow: /coverage/
+Disallow: /build/
+Disallow: /.lighthouseci/
+
+# Disallow stub routes that redirect externally
+Disallow: /contact
+Disallow: /privacy-rights
+
+# Allow everything else
+Allow: /
+
+# Inform bots where to find the sitemap
+Sitemap: https://netwk.pro/sitemap.xml

package/tests/{app.spec.js → e2e/app.spec.js}

@@ -1,5 +1,5 @@
 /* ==========================================================================
-src/app.spec.js
+tests/e2e/app.spec.js
 
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.

package/tests/{mobile.spec.js → e2e/mobile.spec.js}

@@ -1,5 +1,5 @@
 /* ==========================================================================
-src/mobile.spec.js
+tests/e2e/mobile.spec.js
 
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.

package/tests/unit/auditScripts.test.js

@@ -0,0 +1,42 @@
+/* ==========================================================================
+tests/unit/auditScripts.test.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * Unit test for scripts/auditScripts.js
+ */
+
+import fs from "fs";
+import path from "path";
+import { describe, expect, it } from "vitest";
+
+describe("auditScripts.js", () => {
+  it("should identify untested scripts correctly", () => {
+    const scriptsDir = path.resolve("./scripts");
+    const testsDir = path.resolve("./tests");
+
+    const allowList = new Set(["checkNode.js", "auditScripts.js"]);
+
+    const scriptFiles = fs
+      .readdirSync(scriptsDir)
+      .filter((file) => file.endsWith(".js"));
+
+    const testFiles = fs
+      .readdirSync(testsDir)
+      .filter((file) => file.endsWith(".test.js") || file.endsWith(".spec.js"));
+
+    const testedModules = new Set(
+      testFiles.map((f) => f.replace(/\.test\.js$|\.spec\.js$/, "")),
+    );
+
+    const untested = scriptFiles.filter((file) => {
+      const base = file.replace(/\.js$/, "");
+      return !allowList.has(file) && !testedModules.has(base);
+    });
+
+    expect(untested).not.toContain("auditScripts.js");
+  });
+});

package/tests/unit/checkEnv.test.js

@@ -0,0 +1,48 @@
+/* ==========================================================================
+tests/unit/checkEnv.test.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * Unit test for scripts/checkEnv.js
+ */
+
+import { afterEach, describe, expect, it } from "vitest";
+import { checkEnv } from "../../scripts/checkEnv.js";
+
+describe("checkEnv()", () => {
+  const originalEnv = process.env.ENV_MODE;
+
+  afterEach(() => {
+    if (originalEnv === undefined) {
+      delete process.env.ENV_MODE;
+    } else {
+      process.env.ENV_MODE = originalEnv;
+    }
+  });
+
+  it("should default to 'dev' if ENV_MODE is not set", () => {
+    delete process.env.ENV_MODE;
+    const result = checkEnv();
+    expect(result.mode).toBe("dev");
+    expect(result.valid).toBe(true);
+    expect(result.wasDefaulted).toBe(true);
+  });
+
+  it("should validate a correct ENV_MODE", () => {
+    process.env.ENV_MODE = "ci";
+    const result = checkEnv();
+    expect(result.mode).toBe("ci");
+    expect(result.valid).toBe(true);
+    expect(result.wasDefaulted).toBe(false);
+  });
+
+  it("should return invalid for an unknown ENV_MODE", () => {
+    process.env.ENV_MODE = "banana";
+    const result = checkEnv();
+    expect(result.valid).toBe(false);
+    expect(result.allowed).toContain("dev");
+  });
+});

package/tests/unit/checkVersions.test.js

@@ -0,0 +1,24 @@
+/* ==========================================================================
+tests/unit/checkVersions.test.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * Unit test for scripts/checkVersions.js
+ */
+
+import { describe, expect, it } from "vitest";
+import { checkVersions } from "../../scripts/checkVersions.js";
+
+describe("checkVersions()", () => {
+  it("should match current Node and NPM versions to engine ranges", () => {
+    const result = checkVersions();
+
+    expect(result.nodeVersion).toMatch(/^v\d+\.\d+\.\d+$/);
+    expect(result.npmVersion).toMatch(/^\d+\.\d+\.\d+$/);
+    expect(result.nodeValid).toBe(true);
+    expect(result.npmValid).toBe(true);
+  });
+});

package/{src/demo.spec.js → tests/unit/demo.test.js}

@@ -1,5 +1,5 @@
 /* ==========================================================================
-src/demo.spec.js
+tests/unit/demo.spec.js
 
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.

package/{src → tests/unit}/routes/page.svelte.test.js

@@ -1,5 +1,5 @@
 /* ==========================================================================
-src/routes/page.svelte.test.js
+tests/unit/routes/page.svelte.test.js
 
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
@@ -8,7 +8,7 @@ This file is part of Network Pro.
 import "@testing-library/jest-dom/vitest";
 import { render, screen } from "@testing-library/svelte";
 import { describe, expect, test } from "vitest";
-import Page from "./+page.svelte";
+import Page from "../../../src/routes/+page.svelte";
 
 describe("/+page.svelte", () => {
   test("should render the home page section", () => {

package/vite.config.js

@@ -1,3 +1,10 @@
+/* =========================================================================
+vite.config.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================= */
+
 import { sveltekit } from "@sveltejs/kit/vite";
 import { defineConfig } from "vite";
 import lightningcssPlugin from "vite-plugin-lightningcss";

package/vitest.config.client.js

@@ -1,3 +1,10 @@
+/* =========================================================================
+vitest.config.client.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================= */
+
 import { sveltekit } from "@sveltejs/kit/vite";
 import { svelteTesting } from "@testing-library/svelte/vite";
 import lightningcssPlugin from "vite-plugin-lightningcss";
@@ -18,8 +25,8 @@ export default defineConfig({
     name: "client",
     environment: "jsdom",
     clearMocks: true,
-    include: ["src/**/*.svelte.{test,spec}.{js,mjs}"],
-    exclude: ["src/lib/server/**"],
+    include: ["tests/unit/**/*.svelte.test.{js,mjs}"],
+    exclude: [],
     setupFiles: ["./vitest-setup-client.js"],
     reporters: ["default", "json"],
     outputFile: {

package/vitest.config.server.js

@@ -1,3 +1,10 @@
+/* =========================================================================
+vitest.config.server.js
+
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================= */
+
 import { sveltekit } from "@sveltejs/kit/vite";
 import lightningcssPlugin from "vite-plugin-lightningcss";
 import { defineConfig } from "vitest/config";
@@ -15,8 +22,8 @@ export default defineConfig({
   test: {
     name: "server",
     environment: "node",
-    include: ["src/**/*.{test,spec}.{js,mjs}"],
-    exclude: ["src/**/*.svelte.{test,spec}.{js,mjs}"],
+    include: ["tests/unit/**/*.test.{js,mjs}"],
+    exclude: ["tests/unit/**/*.svelte.test.{js,mjs}"],
     reporters: ["default", "json"],
     outputFile: {
       json: "./reports/server/results.json",

package/tests-examples/demo-todo-app.spec.js

@@ -1,504 +0,0 @@
-/* ==========================================================================
-src/tests-examples/demo-todo-app.spec.js
-
-SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
-This file is part of Network Pro.
-========================================================================== */
-
-// @ts-check
-import { expect, test } from "@playwright/test";
-
-test.beforeEach(async ({ page }) => {
-  await page.goto("https://demo.playwright.dev/todomvc");
-});
-
-const TODO_ITEMS = [
-  "buy some cheese",
-  "feed the cat",
-  "book a doctors appointment",
-];
-
-test.describe("New Todo", () => {
-  test("should allow me to add todo items", async ({ page }) => {
-    // create a new todo locator
-    const newTodo = page.getByPlaceholder("What needs to be done?");
-
-    // Create 1st todo.
-    await newTodo.fill(TODO_ITEMS[0]);
-    await newTodo.press("Enter");
-
-    // Make sure the list only has one todo item.
-    await expect(page.getByTestId("todo-title")).toHaveText([TODO_ITEMS[0]]);
-
-    // Create 2nd todo.
-    await newTodo.fill(TODO_ITEMS[1]);
-    await newTodo.press("Enter");
-
-    // Make sure the list now has two todo items.
-    await expect(page.getByTestId("todo-title")).toHaveText([
-      TODO_ITEMS[0],
-      TODO_ITEMS[1],
-    ]);
-
-    await checkNumberOfTodosInLocalStorage(page, 2);
-  });
-
-  test("should clear text input field when an item is added", async ({
-    page,
-  }) => {
-    // create a new todo locator
-    const newTodo = page.getByPlaceholder("What needs to be done?");
-
-    // Create one todo item.
-    await newTodo.fill(TODO_ITEMS[0]);
-    await newTodo.press("Enter");
-
-    // Check that input is empty.
-    await expect(newTodo).toBeEmpty();
-    await checkNumberOfTodosInLocalStorage(page, 1);
-  });
-
-  test("should append new items to the bottom of the list", async ({
-    page,
-  }) => {
-    // Create 3 items.
-    await createDefaultTodos(page);
-
-    // create a todo count locator
-    const todoCount = page.getByTestId("todo-count");
-
-    // Check test using different methods.
-    await expect(page.getByText("3 items left")).toBeVisible();
-    await expect(todoCount).toHaveText("3 items left");
-    await expect(todoCount).toContainText("3");
-    await expect(todoCount).toHaveText(/3/);
-
-    // Check all items in one call.
-    await expect(page.getByTestId("todo-title")).toHaveText(TODO_ITEMS);
-    await checkNumberOfTodosInLocalStorage(page, 3);
-  });
-});
-
-test.describe("Mark all as completed", () => {
-  test.beforeEach(async ({ page }) => {
-    await createDefaultTodos(page);
-    await checkNumberOfTodosInLocalStorage(page, 3);
-  });
-
-  test.afterEach(async ({ page }) => {
-    await checkNumberOfTodosInLocalStorage(page, 3);
-  });
-
-  test("should allow me to mark all items as completed", async ({ page }) => {
-    // Complete all todos.
-    await page.getByLabel("Mark all as complete").check();
-
-    // Ensure all todos have 'completed' class.
-    await expect(page.getByTestId("todo-item")).toHaveClass([
-      "completed",
-      "completed",
-      "completed",
-    ]);
-    await checkNumberOfCompletedTodosInLocalStorage(page, 3);
-  });
-
-  test("should allow me to clear the complete state of all items", async ({
-    page,
-  }) => {
-    const toggleAll = page.getByLabel("Mark all as complete");
-    // Check and then immediately uncheck.
-    await toggleAll.check();
-    await toggleAll.uncheck();
-
-    // Should be no completed classes.
-    await expect(page.getByTestId("todo-item")).toHaveClass(["", "", ""]);
-  });
-
-  test("complete all checkbox should update state when items are completed / cleared", async ({
-    page,
-  }) => {
-    const toggleAll = page.getByLabel("Mark all as complete");
-    await toggleAll.check();
-    await expect(toggleAll).toBeChecked();
-    await checkNumberOfCompletedTodosInLocalStorage(page, 3);
-
-    // Uncheck first todo.
-    const firstTodo = page.getByTestId("todo-item").nth(0);
-    await firstTodo.getByRole("checkbox").uncheck();
-
-    // Reuse toggleAll locator and make sure its not checked.
-    await expect(toggleAll).not.toBeChecked();
-
-    await firstTodo.getByRole("checkbox").check();
-    await checkNumberOfCompletedTodosInLocalStorage(page, 3);
-
-    // Assert the toggle all is checked again.
-    await expect(toggleAll).toBeChecked();
-  });
-});
-
-test.describe("Item", () => {
-  test("should allow me to mark items as complete", async ({ page }) => {
-    // create a new todo locator
-    const newTodo = page.getByPlaceholder("What needs to be done?");
-
-    // Create two items.
-    for (const item of TODO_ITEMS.slice(0, 2)) {
-      await newTodo.fill(item);
-      await newTodo.press("Enter");
-    }
-
-    // Check first item.
-    const firstTodo = page.getByTestId("todo-item").nth(0);
-    await firstTodo.getByRole("checkbox").check();
-    await expect(firstTodo).toHaveClass("completed");
-
-    // Check second item.
-    const secondTodo = page.getByTestId("todo-item").nth(1);
-    await expect(secondTodo).not.toHaveClass("completed");
-    await secondTodo.getByRole("checkbox").check();
-
-    // Assert completed class.
-    await expect(firstTodo).toHaveClass("completed");
-    await expect(secondTodo).toHaveClass("completed");
-  });
-
-  test("should allow me to un-mark items as complete", async ({ page }) => {
-    // create a new todo locator
-    const newTodo = page.getByPlaceholder("What needs to be done?");
-
-    // Create two items.
-    for (const item of TODO_ITEMS.slice(0, 2)) {
-      await newTodo.fill(item);
-      await newTodo.press("Enter");
-    }
-
-    const firstTodo = page.getByTestId("todo-item").nth(0);
-    const secondTodo = page.getByTestId("todo-item").nth(1);
-    const firstTodoCheckbox = firstTodo.getByRole("checkbox");
-
-    await firstTodoCheckbox.check();
-    await expect(firstTodo).toHaveClass("completed");
-    await expect(secondTodo).not.toHaveClass("completed");
-    await checkNumberOfCompletedTodosInLocalStorage(page, 1);
-
-    await firstTodoCheckbox.uncheck();
-    await expect(firstTodo).not.toHaveClass("completed");
-    await expect(secondTodo).not.toHaveClass("completed");
-    await checkNumberOfCompletedTodosInLocalStorage(page, 0);
-  });
-
-  test("should allow me to edit an item", async ({ page }) => {
-    await createDefaultTodos(page);
-
-    const todoItems = page.getByTestId("todo-item");
-    const secondTodo = todoItems.nth(1);
-    await secondTodo.dblclick();
-    await expect(secondTodo.getByRole("textbox", { name: "Edit" })).toHaveValue(
-      TODO_ITEMS[1],
-    );
-    await secondTodo
-      .getByRole("textbox", { name: "Edit" })
-      .fill("buy some sausages");
-    await secondTodo.getByRole("textbox", { name: "Edit" }).press("Enter");
-
-    // Explicitly assert the new text value.
-    await expect(todoItems).toHaveText([
-      TODO_ITEMS[0],
-      "buy some sausages",
-      TODO_ITEMS[2],
-    ]);
-    await checkTodosInLocalStorage(page, "buy some sausages");
-  });
-});
-
-test.describe("Editing", () => {
-  test.beforeEach(async ({ page }) => {
-    await createDefaultTodos(page);
-    await checkNumberOfTodosInLocalStorage(page, 3);
-  });
-
-  test("should hide other controls when editing", async ({ page }) => {
-    const todoItem = page.getByTestId("todo-item").nth(1);
-    await todoItem.dblclick();
-    await expect(todoItem.getByRole("checkbox")).not.toBeVisible();
-    await expect(
-      todoItem.locator("label", {
-        hasText: TODO_ITEMS[1],
-      }),
-    ).not.toBeVisible();
-    await checkNumberOfTodosInLocalStorage(page, 3);
-  });
-
-  test("should save edits on blur", async ({ page }) => {
-    const todoItems = page.getByTestId("todo-item");
-    await todoItems.nth(1).dblclick();
-    await todoItems
-      .nth(1)
-      .getByRole("textbox", { name: "Edit" })
-      .fill("buy some sausages");
-    await todoItems
-      .nth(1)
-      .getByRole("textbox", { name: "Edit" })
-      .dispatchEvent("blur");
-
-    await expect(todoItems).toHaveText([
-      TODO_ITEMS[0],
-      "buy some sausages",
-      TODO_ITEMS[2],
-    ]);
-    await checkTodosInLocalStorage(page, "buy some sausages");
-  });
-
-  test("should trim entered text", async ({ page }) => {
-    const todoItems = page.getByTestId("todo-item");
-    await todoItems.nth(1).dblclick();
-    await todoItems
-      .nth(1)
-      .getByRole("textbox", { name: "Edit" })
-      .fill("    buy some sausages    ");
-    await todoItems
-      .nth(1)
-      .getByRole("textbox", { name: "Edit" })
-      .press("Enter");
-
-    await expect(todoItems).toHaveText([
-      TODO_ITEMS[0],
-      "buy some sausages",
-      TODO_ITEMS[2],
-    ]);
-    await checkTodosInLocalStorage(page, "buy some sausages");
-  });
-
-  test("should remove the item if an empty text string was entered", async ({
-    page,
-  }) => {
-    const todoItems = page.getByTestId("todo-item");
-    await todoItems.nth(1).dblclick();
-    await todoItems.nth(1).getByRole("textbox", { name: "Edit" }).fill("");
-    await todoItems
-      .nth(1)
-      .getByRole("textbox", { name: "Edit" })
-      .press("Enter");
-
-    await expect(todoItems).toHaveText([TODO_ITEMS[0], TODO_ITEMS[2]]);
-  });
-
-  test("should cancel edits on escape", async ({ page }) => {
-    const todoItems = page.getByTestId("todo-item");
-    await todoItems.nth(1).dblclick();
-    await todoItems
-      .nth(1)
-      .getByRole("textbox", { name: "Edit" })
-      .fill("buy some sausages");
-    await todoItems
-      .nth(1)
-      .getByRole("textbox", { name: "Edit" })
-      .press("Escape");
-    await expect(todoItems).toHaveText(TODO_ITEMS);
-  });
-});
-
-test.describe("Counter", () => {
-  test("should display the current number of todo items", async ({ page }) => {
-    // create a new todo locator
-    const newTodo = page.getByPlaceholder("What needs to be done?");
-
-    // create a todo count locator
-    const todoCount = page.getByTestId("todo-count");
-
-    await newTodo.fill(TODO_ITEMS[0]);
-    await newTodo.press("Enter");
-    await expect(todoCount).toContainText("1");
-
-    await newTodo.fill(TODO_ITEMS[1]);
-    await newTodo.press("Enter");
-    await expect(todoCount).toContainText("2");
-
-    await checkNumberOfTodosInLocalStorage(page, 2);
-  });
-});
-
-test.describe("Clear completed button", () => {
-  test.beforeEach(async ({ page }) => {
-    await createDefaultTodos(page);
-  });
-
-  test("should display the correct text", async ({ page }) => {
-    await page.locator(".todo-list li .toggle").first().check();
-    await expect(
-      page.getByRole("button", { name: "Clear completed" }),
-    ).toBeVisible();
-  });
-
-  test("should remove completed items when clicked", async ({ page }) => {
-    const todoItems = page.getByTestId("todo-item");
-    await todoItems.nth(1).getByRole("checkbox").check();
-    await page.getByRole("button", { name: "Clear completed" }).click();
-    await expect(todoItems).toHaveCount(2);
-    await expect(todoItems).toHaveText([TODO_ITEMS[0], TODO_ITEMS[2]]);
-  });
-
-  test("should be hidden when there are no items that are completed", async ({
-    page,
-  }) => {
-    await page.locator(".todo-list li .toggle").first().check();
-    await page.getByRole("button", { name: "Clear completed" }).click();
-    await expect(
-      page.getByRole("button", { name: "Clear completed" }),
-    ).toBeHidden();
-  });
-});
-
-test.describe("Persistence", () => {
-  test("should persist its data", async ({ page }) => {
-    // create a new todo locator
-    const newTodo = page.getByPlaceholder("What needs to be done?");
-
-    for (const item of TODO_ITEMS.slice(0, 2)) {
-      await newTodo.fill(item);
-      await newTodo.press("Enter");
-    }
-
-    const todoItems = page.getByTestId("todo-item");
-    const firstTodoCheck = todoItems.nth(0).getByRole("checkbox");
-    await firstTodoCheck.check();
-    await expect(todoItems).toHaveText([TODO_ITEMS[0], TODO_ITEMS[1]]);
-    await expect(firstTodoCheck).toBeChecked();
-    await expect(todoItems).toHaveClass(["completed", ""]);
-
-    // Ensure there is 1 completed item.
-    await checkNumberOfCompletedTodosInLocalStorage(page, 1);
-
-    // Now reload.
-    await page.reload();
-    await expect(todoItems).toHaveText([TODO_ITEMS[0], TODO_ITEMS[1]]);
-    await expect(firstTodoCheck).toBeChecked();
-    await expect(todoItems).toHaveClass(["completed", ""]);
-  });
-});
-
-test.describe("Routing", () => {
-  test.beforeEach(async ({ page }) => {
-    await createDefaultTodos(page);
-    // make sure the app had a chance to save updated todos in storage
-    // before navigating to a new view, otherwise the items can get lost :(
-    // in some frameworks like Durandal
-    await checkTodosInLocalStorage(page, TODO_ITEMS[0]);
-  });
-
-  test("should allow me to display active items", async ({ page }) => {
-    const todoItem = page.getByTestId("todo-item");
-    await page.getByTestId("todo-item").nth(1).getByRole("checkbox").check();
-
-    await checkNumberOfCompletedTodosInLocalStorage(page, 1);
-    await page.getByRole("link", { name: "Active" }).click();
-    await expect(todoItem).toHaveCount(2);
-    await expect(todoItem).toHaveText([TODO_ITEMS[0], TODO_ITEMS[2]]);
-  });
-
-  test("should respect the back button", async ({ page }) => {
-    const todoItem = page.getByTestId("todo-item");
-    await page.getByTestId("todo-item").nth(1).getByRole("checkbox").check();
-
-    await checkNumberOfCompletedTodosInLocalStorage(page, 1);
-
-    await test.step("Showing all items", async () => {
-      await page.getByRole("link", { name: "All" }).click();
-      await expect(todoItem).toHaveCount(3);
-    });
-
-    await test.step("Showing active items", async () => {
-      await page.getByRole("link", { name: "Active" }).click();
-    });
-
-    await test.step("Showing completed items", async () => {
-      await page.getByRole("link", { name: "Completed" }).click();
-    });
-
-    await expect(todoItem).toHaveCount(1);
-    await page.goBack();
-    await expect(todoItem).toHaveCount(2);
-    await page.goBack();
-    await expect(todoItem).toHaveCount(3);
-  });
-
-  test("should allow me to display completed items", async ({ page }) => {
-    await page.getByTestId("todo-item").nth(1).getByRole("checkbox").check();
-    await checkNumberOfCompletedTodosInLocalStorage(page, 1);
-    await page.getByRole("link", { name: "Completed" }).click();
-    await expect(page.getByTestId("todo-item")).toHaveCount(1);
-  });
-
-  test("should allow me to display all items", async ({ page }) => {
-    await page.getByTestId("todo-item").nth(1).getByRole("checkbox").check();
-    await checkNumberOfCompletedTodosInLocalStorage(page, 1);
-    await page.getByRole("link", { name: "Active" }).click();
-    await page.getByRole("link", { name: "Completed" }).click();
-    await page.getByRole("link", { name: "All" }).click();
-    await expect(page.getByTestId("todo-item")).toHaveCount(3);
-  });
-
-  test("should highlight the currently applied filter", async ({ page }) => {
-    await expect(page.getByRole("link", { name: "All" })).toHaveClass(
-      "selected",
-    );
-
-    //create locators for active and completed links
-    const activeLink = page.getByRole("link", { name: "Active" });
-    const completedLink = page.getByRole("link", { name: "Completed" });
-    await activeLink.click();
-
-    // Page change - active items.
-    await expect(activeLink).toHaveClass("selected");
-    await completedLink.click();
-
-    // Page change - completed items.
-    await expect(completedLink).toHaveClass("selected");
-  });
-});
-
-async function createDefaultTodos(page) {
-  // create a new todo locator
-  const newTodo = page.getByPlaceholder("What needs to be done?");
-
-  for (const item of TODO_ITEMS) {
-    await newTodo.fill(item);
-    await newTodo.press("Enter");
-  }
-}
-
-/**
- * @param {import('@playwright/test').Page} page
- * @param {number} expected
- */
-async function checkNumberOfTodosInLocalStorage(page, expected) {
-  return await page.waitForFunction((e) => {
-    return JSON.parse(localStorage["react-todos"]).length === e;
-  }, expected);
-}
-
-/**
- * @param {import('@playwright/test').Page} page
- * @param {number} expected
- */
-async function checkNumberOfCompletedTodosInLocalStorage(page, expected) {
-  return await page.waitForFunction((e) => {
-    return (
-      JSON.parse(localStorage["react-todos"]).filter((i) => i.completed)
-        .length === e
-    );
-  }, expected);
-}
-
-/**
- * @param {import('@playwright/test').Page} page
- * @param {string} title
- */
-async function checkTodosInLocalStorage(page, title) {
-  return await page.waitForFunction((t) => {
-    return JSON.parse(localStorage["react-todos"])
-      .map((i) => i.title)
-      .includes(t);
-  }, title);
-}