@bonsae/nrg 0.17.0 → 0.18.1

package/README.md

@@ -19,12 +19,15 @@ Build Node-RED nodes with Vue 3, TypeScript, JSON Schema validations, Vite and V
 | --- | --- |
 | `@bonsae/nrg` | Root entry — `defineRuntimeSettings` |
 | `@bonsae/nrg/server` | Server node classes, schema utilities, validation (`IONode`, `ConfigNode`, `defineIONode`, `defineConfigNode`, `defineModule`, `SchemaType`, `defineSchema`, `Infer`) |
-| `@bonsae/nrg/client` | Client-side registration (`registerTypes`, `defineNode`) |
+| `@bonsae/nrg/client` | Client-side registration (`registerTypes`, `defineNode`, `useFormNode`, `Infer`) |
 | `@bonsae/nrg/vite` | Vite plugin for building and developing Node-RED packages |
 | `@bonsae/nrg/test/server/unit` | Server unit test helpers (`createNode`, `createRED`, `MockRED`) |
-| `@bonsae/nrg/test/client/unit` | Client unit test config and mocks (`defaultConfig`, `createRED`, `createJQuery`) |
+| `@bonsae/nrg/test/server/unit/config` | Server unit test default vitest config (`defaultConfig`) |
+| `@bonsae/nrg/test/client/unit` | Client unit test mocks (`createRED`, `createJQuery`, `useFormNode`) |
+| `@bonsae/nrg/test/client/unit/config` | Client unit test default vitest config (`defaultConfig`) |
 | `@bonsae/nrg/test/client/unit/setup` | Setup file that installs `RED` and `$` mocks on `window` |
-| `@bonsae/nrg/test/client/component` | Client component test helpers (`createNode`, `defaultConfig`, `createRED`, `createJQuery`) |
+| `@bonsae/nrg/test/client/component` | Client component test helpers (`createNode`, `createRED`, `createJQuery`, `useFormNode`) |
+| `@bonsae/nrg/test/client/component/config` | Client component test default vitest config (`defaultConfig`) |
 | `@bonsae/nrg/test/client/component/setup` | Setup file that installs `RED` and `$` mocks on `window` with Vue i18n |
 | `@bonsae/nrg/test/client/e2e` | Browser E2E test helpers (`NodeRedEditor`, `NodeRedField`, `setup`, `teardown`) |
 | `@bonsae/nrg/tsconfig/base.json` | Base TypeScript configuration |
@@ -106,7 +109,7 @@ type Config = Infer<typeof ConfigsSchema>;
 type Input = Infer<typeof InputSchema>;
 type Output = Infer<typeof OutputSchema>;
 
-export default class MyNode extends IONode<Config, any, Input, Output> {
+export default class MyNode extends IONode<Config, never, Input, Output> {
   static readonly type = "my-node";
   static readonly category = "function";
   static readonly color: `#${string}` = "#ffffff";
@@ -142,7 +145,13 @@ See the [consumer template](https://github.com/AllanOricil/node-red-vue-template
 
 ## Testing
 
-NRG provides four test libraries:
+NRG provides four test libraries and bundles all test infrastructure (happy-dom, Playwright, Vue plugin, browser utilities) as direct dependencies. The only package you need to install yourself is `vitest`:
+
+```bash
+pnpm add -D vitest
+```
+
+Coverage providers are optional peer dependencies — install `@vitest/coverage-v8` or `@vitest/coverage-istanbul` only if you run with `--coverage`.
 
 - `@bonsae/nrg/test/server/unit` — server-side unit tests
 - `@bonsae/nrg/test/client/unit` — client-side unit tests (TypeScript logic)
@@ -174,15 +183,15 @@ describe("my-node", () => {
 Test client-side TypeScript logic (validation, utilities) with mocked `RED` and `$` globals:
 
 ```typescript
-// vitest.config.ts
-import { defineConfig } from "vitest/config";
-import { defaultConfig } from "@bonsae/nrg/test/client/unit";
+// vitest.client.unit.config.ts
+import { defineConfig, mergeConfig } from "vitest/config";
+import { defaultConfig } from "@bonsae/nrg/test/client/unit/config";
 
-export default defineConfig({
+export default mergeConfig(defaultConfig, defineConfig({
   test: {
-    ...defaultConfig,
+    include: ["tests/client/unit/**/*.test.ts"],
   },
-});
+}));
 ```
 
 ```typescript
@@ -199,46 +208,49 @@ describe("myUtil", () => {
 
 ### Client Component Tests
 
-Test your Vue editor components with mocked Node-RED globals:
+Test your Vue editor components with mocked Node-RED globals. Components that use `useFormNode()` receive their node data via Vue's `provide`/`inject` — use `createNode().provide` to supply it in tests:
 
 ```typescript
-// vitest.config.ts
-import { defineConfig } from "vitest/config";
-import { playwright } from "@vitest/browser-playwright";
-import vue from "@vitejs/plugin-vue";
-import { defaultConfig } from "@bonsae/nrg/test/client/component";
+// vitest.client.component.config.ts
+import { defineConfig, mergeConfig } from "vitest/config";
+import { defaultConfig } from "@bonsae/nrg/test/client/component/config";
 
-export default defineConfig({
-  plugins: [vue()],
+export default mergeConfig(defaultConfig, defineConfig({
   test: {
-    ...defaultConfig,
-    browser: {
-      ...defaultConfig.browser,
-      provider: playwright(),
-    },
+    include: ["tests/client/component/**/*.test.ts"],
   },
-});
+}));
 ```
 
 ```typescript
-// tests/client/component/my-component.test.ts
+// tests/client/component/my-form.test.ts
 import { describe, test, expect, vi } from "vitest";
 import { render } from "vitest-browser-vue";
 import { createNode } from "@bonsae/nrg/test/client/component";
-import MyComponent from "../src/client/components/my-component.vue";
+import MyForm from "../src/client/components/my-form.vue";
+
+describe("MyForm", () => {
+  test("renders fields from injected node", async () => {
+    const { provide } = createNode({ name: "test", url: "https://example.com" });
+    const screen = render(MyForm, {
+      global: { provide },
+    });
+    await expect.element(screen.getByDisplayValue("test")).toBeInTheDocument();
+  });
 
-describe("MyComponent", () => {
-  test("renders with node props", async () => {
-    const { node } = createNode({ name: "test" });
-    const screen = render(MyComponent, {
-      props: { node },
+  test("accesses node id for API calls", async () => {
+    const fetchSpy = vi.fn().mockResolvedValue({ ok: true, json: () => ({}) });
+    vi.stubGlobal("fetch", fetchSpy);
+    const { node, provide } = createNode({ name: "test" });
+    render(MyForm, { global: { provide } });
+    await vi.waitFor(() => {
+      expect(fetchSpy).toHaveBeenCalledWith(`my-api/${node.id}`);
     });
-    await expect.element(screen.getByText("test")).toBeInTheDocument();
   });
 
-  test("calls RED.editor API", async () => {
-    const { node, RED } = createNode();
-    render(MyComponent, { props: { node, value: "" } });
+  test("asserts RED.editor API calls", async () => {
+    const { RED, provide } = createNode();
+    render(MyForm, { global: { provide } });
     expect(RED.editor.createEditor).toHaveBeenCalled();
   });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bonsae/nrg",
-  "version": "0.17.0",
+  "version": "0.18.1",
   "description": "NRG framework — build Node-RED nodes with Vue 3, TypeScript, and JSON Schema",
   "author": "Allan Oricil <allanoricil@duck.com>",
   "license": "MIT",
@@ -51,15 +51,18 @@
       "types": "./types/test-server-unit.d.ts",
       "default": "./test/server/unit/index.js"
     },
+    "./test/server/unit/config": "./test/server/unit/config.js",
     "./test/client/component": {
       "types": "./types/test-client-component.d.ts",
       "default": "./test/client/component/index.js"
     },
+    "./test/client/component/config": "./test/client/component/config.js",
     "./test/client/component/setup": "./test/client/component/setup.js",
     "./test/client/unit": {
       "types": "./types/test-client-unit.d.ts",
       "default": "./test/client/unit/index.js"
     },
+    "./test/client/unit/config": "./test/client/unit/config.js",
     "./test/client/unit/setup": "./test/client/unit/setup.js",
     "./test/client/e2e": {
       "types": "./types/test-client-e2e.d.ts",
@@ -75,7 +78,18 @@
   },
   "peerDependencies": {
     "vite": "^6.0.0",
-    "vue": "^3.5.14"
+    "vitest": "^4.0.0",
+    "vue": "^3.5.14",
+    "@vitest/coverage-istanbul": "^4.0.0",
+    "@vitest/coverage-v8": "^4.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@vitest/coverage-istanbul": {
+      "optional": true
+    },
+    "@vitest/coverage-v8": {
+      "optional": true
+    }
   },
   "dependencies": {
     "@clack/prompts": "^1.0.1",
@@ -95,6 +109,10 @@
     "typescript": "^5.8.3",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-static-copy": "^3.1.0",
-    "vue": "^3.5.14"
+    "vue": "^3.5.14",
+    "@vitest/browser-playwright": "^4.1.5",
+    "happy-dom": "^20.10.2",
+    "playwright": "^1.60.0",
+    "vitest-browser-vue": "^2.1.0"
   }
 }