Merge pull request #2128 from Parvinmh/bugfix/hintAnimation

support data-hint-animation attribute for hintAnimation override

Author: binrysearch

src/packages/hint/dataAttributes.ts

@@ -2,3 +2,4 @@ export const dataHintAttribute = "data-hint";
 export const dataStepAttribute = "data-step";
 export const dataHintPositionAttribute = "data-hint-position";
 export const dataTooltipClassAttribute = "data-tooltip-class";
+export const dataHintAnimationAttribute = "data-hint-animation";

src/packages/hint/hintItem.test.ts

@@ -0,0 +1,50 @@
+describe("hintAnimation logic", () => {
+  const dataHintAnimationAttribute = "data-hint-animation";
+
+  let element: HTMLElement;
+  let hint: { getOption: (key: string) => boolean };
+
+  beforeEach(() => {
+    element = document.createElement("div");
+
+    hint = {
+      getOption: jest.fn(() => true), // default: true
+    };
+  });
+
+  function getHintAnimation(element: HTMLElement, hint: any): boolean {
+    const hintAnimationAttr = element.getAttribute(dataHintAnimationAttribute);
+    let hintAnimation: boolean = hint.getOption("hintAnimation");
+    if (hintAnimationAttr) {
+      hintAnimation = hintAnimationAttr === "true";
+    }
+    return hintAnimation;
+  }
+
+  test("should use hint.getOption when no attribute is set", () => {
+    (hint.getOption as jest.Mock).mockReturnValue(true);
+
+    const result = getHintAnimation(element, hint);
+
+    expect(result).toBe(true);
+    expect(hint.getOption).toHaveBeenCalledWith("hintAnimation");
+  });
+
+  test("should override with true when attribute is 'true'", () => {
+    element.setAttribute(dataHintAnimationAttribute, "true");
+    (hint.getOption as jest.Mock).mockReturnValue(false); // default false
+
+    const result = getHintAnimation(element, hint);
+
+    expect(result).toBe(true);
+  });
+
+  test("should override with false when attribute is 'false'", () => {
+    element.setAttribute(dataHintAnimationAttribute, "false");
+    (hint.getOption as jest.Mock).mockReturnValue(true); // default true
+
+    const result = getHintAnimation(element, hint);
+
+    expect(result).toBe(false);
+  });
+});

src/packages/hint/hintItem.ts

@@ -6,6 +6,7 @@ import {
   dataHintAttribute,
   dataHintPositionAttribute,
   dataTooltipClassAttribute,
+  dataHintAnimationAttribute,
 } from "./dataAttributes";
 import { State } from "../dom";
 
@@ -69,7 +70,7 @@ export const fetchHintItems = (hint: Hint) => {
     //first add intro items with data-step
     for (const element of elements) {
       // hint animation
-      let hintAnimationAttr = element.getAttribute(dataHintPositionAttribute);
+      let hintAnimationAttr = element.getAttribute(dataHintAnimationAttribute);
 
       let hintAnimation: boolean = hint.getOption("hintAnimation");
       if (hintAnimationAttr) {