@player-ui/async-node-plugin 0.15.3 → 0.15.4--canary.881.37421

package/src/__tests__/index.test.ts

@@ -8,6 +8,11 @@ import {
   BeforeTransformFunction,
   Flow,
   NodeType,
+  Logger,
+  ErrorTypes,
+  ErrorSeverity,
+  PlayerErrorMetadata,
+  ErrorMetadata,
 } from "@player-ui/player";
 import { Player, Parser } from "@player-ui/player";
 import { waitFor } from "@testing-library/react";
@@ -18,6 +23,19 @@ import {
 } from "../index";
 import { CheckPathPlugin } from "@player-ui/check-path-plugin";
 import { Registry } from "@player-ui/partial-match-registry";
+import { ExpressionPlugin } from "@player-ui/expression-plugin";
+import { AsyncNodeError } from "../AsyncNodeError";
+
+class ErrorWithProps extends Error implements PlayerErrorMetadata {
+  constructor(
+    message: string,
+    public type: string,
+    public severity?: ErrorSeverity,
+    public metadata?: ErrorMetadata,
+  ) {
+    super(message);
+  }
+}
 
 const transform: BeforeTransformFunction = createAsyncTransform({
   transformAssetType: "chat-message",
@@ -79,7 +97,35 @@ const asyncAssetFrf: Flow = {
       VIEW_1: {
         state_type: "VIEW",
         ref: "my-view",
-        transitions: {},
+        transitions: {
+          "*": "END",
+        },
+      },
+      END: {
+        state_type: "END",
+        outcome: "done",
+      },
+    },
+  },
+};
+
+const nonViewErrorFlow: Flow = {
+  id: "test-flow",
+  views: [],
+  navigation: {
+    BEGIN: "FLOW_1",
+    FLOW_1: {
+      startState: "ACTION_1",
+      ACTION_1: {
+        state_type: "ACTION",
+        exp: ["captureError()"],
+        transitions: {
+          "*": "END",
+        },
+      },
+      END: {
+        state_type: "END",
+        outcome: "done",
       },
     },
   },
@@ -1075,7 +1121,7 @@ describe("view", () => {
 
       await waitFor(() => {
         expect(onAsyncNodeErrorCallback).toHaveBeenCalledWith(
-          new Error("Promise Rejected"),
+          expect.objectContaining({ cause: new Error("Promise Rejected") }),
           expect.anything(),
         );
 
@@ -1105,14 +1151,241 @@ describe("view", () => {
 
       await waitFor(() => {
         expect(onAsyncNodeErrorCallback).toHaveBeenCalledWith(
-          new Error("Promise Rejected"),
+          expect.objectContaining({ cause: new Error("Promise Rejected") }),
           expect.anything(),
         );
 
         const playerState = player.getState();
         expect(playerState.status).toBe("error");
         const errorState = playerState as ErrorState;
-        expect(errorState.error.message).toBe("Promise Rejected");
+        expect(errorState.error.message).toBe(
+          "An error occured during async node resolution. See cause for details.",
+        );
+        expect(errorState.error).toBeInstanceOf(AsyncNodeError);
+        expect((errorState.error as AsyncNodeError).cause?.message).toBe(
+          "Promise Rejected",
+        );
+      });
+    });
+
+    test("should log and absorb errors occuring outside of an in-progress state", async () => {
+      const vitestLogger: Logger = {
+        debug: vi.fn(),
+        error: vi.fn(),
+        info: vi.fn(),
+        trace: vi.fn(),
+        warn: vi.fn(),
+      };
+      const plugin = new AsyncNodePlugin({
+        plugins: [new AsyncNodePluginPlugin()],
+      });
+
+      let throwAsyncError: ((err: Error) => void) | undefined;
+
+      plugin.hooks.onAsyncNode.tap("test", async () => {
+        return new Promise((_, rej) => {
+          throwAsyncError = rej;
+        });
+      });
+
+      const plugins = [plugin, new TestAsyncPlugin()];
+
+      const player = new Player({
+        plugins: plugins,
+        logger: vitestLogger,
+      });
+
+      player.start(asyncAssetFrf);
+
+      await vi.waitFor(() => {
+        expect(throwAsyncError).toBeDefined();
+      });
+
+      (player.getState() as InProgressState).controllers.flow.transition(
+        "done",
+      );
+      await vi.waitFor(() => {
+        const playerState = player.getState();
+        expect(playerState.status).toBe("completed");
+      });
+
+      throwAsyncError!(new Error("Test Error"));
+
+      await vi.waitFor(() => {
+        const state = player.getState();
+        // should not leave completed state
+        expect(state.status).toBe("completed");
+
+        expect(vitestLogger.warn).toHaveBeenCalledWith(
+          expect.any(String), // Message doesn't matter, just check that the logged error is correct
+          new Error("Test Error"),
+        );
+      });
+    });
+
+    test("should do nothing with errors when not in a view state", async () => {
+      const plugin = new AsyncNodePlugin({
+        plugins: [new AsyncNodePluginPlugin()],
+      });
+      // Call capture error in an action state to make sure asyncnodeplugin doesn't try to handle this
+      const expPlugin = new ExpressionPlugin(
+        new Map([
+          [
+            "captureError",
+            () => {
+              (
+                player.getState() as InProgressState
+              ).controllers.error.captureError(
+                new ErrorWithProps(
+                  "Test Error",
+                  ErrorTypes.RENDER,
+                  ErrorSeverity.ERROR,
+                  { assetId: "asset" },
+                ),
+              );
+            },
+          ],
+        ]),
+      );
+      const plugins = [plugin, expPlugin, new TestAsyncPlugin()];
+
+      const player = new Player({
+        plugins: plugins,
+      });
+
+      player.start(nonViewErrorFlow).catch(() => {});
+
+      await vi.waitFor(() => {
+        const state = player.getState();
+        expect(state.status).toBe("error");
+        expect(onAsyncNodeErrorCallback).not.toHaveBeenCalled();
+      });
+    });
+
+    test("should fail to handle errors if the plugin is setup incorrectly", async () => {
+      const vitestLogger: Logger = {
+        debug: vi.fn(),
+        error: vi.fn(),
+        info: vi.fn(),
+        trace: vi.fn(),
+        warn: vi.fn(),
+      };
+      const nodePluginPlugin = new AsyncNodePluginPlugin();
+
+      // Apply AsyncNodePluginPlugin in isolation to observe failures
+      const plugin: PlayerPlugin = {
+        name: "TestPlayerPlugin",
+        apply: (player: Player) => {
+          nodePluginPlugin.applyPlayer(player);
+          player.hooks.view.tap("test", (view) => {
+            nodePluginPlugin.apply(view);
+          });
+        },
+      };
+      const plugins = [plugin, new TestAsyncPlugin()];
+
+      const player = new Player({
+        plugins: plugins,
+        logger: vitestLogger,
+      });
+      player.start(asyncAssetFrf).catch(() => {});
+
+      await vi.waitFor(() => {
+        const state = player.getState();
+        expect(state.status).toBe("in-progress");
+      });
+
+      (player.getState() as InProgressState).controllers.error.captureError(
+        new ErrorWithProps("Test Error", ErrorTypes.VIEW, ErrorSeverity.ERROR, {
+          node: {
+            type: NodeType.Async,
+            value: {},
+          },
+        }),
+      );
+
+      await vi.waitFor(() => {
+        const state = player.getState();
+        expect(state.status).toBe("error");
+        expect(onAsyncNodeErrorCallback).not.toHaveBeenCalled();
+        expect(vitestLogger.warn).toHaveBeenCalledWith(
+          "[AsyncNodePlugin]: No plugin detected. Error handling will fail",
+        );
+      });
+    });
+
+    test("should call onAsyncNodeError hook for any async node involved in generating the current one", async () => {
+      const plugin = new AsyncNodePlugin({
+        plugins: [new AsyncNodePluginPlugin()],
+      });
+
+      const errorHandler = vi.fn((err: Error, node: Node.Async) => {
+        if (node.id === "async-chat-id-2") {
+          return {
+            asset: {
+              type: "text",
+              value: "text",
+              id: "FIXED",
+            },
+          };
+        }
+
+        return undefined;
+      });
+
+      plugin.hooks.onAsyncNodeError.tap("test", errorHandler);
+
+      let id = 0;
+      plugin.hooks.onAsyncNode.tap("test", () => {
+        const messageId = id++;
+        if (messageId > 5) {
+          throw new Error("Test Error");
+        }
+
+        return Promise.resolve({
+          asset: {
+            type: "chat-message",
+            id: `chat-id-${messageId}`,
+            value: {
+              id: `chat-id-text-${messageId}`,
+              type: "text",
+              value: `Test Message ${messageId}`,
+            },
+          },
+        });
+      });
+
+      const player = new Player({
+        plugins: [plugin, new TestAsyncPlugin()],
+      });
+      player.start(asyncAssetFrf).catch(() => {});
+
+      await vi.waitFor(() => {
+        expect(id).toBeGreaterThan(5);
+        expect(errorHandler).toHaveBeenCalledWith(
+          expect.anything(),
+          expect.objectContaining({
+            id: "async-chat-id-5",
+          }),
+        );
+        expect(errorHandler).toHaveBeenCalledWith(
+          expect.anything(),
+          expect.objectContaining({
+            id: "async-chat-id-4",
+          }),
+        );
+        expect(errorHandler).toHaveBeenCalledWith(
+          expect.anything(),
+          expect.objectContaining({
+            id: "async-chat-id-3",
+          }),
+        );
+        expect(errorHandler).toHaveBeenCalledWith(
+          expect.anything(),
+          expect.objectContaining({
+            id: "async-chat-id-2",
+          }),
+        );
       });
     });
   });

package/src/index.ts

@@ -10,33 +10,17 @@ import type {
   ViewPlugin,
   Resolver,
   Resolve,
-  ViewController,
 } from "@player-ui/player";
 import { AsyncSeriesBailHook, SyncBailHook } from "tapable-ts";
 import queueMicrotask from "queue-microtask";
+import { AsyncNodeError } from "./AsyncNodeError";
+import { AsyncNodeInfo, AsyncPluginContext } from "./internal-types";
+import { getNodeFromError } from "./utils";
 
 export * from "./types";
 export * from "./transform";
 export * from "./createAsyncTransform";
 
-/** Object type for storing data related to a single `apply` of the `AsyncNodePluginPlugin`
- * This object should be setup once per ViewInstance to keep any cached info just for that view to avoid conflicts of shared async node ids across different view states.
- */
-type AsyncPluginContext = {
-  /** Map of async node id to resolved content */
-  nodeResolveCache: Map<string, Node.Node>;
-  /** The view instance this context is attached to. */
-  view: ViewInstance;
-  /** The view controller this context is attached to. */
-  viewController: ViewController;
-  /** Map of async node id to promises being used to resolve them */
-  inProgressNodes: Set<string>;
-  /** Map of async node ids to the original node they represent.
-   * In some cases, async nodes are transformed into from other node types so the original reference is needed in order to trigger an update on the view when the async node changes.
-   */
-  originalNodeCache: Map<string, Set<Node.Node>>;
-};
-
 export interface AsyncNodePluginOptions {
   /** A set of plugins to load  */
   plugins?: AsyncNodeViewPlugin[];
@@ -142,10 +126,10 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
     node: Node.Async,
     context: AsyncPluginContext,
     result: any,
-    options: Resolve.NodeResolveOptions,
+    parseFunction?: (content: any) => Node.Node | null,
   ) {
     let parsedNode =
-      options.parseNode && result ? options.parseNode(result) : undefined;
+      parseFunction && result ? parseFunction(result) : undefined;
 
     if (parsedNode && node.onValueReceived) {
       parsedNode = node.onValueReceived(parsedNode);
@@ -168,24 +152,43 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
     context: AsyncPluginContext,
     newNode?: Node.Node | null,
   ) {
-    const { nodeResolveCache, viewController, originalNodeCache } = context;
-    if (nodeResolveCache.get(node.id) !== newNode) {
-      nodeResolveCache.set(node.id, newNode ? newNode : node);
-      const originalNode = originalNodeCache.get(node.id) ?? new Set([node]);
-      viewController.updateViewAST(originalNode);
+    const { asyncNodeCache: asyncNodeInfo, viewController } = context;
+    const entry = asyncNodeInfo.get(node.id);
+    if (!entry) {
+      throw new Error("Failed to update async content. Cache entry not found");
+    }
+    if (entry.resolvedContent !== newNode) {
+      entry.resolvedContent = newNode ? newNode : entry.asyncNode;
+      viewController.updateViewAST(entry.updateNodes);
     }
   }
 
   private hasValidMapping(
-    node: Node.Async,
-    context: AsyncPluginContext,
-  ): boolean {
-    const { nodeResolveCache } = context;
+    cacheEntry: AsyncNodeInfo,
+  ): cacheEntry is Required<AsyncNodeInfo> {
     return (
-      nodeResolveCache.has(node.id) && nodeResolveCache.get(node.id) !== node
+      cacheEntry.resolvedContent !== undefined &&
+      cacheEntry.resolvedContent !== cacheEntry.asyncNode
     );
   }
 
+  private getOrCreateAsyncNodeCacheEntry(
+    node: Node.Async,
+    context: AsyncPluginContext,
+  ): AsyncNodeInfo {
+    const { asyncNodeCache: asyncNodeInfo } = context;
+    let entry = asyncNodeInfo.get(node.id);
+    if (!entry) {
+      entry = {
+        asyncNode: node,
+        updateNodes: new Set(),
+      };
+      asyncNodeInfo.set(node.id, entry);
+    }
+
+    return entry;
+  }
+
   /**
    * Handles the asynchronous API integration for resolving nodes.
    * This method sets up a hook on the resolver's `beforeResolve` event to process async nodes.
@@ -193,17 +196,32 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
    * @param view
    */
   applyResolver(resolver: Resolver, context: AsyncPluginContext): void {
+    const { assetIdCache } = context;
+    resolver.hooks.afterNodeUpdate.tap(this.name, (original, _, update) => {
+      if (
+        update.node.type !== NodeType.Asset &&
+        update.node.type !== NodeType.View
+      ) {
+        return;
+      }
+
+      assetIdCache.set(update.value.id, original);
+    });
+
     resolver.hooks.beforeResolve.tap(this.name, (node, options) => {
       if (!this.isAsync(node)) {
         return node === null ? node : this.resolveAsyncChildren(node, context);
       }
+
+      const entry = this.getOrCreateAsyncNodeCacheEntry(node, context);
+
       if (options.node) {
-        context.originalNodeCache.set(node.id, new Set([options.node]));
+        entry.updateNodes = new Set([options.node]);
+        context.generatedByMap.set(options.node, node.id);
       }
 
-      const resolvedNode = context.nodeResolveCache.get(node.id);
-      if (resolvedNode !== undefined) {
-        return this.resolveAsyncChildren(resolvedNode, context);
+      if (entry.resolvedContent !== undefined) {
+        return this.resolveAsyncChildren(entry.resolvedContent, context);
       }
 
       if (context.inProgressNodes.has(node.id)) {
@@ -236,20 +254,24 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
       let index = 0;
       while (index < node.values.length) {
         const childNode = node.values[index];
-        if (
-          childNode?.type !== NodeType.Async ||
-          !this.hasValidMapping(childNode, context)
-        ) {
+        if (childNode?.type !== NodeType.Async) {
           index++;
           continue;
         }
+        const entry = this.getOrCreateAsyncNodeCacheEntry(childNode, context);
 
-        const mappedNode = context.nodeResolveCache.get(childNode.id)!;
+        if (!this.hasValidMapping(entry)) {
+          index++;
+          continue;
+        }
+
+        const mappedNode = entry.resolvedContent;
         const nodeSet = new Set<Node.Node>();
         if (mappedNode.type === NodeType.MultiNode && childNode.flatten) {
           mappedNode.values.forEach((v: Node.Node) => {
             v.parent = node;
             nodeSet.add(v);
+            context.originalParentMap.set(v, childNode);
           });
           node.values = [
             ...node.values.slice(0, index),
@@ -261,17 +283,23 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
           mappedNode.parent = node;
           nodeSet.add(mappedNode);
         }
-        context.originalNodeCache.set(childNode.id, nodeSet);
+        entry.updateNodes = nodeSet;
+        for (const n of nodeSet) {
+          context.generatedByMap.set(n, childNode.id);
+        }
       }
     } else if ("children" in node) {
       node.children?.forEach((c) => {
         // Similar to above, using a while loop lets us handle when async nodes produce more async nodes.
-        while (
-          c.value.type === NodeType.Async &&
-          this.hasValidMapping(c.value, context)
-        ) {
-          const mappedNode = context.nodeResolveCache.get(c.value.id)!;
-          context.originalNodeCache.set(c.value.id, new Set([mappedNode]));
+        while (c.value.type === NodeType.Async) {
+          const entry = this.getOrCreateAsyncNodeCacheEntry(c.value, context);
+          if (!this.hasValidMapping(entry)) {
+            break;
+          }
+
+          const mappedNode = entry.resolvedContent;
+          entry.updateNodes = new Set([mappedNode]);
+          context.generatedByMap.set(mappedNode, c.value.id);
           c.value = mappedNode;
           c.value.parent = node;
         }
@@ -290,35 +318,31 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
       const result = await this.basePlugin?.hooks.onAsyncNode.call(
         node,
         (result) => {
-          this.parseNodeAndUpdate(node, context, result, options);
+          this.parseNodeAndUpdate(node, context, result, options.parseNode);
         },
       );
 
       // Stop tracking before the next update is triggered
       context.inProgressNodes.delete(node.id);
-      this.parseNodeAndUpdate(node, context, result, options);
+      this.parseNodeAndUpdate(node, context, result, options.parseNode);
     } catch (e: unknown) {
-      const error = e instanceof Error ? e : new Error(String(e));
-      const result = this.basePlugin?.hooks.onAsyncNodeError.call(error, node);
-
-      if (result === undefined) {
-        const playerState = this.basePlugin?.getPlayerInstance()?.getState();
-
-        if (playerState?.status === "in-progress") {
-          playerState.fail(error);
-        }
-
+      const cause = e instanceof Error ? e : new Error(String(e));
+      const playerState = this.basePlugin?.getPlayerInstance()?.getState();
+
+      if (playerState?.status !== "in-progress") {
+        options.logger?.warn(
+          "[AsyncNodePlugin]: An error occured during async node resolution, but the player instance is no londer running. Exception: ",
+          cause,
+        );
         return;
       }
 
-      options.logger?.error(
-        "Async node handling failed and resolved with a fallback. Error:",
-        error,
+      const error = new AsyncNodeError(
+        node,
+        "An error occured during async node resolution. See cause for details.",
+        cause,
       );
-
-      // Stop tracking before the next update is triggered
-      context.inProgressNodes.delete(node.id);
-      this.parseNodeAndUpdate(node, context, result, options);
+      playerState.controllers.error.captureError(error);
     }
   }
 
@@ -385,15 +409,112 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
   }
 
   applyPlayer(player: Player): void {
+    // TODO: Need a better mechanism for storing the current context.
+    let currentContext: AsyncPluginContext | undefined = undefined;
+    let parser: Parser | undefined = undefined;
+
+    player.hooks.errorController.tap("async", (errorController) => {
+      errorController.hooks.onError.tap("async", (playerError) => {
+        if (currentContext === undefined) {
+          return undefined;
+        }
+
+        /** Try to handle the error using the onAsyncNodeError hook. Returns true if new content is provided. */
+        const tryHandleError = (asyncNode: Node.Async): boolean => {
+          if (this.basePlugin === undefined) {
+            player.logger.warn(
+              `[AsyncNodePlugin]: No plugin detected. Error handling will fail`,
+            );
+          }
+
+          let result: any = undefined;
+          result = this.basePlugin?.hooks.onAsyncNodeError.call(
+            playerError,
+            asyncNode,
+          );
+
+          if (result === undefined) {
+            return false;
+          }
+
+          player.logger?.warn(
+            "[AsyncNodePlugin]: Async node handling failed and resolved with a fallback. Cause:",
+            playerError.message,
+          );
+
+          // Stop tracking before the next update is triggered
+          currentContext!.inProgressNodes.delete(asyncNode.id);
+          this.parseNodeAndUpdate(
+            asyncNode,
+            currentContext!,
+            result,
+            parser?.parseObject.bind(parser),
+          );
+
+          return true;
+        };
+
+        const getNextNode = (node: Node.Node): Node.Node | undefined => {
+          const parent =
+            currentContext?.originalParentMap.get(node) ?? node.parent;
+
+          if (!parent) {
+            return undefined;
+          }
+
+          // asyncNodeCache has current asyncNode reference more up to date with what's happening in the resolver. Sometimes AsyncNodeError has old references so this helps us move up the tree more accurately
+          return this.isAsync(parent)
+            ? currentContext?.asyncNodeCache.get(parent.id)?.asyncNode
+            : parent;
+        };
+
+        let node = getNodeFromError(playerError, currentContext);
+        // If the node is an async node try, to handle errors with it first.
+        if (node?.type === NodeType.Async && tryHandleError(node)) {
+          return true;
+        }
+
+        // Loop through the nodes to see if something is generated by something else. Continue until the error is handled or there are no more nodes to check
+        while (node !== undefined) {
+          const generatedBy = currentContext.generatedByMap.get(node);
+          if (generatedBy) {
+            const entry = currentContext.asyncNodeCache.get(generatedBy);
+
+            if (!entry) {
+              node = getNextNode(node);
+              continue;
+            }
+
+            const { asyncNode } = entry;
+
+            // Don't return false when the error isn't handled to allow for cases where one async is generated by another. Give different nodes a chance to try to recover from the error.
+            if (tryHandleError(asyncNode)) {
+              return true;
+            }
+          }
+
+          node = getNextNode(node);
+        }
+
+        return undefined;
+      });
+    });
+
     player.hooks.viewController.tap("async", (viewController) => {
       viewController.hooks.view.tap("async", (view) => {
+        view.hooks.parser.tap(this.name, (p) => {
+          parser = p;
+        });
         const context: AsyncPluginContext = {
-          nodeResolveCache: new Map(),
           inProgressNodes: new Set(),
           view,
           viewController,
-          originalNodeCache: new Map(),
+          generatedByMap: new Map(),
+          assetIdCache: new Map(),
+          asyncNodeCache: new Map(),
+          originalParentMap: new Map(),
         };
+        currentContext = context;
 
         view.hooks.resolver.tap("async", (resolver) => {
           this.applyResolver(resolver, context);