@player-ui/player 1.1.0-next.1 → 1.1.0-next.2

package/package.json

@@ -6,12 +6,12 @@
     "types"
   ],
   "name": "@player-ui/player",
-  "version": "1.1.0-next.1",
+  "version": "1.1.0-next.2",
   "main": "dist/cjs/index.cjs",
   "dependencies": {
-    "@player-ui/partial-match-registry": "1.1.0-next.1",
-    "@player-ui/make-flow": "1.1.0-next.1",
-    "@player-ui/types": "1.1.0-next.1",
+    "@player-ui/partial-match-registry": "1.1.0-next.2",
+    "@player-ui/make-flow": "1.1.0-next.2",
+    "@player-ui/types": "1.1.0-next.2",
     "@types/dlv": "^1.1.4",
     "dequal": "^2.0.2",
     "dlv": "^1.1.3",

package/src/__tests__/player.test.ts

@@ -8,6 +8,7 @@ import type { ViewController } from "..";
 import actionsFlow from "./helpers/actions.flow";
 import type { InProgressState } from "../types";
 import { ActionExpPlugin } from "./helpers/action-exp.plugin";
+import TrackBindingPlugin from "./helpers/binding.plugin";
 
 const minimal = {
   id: "minimal-player-content-response-format",
@@ -722,3 +723,175 @@ test("view trigger once when moving between views", async () => {
     expect(viewTap).toHaveBeenCalledOnce();
   });
 });
+
+test("prevents invalid data from being committed during action-driven backward navigation", async () => {
+  const player = new Player({
+    plugins: [new TrackBindingPlugin()],
+  });
+
+  player.hooks.validationController.tap("test", (validationProvider) => {
+    validationProvider.hooks.createValidatorRegistry.tap("test", (registry) => {
+      registry.register("minValue", (_context, value) => {
+        if (typeof value === "number" && value < 0) {
+          return {
+            message: "Amount must be non-negative",
+            severity: "error",
+          };
+        }
+      });
+    });
+  });
+
+  const flow = {
+    id: "schema-invalid-force-navigation",
+    schema: {
+      ROOT: {
+        someValue: {
+          type: "SomeType",
+          validation: [
+            {
+              type: "minValue",
+              severity: "error",
+              trigger: "change",
+            },
+          ],
+        },
+      },
+    },
+    views: [
+      {
+        id: "input-view",
+        type: "info",
+        fields: {
+          asset: {
+            id: "input-fields",
+            type: "collection",
+            values: [
+              {
+                asset: {
+                  id: "some-input",
+                  type: "input",
+                  binding: "someValue",
+                },
+              },
+            ],
+          },
+        },
+        actions: [
+          {
+            asset: {
+              id: "back-action",
+              type: "action",
+              value: "previous",
+              label: {
+                asset: {
+                  id: "back-label",
+                  type: "text",
+                  value: "Back",
+                },
+              },
+            },
+          },
+        ],
+      },
+      {
+        id: "result-view",
+        type: "info",
+        title: {
+          asset: {
+            id: "result-title",
+            type: "text",
+            value: "Result",
+          },
+        },
+        primaryInfo: {
+          asset: {
+            id: "result-text",
+            type: "text",
+            value: "Leaked value: {{someValue}}",
+          },
+        },
+      },
+    ],
+    navigation: {
+      BEGIN: "FLOW_1",
+      FLOW_1: {
+        startState: "VIEW_INPUT",
+        VIEW_INPUT: {
+          state_type: "VIEW",
+          ref: "input-view",
+          transitions: {
+            previous: "ACTION_BACK",
+          },
+        },
+        ACTION_BACK: {
+          state_type: "ACTION",
+          exp: "{{unrelated}} = 'touched'",
+          transitions: {
+            "*": "VIEW_RESULT",
+          },
+        },
+        VIEW_RESULT: {
+          state_type: "VIEW",
+          ref: "result-view",
+          transitions: {
+            "*": "END_done",
+          },
+        },
+        END_done: {
+          state_type: "END",
+          outcome: "done",
+        },
+      },
+    },
+  };
+
+  player.start(flow as any);
+
+  await vitest.waitFor(() => {
+    const state = player.getState() as InProgressState;
+    return (
+      state?.controllers?.flow?.current?.currentState?.name === "VIEW_INPUT"
+    );
+  });
+
+  let state = player.getState() as InProgressState;
+  expect(state.controllers.flow.current?.currentState?.name).toBe("VIEW_INPUT");
+
+  // Simulate entering invalid data
+  state.controllers.data.set([["someValue", -1]]);
+
+  // The invalid data should be rejected and only available in the shadow model
+  expect(state.controllers.data.get("someValue")).toBeUndefined();
+  expect(
+    state.controllers.data.get("someValue", { includeInvalid: true }),
+  ).toBe(-1);
+
+  // Ensure normal navigation is blocked
+  state.controllers.flow.current?.transition("previous");
+
+  let currentState = player.getState() as InProgressState;
+  expect(currentState?.controllers?.flow?.current?.currentState?.name).toBe(
+    "VIEW_INPUT",
+  );
+
+  // Simulate forcing back navigation (bypassing validation)
+  state.controllers.flow.current?.transition("previous", { force: true });
+
+  currentState = player.getState() as InProgressState;
+  expect(currentState?.controllers?.flow?.current?.currentState?.name).toBe(
+    "VIEW_RESULT",
+  );
+
+  state = player.getState() as InProgressState;
+
+  // The invalid data should NOT be committed to the main model because of the transition
+  const finalValue = state.controllers.data.get("someValue");
+  expect(finalValue).toBeUndefined();
+  // The transition should have dropped the invalid data entirely, not just
+  // hidden it from the main model
+  const shadowValue = state.controllers.data.get("someValue", {
+    includeInvalid: true,
+  });
+  expect(shadowValue).toBeUndefined();
+});

package/src/controllers/validation/controller.ts

@@ -420,6 +420,7 @@ export class ValidationController implements BindingTracker {
   private viewValidationProvider?: ValidationProvider;
   private options?: SimpleValidatorContext;
   private weakBindingTracker = new Set<BindingInstance>();
+  private validationMiddleware?: ValidationMiddleware;
 
   constructor(schema: SchemaController, options?: SimpleValidatorContext) {
     this.schema = schema;
@@ -433,6 +434,55 @@ export class ValidationController implements BindingTracker {
 
   /** Return the middleware for the data-model to stop propagation of invalid data */
   public getDataMiddleware(): Array<DataModelMiddleware> {
+    const validationMiddleware = new ValidationMiddleware(
+      (binding) => {
+        if (!this.options) {
+          return;
+        }
+
+        this.updateValidationsForBinding(binding, "change", this.options);
+        const strongValidation = this.getValidationForBinding(binding);
+
+        // return validation issues directly on bindings first
+        if (strongValidation?.get()?.severity === "error") {
+          return strongValidation.get();
+        }
+
+        // if none, check to see any validations this binding may be a weak ref of and return
+        const newInvalidBindings: Set<StrongOrWeakBinding> = new Set();
+        this.validations.forEach((weakValidation, strongBinding) => {
+          if (
+            caresAboutDataChanges(
+              new Set([binding]),
+              weakValidation.weakBindings,
+            ) &&
+            weakValidation?.get()?.severity === "error"
+          ) {
+            weakValidation?.weakBindings.forEach((weakBinding) => {
+              if (weakBinding === strongBinding) {
+                newInvalidBindings.add({
+                  binding: weakBinding,
+                  isStrong: true,
+                });
+              } else {
+                newInvalidBindings.add({
+                  binding: weakBinding,
+                  isStrong: false,
+                });
+              }
+            });
+          }
+        });
+
+        if (newInvalidBindings.size > 0) {
+          return newInvalidBindings;
+        }
+      },
+      { logger: new ProxyLogger(() => this.options?.logger) },
+    );
+
+    this.validationMiddleware = validationMiddleware;
+
     return [
       {
         set: (transaction, options, next) => {
@@ -450,52 +500,7 @@ export class ValidationController implements BindingTracker {
           return next?.delete(binding, options);
         },
       },
-      new ValidationMiddleware(
-        (binding) => {
-          if (!this.options) {
-            return;
-          }
-
-          this.updateValidationsForBinding(binding, "change", this.options);
-          const strongValidation = this.getValidationForBinding(binding);
-
-          // return validation issues directly on bindings first
-          if (strongValidation?.get()?.severity === "error") {
-            return strongValidation.get();
-          }
-
-          // if none, check to see any validations this binding may be a weak ref of and return
-          const newInvalidBindings: Set<StrongOrWeakBinding> = new Set();
-          this.validations.forEach((weakValidation, strongBinding) => {
-            if (
-              caresAboutDataChanges(
-                new Set([binding]),
-                weakValidation.weakBindings,
-              ) &&
-              weakValidation?.get()?.severity === "error"
-            ) {
-              weakValidation?.weakBindings.forEach((weakBinding) => {
-                if (weakBinding === strongBinding) {
-                  newInvalidBindings.add({
-                    binding: weakBinding,
-                    isStrong: true,
-                  });
-                } else {
-                  newInvalidBindings.add({
-                    binding: weakBinding,
-                    isStrong: false,
-                  });
-                }
-              });
-            }
-          });
-
-          if (newInvalidBindings.size > 0) {
-            return newInvalidBindings;
-          }
-        },
-        { logger: new ProxyLogger(() => this.options?.logger) },
-      ),
+      validationMiddleware,
     ];
   }
 
@@ -533,10 +538,11 @@ export class ValidationController implements BindingTracker {
   public reset() {
     this.validations.clear();
     this.tracker = undefined;
+    this.validationMiddleware?.reset();
   }
 
   public onView(view: ViewInstance): void {
-    this.validations.clear();
+    this.reset();
     if (!this.options) {
       return;
     }

package/src/validator/validation-middleware.ts

@@ -163,4 +163,9 @@ export class ValidationMiddleware implements DataModelMiddleware {
 
     return next?.delete(binding, options);
   }
+
+  /** Clears any invalid values staged in the shadow model */
+  public reset(): void {
+    this.shadowModelPaths.clear();
+  }
 }

package/types/controllers/validation/controller.d.ts

@@ -120,6 +120,7 @@ export declare class ValidationController implements BindingTracker {
     private viewValidationProvider?;
     private options?;
     private weakBindingTracker;
+    private validationMiddleware?;
     constructor(schema: SchemaController, options?: SimpleValidatorContext);
     setOptions(options: SimpleValidatorContext): void;
     /** Return the middleware for the data-model to stop propagation of invalid data */

package/types/validator/validation-middleware.d.ts

@@ -32,5 +32,7 @@ export declare class ValidationMiddleware implements DataModelMiddleware {
     set(transaction: BatchSetTransaction, options?: DataModelOptions, next?: DataModelImpl): Updates;
     get(binding: BindingInstance, options?: DataModelOptions, next?: DataModelImpl): any;
     delete(binding: BindingInstance, options?: DataModelOptions, next?: DataModelImpl): void | undefined;
+    /** Clears any invalid values staged in the shadow model */
+    reset(): void;
 }
 //# sourceMappingURL=validation-middleware.d.ts.map