@adobe/alloy 2.32.1-beta.1 → 2.33.0

package/src/components/Personalization/handlers/createDecorateProposition.js

@@ -0,0 +1,100 @@
+/*
+Copyright 2024 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { getAttribute, setAttribute } from "../dom-actions/dom/index.js";
+import { noop } from "@adobe/alloy-core/utils";
+import { DOM_ACTION_CLICK } from "../dom-actions/initDomActionsModules.js";
+import {
+  ALWAYS,
+  DECORATED_ELEMENTS_ONLY,
+} from "@adobe/alloy-core/constants/propositionInteractionType.js";
+
+export const INTERACT_ID_DATA_ATTRIBUTE = "data-aep-interact-id";
+export const CLICK_LABEL_DATA_ATTRIBUTE = "data-aep-click-label";
+export const CLICK_TOKEN_DATA_ATTRIBUTE = "data-aep-click-token";
+
+let lastInteractId = 0;
+
+const getInteractId = (propositionId, existingInteractId) => {
+  if (existingInteractId) {
+    return parseInt(existingInteractId, 10);
+  }
+
+  return ++lastInteractId;
+};
+
+const interactionTrackingSupported = (
+  autoCollectPropositionInteractions,
+  decisionProvider,
+) => {
+  if (!autoCollectPropositionInteractions) {
+    return false;
+  }
+
+  if (!autoCollectPropositionInteractions[decisionProvider]) {
+    return false;
+  }
+
+  return [ALWAYS, DECORATED_ELEMENTS_ONLY].includes(
+    autoCollectPropositionInteractions[decisionProvider],
+  );
+};
+
+const createDecorateProposition = (
+  autoCollectPropositionInteractions,
+  type,
+  propositionId,
+  itemId,
+  trackingLabel,
+  scopeType,
+  notification,
+  storeInteractionMeta,
+) => {
+  const { scopeDetails = {} } = notification;
+  const { decisionProvider } = scopeDetails;
+
+  if (
+    !interactionTrackingSupported(
+      autoCollectPropositionInteractions,
+      decisionProvider,
+    ) &&
+    type !== DOM_ACTION_CLICK
+  ) {
+    return noop;
+  }
+
+  return (element) => {
+    if (!element.tagName) {
+      return;
+    }
+
+    const interactId = getInteractId(
+      propositionId,
+      getAttribute(element, INTERACT_ID_DATA_ATTRIBUTE),
+    );
+
+    storeInteractionMeta(
+      propositionId,
+      itemId,
+      scopeType,
+      notification,
+      interactId,
+    );
+
+    setAttribute(element, INTERACT_ID_DATA_ATTRIBUTE, interactId);
+
+    if (trackingLabel && !getAttribute(element, CLICK_LABEL_DATA_ATTRIBUTE)) {
+      setAttribute(element, CLICK_LABEL_DATA_ATTRIBUTE, trackingLabel);
+    }
+  };
+};
+
+export default createDecorateProposition;

package/src/components/Personalization/handlers/createProcessDomAction.js

@@ -0,0 +1,79 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+import createDecorateProposition from "./createDecorateProposition.js";
+import createRenderStatusHandler from "./createRenderStatusHandler.js";
+import { DOM_ACTION_CLICK } from "../dom-actions/initDomActionsModules.js";
+
+export default ({
+    modules,
+    logger,
+    storeInteractionMeta,
+    storeClickMeta,
+    autoCollectPropositionInteractions,
+  }) =>
+  (item) => {
+    const { type, selector } = item.getData() || {};
+
+    if (!type) {
+      logger.warn("Invalid DOM action data: missing type.", item.getData());
+      return { setRenderAttempted: false, includeInNotification: false };
+    }
+
+    if (type === DOM_ACTION_CLICK) {
+      if (!selector) {
+        logger.warn(
+          "Invalid DOM action data: missing selector.",
+          item.getData(),
+        );
+        return { setRenderAttempted: false, includeInNotification: false };
+      }
+
+      storeClickMeta({
+        selector,
+        meta: {
+          ...item.getProposition().getNotification(),
+          trackingLabel: item.getTrackingLabel(),
+          scopeType: item.getProposition().getScopeType(),
+        },
+      });
+
+      return { setRenderAttempted: true, includeInNotification: false };
+    }
+
+    if (!modules[type]) {
+      logger.warn("Invalid DOM action data: unknown type.", item.getData());
+      return { setRenderAttempted: false, includeInNotification: false };
+    }
+
+    const renderStatusHandler = createRenderStatusHandler(
+      item.getProposition().getScopeType(),
+      item.getId(),
+    );
+    const decorateProposition = createDecorateProposition(
+      autoCollectPropositionInteractions,
+      type,
+      item.getProposition().getId(),
+      item.getId(),
+      item.getTrackingLabel(),
+      item.getProposition().getScopeType(),
+      item.getProposition().getNotification(),
+      storeInteractionMeta,
+    );
+
+    return {
+      render: () =>
+        modules[type](item.getData(), decorateProposition, renderStatusHandler),
+      setRenderAttempted: true,
+      includeInNotification: true,
+    };
+  };

package/src/components/Personalization/handlers/createProcessHtmlContent.js

@@ -0,0 +1,60 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import createDecorateProposition from "./createDecorateProposition.js";
+import createRenderStatusHandler from "./createRenderStatusHandler.js";
+
+export default ({
+    modules,
+    logger,
+    storeInteractionMeta,
+    autoCollectPropositionInteractions,
+  }) =>
+  (item) => {
+    const { type, selector } = item.getData() || {};
+
+    if (!selector || !type) {
+      return { setRenderAttempted: false, includeInNotification: false };
+    }
+
+    if (!modules[type]) {
+      logger.warn("Invalid HTML content data", item.getData());
+      return { setRenderAttempted: false, includeInNotification: false };
+    }
+
+    const decorateProposition = createDecorateProposition(
+      autoCollectPropositionInteractions,
+      type,
+      item.getProposition().getId(),
+      item.getId(),
+      item.getTrackingLabel(),
+      item.getProposition().getScopeType(),
+      item.getProposition().getNotification(),
+      storeInteractionMeta,
+    );
+
+    const renderStatusHandler = createRenderStatusHandler(
+      item.getProposition().getScopeType(),
+      item.getId(),
+    );
+
+    return {
+      render: () => {
+        return modules[type](
+          item.getData(),
+          decorateProposition,
+          renderStatusHandler,
+        );
+      },
+      setRenderAttempted: true,
+      includeInNotification: true,
+    };
+  };

package/src/components/Personalization/handlers/createProcessInAppMessage.js

@@ -0,0 +1,91 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { APPLICATION_JSON } from "@adobe/alloy-core/constants/contentType.js";
+
+const DEFAULT_CONTENT = "defaultContent";
+
+const expectedProps = ["content", "contentType"];
+const expectedContentProps = ["mobileParameters", "webParameters", "html"];
+
+const isValidInAppMessage = (data, logger) => {
+  for (let i = 0; i < expectedProps.length; i += 1) {
+    const prop = expectedProps[i];
+    if (!Object.prototype.hasOwnProperty.call(data, prop)) {
+      logger.warn(
+        `Invalid in-app message data: missing property '${prop}'.`,
+        data,
+      );
+      return false;
+    }
+  }
+
+  const { content, contentType } = data;
+
+  if (contentType === APPLICATION_JSON) {
+    for (let i = 0; i < expectedContentProps.length; i += 1) {
+      const prop = expectedContentProps[i];
+      if (!Object.prototype.hasOwnProperty.call(content, prop)) {
+        logger.warn(
+          `Invalid in-app message data.content: missing property '${prop}'.`,
+          data,
+        );
+        return false;
+      }
+    }
+  }
+
+  return true;
+};
+
+export default ({ modules, logger }) => {
+  return (item) => {
+    const data = item.getData();
+    const proposition = item.getProposition();
+    const meta = { ...proposition.getNotification() };
+    const shouldSuppressDisplay = proposition.shouldSuppressDisplay();
+
+    if (!data) {
+      logger.warn("Invalid in-app message data: undefined.", data);
+      return {};
+    }
+
+    const { type = DEFAULT_CONTENT } = data;
+
+    if (!modules[type]) {
+      logger.warn("Invalid in-app message data: unknown type.", data);
+      return {};
+    }
+
+    if (!isValidInAppMessage(data, logger)) {
+      return {};
+    }
+
+    if (!meta) {
+      logger.warn("Invalid in-app message meta: undefined.", meta);
+      return {};
+    }
+
+    return {
+      render: () => {
+        return shouldSuppressDisplay
+          ? null
+          : modules[type]({
+              ...data,
+              meta,
+              identityMap: proposition.getIdentityMap(),
+            });
+      },
+      setRenderAttempted: true,
+      includeInNotification: true,
+    };
+  };
+};

package/src/components/Personalization/handlers/createProcessPropositions.js

@@ -0,0 +1,228 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+import { groupBy, isNonEmptyArray } from "@adobe/alloy-core/utils";
+
+export default ({ schemaProcessors, logger }) => {
+  const wrapRenderWithLogging = (render, item) => () => {
+    return Promise.resolve()
+      .then(render)
+      .then(() => {
+        if (logger.enabled) {
+          logger.info(`Action ${item.toString()} executed.`);
+        }
+        return item.toJSON();
+      })
+      .catch((error) => {
+        const { message, stack } = error;
+        const warning = `Failed to execute action ${item.toString()}. ${message} ${stack}`;
+        logger.logOnContentRendering({
+          status: "rendering-failed",
+          detail: {
+            propositionDetails: item.getProposition().getNotification(),
+            item: item.toJSON(),
+          },
+          error,
+          message: warning,
+          logLevel: "warn",
+        });
+
+        return undefined;
+      });
+  };
+
+  const renderItems = async (renderers, meta) => {
+    const results = await Promise.allSettled(
+      renderers.map((renderer) => renderer()),
+    );
+    const successes = results
+      .filter((result) => result.status === "fulfilled")
+      .map((result) => result.value);
+    // as long as at least one renderer succeeds, we want to add the notification
+    // to the display notifications
+    if (meta && isNonEmptyArray(successes)) {
+      return { ...meta, items: successes };
+    }
+    return undefined;
+  };
+
+  const processItem = (item) => {
+    const processor = schemaProcessors[item.getSchema()];
+    if (!processor) {
+      return {};
+    }
+    return processor(item);
+  };
+
+  const processItems = ({
+    renderers: existingRenderers,
+    returnedPropositions: existingReturnedPropositions,
+    returnedDecisions: existingReturnedDecisions,
+    items,
+    proposition,
+  }) => {
+    let renderers = [...existingRenderers];
+    let returnedPropositions = [...existingReturnedPropositions];
+    let returnedDecisions = [...existingReturnedDecisions];
+    let renderedItems = [];
+    let nonRenderedItems = [];
+    let itemRenderers = [];
+    let atLeastOneWithNotification = false;
+    let render;
+    let setRenderAttempted;
+    let includeInNotification;
+    let onlyRenderThis = false;
+    let i = 0;
+    let item;
+
+    while (items.length > i) {
+      item = items[i];
+      ({ render, setRenderAttempted, includeInNotification, onlyRenderThis } =
+        processItem(item));
+
+      if (onlyRenderThis) {
+        returnedPropositions = [];
+        returnedDecisions = [];
+        if (setRenderAttempted) {
+          renderedItems = [item];
+          nonRenderedItems = [];
+        } else {
+          renderedItems = [];
+          nonRenderedItems = [item];
+        }
+        renderers = [];
+        itemRenderers = [render];
+        atLeastOneWithNotification = includeInNotification;
+        break;
+      }
+
+      if (render) {
+        itemRenderers.push(wrapRenderWithLogging(render, item));
+      }
+      if (includeInNotification) {
+        atLeastOneWithNotification = true;
+      }
+      if (setRenderAttempted) {
+        renderedItems.push(item);
+      } else {
+        nonRenderedItems.push(item);
+      }
+      i += 1;
+    }
+    if (itemRenderers.length > 0) {
+      const meta = atLeastOneWithNotification
+        ? proposition.getNotification()
+        : undefined;
+      renderers.push(() => renderItems(itemRenderers, meta));
+    } else if (atLeastOneWithNotification) {
+      renderers.push(() => Promise.resolve(proposition.getNotification()));
+    }
+    if (renderedItems.length > 0) {
+      proposition.addToReturnValues(
+        returnedPropositions,
+        returnedDecisions,
+        renderedItems,
+        true,
+      );
+    }
+    if (nonRenderedItems.length > 0) {
+      proposition.addToReturnValues(
+        returnedPropositions,
+        returnedDecisions,
+        nonRenderedItems,
+        false,
+      );
+    }
+
+    return {
+      renderers,
+      returnedPropositions,
+      returnedDecisions,
+      onlyRenderThis,
+    };
+  };
+
+  return (renderPropositions, nonRenderPropositions = []) => {
+    let renderers = [];
+    let returnedPropositions = [];
+    let returnedDecisions = [];
+    let onlyRenderThis;
+    let i = 0;
+    let proposition;
+    let items;
+
+    while (renderPropositions.length > i) {
+      proposition = renderPropositions[i];
+      items = proposition.getItems();
+      ({ renderers, returnedPropositions, returnedDecisions, onlyRenderThis } =
+        processItems({
+          renderers,
+          returnedPropositions,
+          returnedDecisions,
+          items,
+          proposition,
+        }));
+      if (onlyRenderThis) {
+        break;
+      }
+      i += 1;
+    }
+
+    if (onlyRenderThis) {
+      // if onlyRenderThis is true, that means returnedPropositions and returnedDecisions
+      // only contains the proposition that triggered only rendering this. We need to
+      // add the other propositions to the returnedPropositions and returnedDecisions.
+      renderPropositions.forEach((p, index) => {
+        if (index !== i) {
+          p.addToReturnValues(
+            returnedPropositions,
+            returnedDecisions,
+            p.getItems(),
+            false,
+          );
+        }
+      });
+    }
+
+    nonRenderPropositions.forEach((p) => {
+      p.addToReturnValues(
+        returnedPropositions,
+        returnedDecisions,
+        p.getItems(),
+        false,
+      );
+    });
+
+    const render = () => {
+      return Promise.all(renderers.map((renderer) => renderer())).then(
+        (metas) => {
+          const propositions = metas.filter((meta) => meta);
+          const renderedPropositions = propositions.map((prop) => {
+            const { id, scope, scopeDetails } = prop;
+            return { id, scope, scopeDetails };
+          });
+          if (isNonEmptyArray(propositions)) {
+            const propsByScope = groupBy(propositions, (p) => p.scope);
+            logger.logOnContentRendering({
+              status: "rendering-succeeded",
+              detail: { ...propsByScope },
+              message: `Scopes: ${JSON.stringify(propsByScope)} successfully executed.`,
+              logLevel: "info",
+            });
+          }
+          return renderedPropositions;
+        },
+      );
+    };
+    return { returnedPropositions, returnedDecisions, render };
+  };
+};

package/src/components/Personalization/handlers/createProcessRedirect.js

@@ -0,0 +1,54 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { hideElements, showElements } from "../flicker/index.js";
+
+const REDIRECT_HIDING_ELEMENT = "BODY";
+export default ({ logger, executeRedirect, collect }) =>
+  (item) => {
+    const { content } = item.getData() || {};
+
+    if (!content) {
+      logger.warn("Invalid Redirect data", item.getData());
+      return {};
+    }
+
+    const render = () => {
+      hideElements(REDIRECT_HIDING_ELEMENT);
+      return collect({
+        decisionsMeta: [item.getProposition().getNotification()],
+        documentMayUnload: true,
+        identityMap: item.getProposition().getIdentityMap(),
+      })
+        .then(() => {
+          logger.logOnContentRendering({
+            status: "rendering-redirect",
+            detail: {
+              propositionDetails: item.getProposition().getNotification(),
+              redirect: content,
+            },
+            message: `Redirect action ${item.toString()} executed.`,
+            logLevel: "info",
+          });
+          return executeRedirect(content);
+          // Execute redirect will never resolve. If there are bottom of page events that are waiting
+          // for display notifications from this request, they will never run because this promise will
+          // not resolve. This is intentional because we don't want to run bottom of page events if
+          // there is a redirect.
+        })
+        .catch((error) => {
+          showElements(REDIRECT_HIDING_ELEMENT);
+          throw error;
+        });
+    };
+
+    return { render, setRenderAttempted: true, onlyRenderThis: true };
+  };

package/src/components/Personalization/handlers/createRenderStatusHandler.js

@@ -0,0 +1,62 @@
+/*
+Copyright 2025 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { VIEW_SCOPE_TYPE } from "../constants/scopeType.js";
+
+/**
+ * Creates a handler to manage the rendering status of elements in personalization
+ *
+ * @param {string} scopeType - The type of scope (e.g. 'view', 'page')
+ * @param {string} itemId - The unique identifier for the item being rendered
+ */
+export default (scopeType, itemId) => {
+  // We only care about tracking renders for view scope
+  if (scopeType !== VIEW_SCOPE_TYPE) {
+    return {
+      shouldRender: () => true,
+      markAsRendered: () => {},
+    };
+  }
+  return {
+    /**
+     * Determines if an element should be rendered based on scopeType and previous render status
+     *
+     * @param {Element|null} propositionContainer - The DOM element to check
+     * @returns {boolean} True if the element should be rendered, false otherwise
+     */
+    shouldRender: (propositionContainer) => {
+      if (!propositionContainer) {
+        return true;
+      }
+      const previouslyRendered = (
+        propositionContainer.dataset.adobePropositionIds ?? ""
+      ).split(",");
+      return !previouslyRendered.includes(itemId);
+    },
+    /**
+     * Marks an element as rendered by setting a data attribute
+     *
+     * @param {Element} propositionContainer - The DOM element to mark as rendered
+     * @returns {void}
+     */
+    markAsRendered: (propositionContainer) => {
+      const previouslyRendered = (
+        propositionContainer.dataset.adobePropositionIds ?? ""
+      ).split(",");
+      if (!previouslyRendered.includes(itemId)) {
+        previouslyRendered.push(itemId);
+      }
+      propositionContainer.dataset.adobePropositionIds = previouslyRendered
+        .sort()
+        .join(",");
+    },
+  };
+};