npm - @watermarkinsights/ripple - Versions diffs - 4.3.0 → 4.4.0-0 - Mend

@watermarkinsights/ripple 4.3.0 → 4.4.0-0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (371) hide show

package/dist/collection/components/charts/chartFunctions.spec.js CHANGED Viewed

@@ -1,16 +1,16 @@
 import { amountToDegree, amountToPercent, polarToCartesian, toFixed } from "./chartFunctions";
 describe("Chart functions", () => {
-  it("truncates", () => {
-    expect(toFixed(3.34872348)).toEqual(3.34);
-  });
-  it("converts polar coords to cartesian", () => {
-    // args: half, radius, startAngle, endAngle?
-    expect(polarToCartesian(12, 5, 34, 45)).toStrictEqual({ x1: 61.74, x2: 54.42, y1: 45.55, y2: 54.42 });
-    expect(polarToCartesian(77, 25, 4)).toStrictEqual({ x: 1997.31, y: 211.28 });
-  });
-  it("calculates percentages and degrees", () => {
-    expect(amountToPercent(3, 9, true)).toBe(33); // last arg is whether output should be int vs float
-    expect(amountToPercent(3, 9, false)).toBe(33.33);
-    expect(amountToDegree(3, 9)).toBe(120);
-  });
+    it("truncates", () => {
+        expect(toFixed(3.34872348)).toEqual(3.34);
+    });
+    it("converts polar coords to cartesian", () => {
+        // args: half, radius, startAngle, endAngle?
+        expect(polarToCartesian(12, 5, 34, 45)).toStrictEqual({ x1: 61.74, x2: 54.42, y1: 45.55, y2: 54.42 });
+        expect(polarToCartesian(77, 25, 4)).toStrictEqual({ x: 1997.31, y: 211.28 });
+    });
+    it("calculates percentages and degrees", () => {
+        expect(amountToPercent(3, 9, true)).toBe(33); // last arg is whether output should be int vs float
+        expect(amountToPercent(3, 9, false)).toBe(33.33);
+        expect(amountToDegree(3, 9)).toBe(120);
+    });
 });

package/dist/collection/components/charts/priv-chart-popover/priv-chart-popover.e2e.js CHANGED Viewed

@@ -1,85 +1,85 @@
 import { newE2EPage } from "@stencil/core/testing";
 import { AxePuppeteer } from "@axe-core/puppeteer";
 describe("priv-chart-popover", () => {
-  let page,
-  // chart: any,
-  // paths: any,
-  host, liveRegion;
-  beforeEach(async () => {
-    page = await newE2EPage();
-    await page.setContent(`<html lang='en'><head><title>Page</title></head><body><main style="height: 3000px"><h1>Title</h1>
+    let page,
+    // chart: any,
+    // paths: any,
+    host, liveRegion;
+    beforeEach(async () => {
+        page = await newE2EPage();
+        await page.setContent(`<html lang='en'><head><title>Page</title></head><body><main style="height: 3000px"><h1>Title</h1>
       <wm-chart label="the label">
       <wm-chart-slice amount="2" legend="Realized" popover-title="2/10" popover-text="Dreams Realized" popover-button-text="Click for bucket list"></wm-chart-slice>
       <wm-chart-slice amount="8" legend="Not Realized" popover-title="8/10" popover-text="Dreams Not Realized" popover-button-text="Click for bucket list"></wm-chart-slice>
       </wm-chart>
       </main></body></html>`);
-    // chart = await page.find("wm-chart");
-    // paths = await page.findAll("wm-chart >>> path");
-    host = await page.find("wm-chart >>> priv-chart-popover");
-    liveRegion = await page.find("wm-chart >>> .live-region");
-    // firstRect = await page.evaluate(() => {
-    //   document.querySelector("wm-chart")!.shadowRoot!.querySelectorAll("rect")
-    // })
-    await page.waitForChanges();
-  });
-  it("passes Axe checks", async () => {
-    const results = await new AxePuppeteer(page).analyze();
-    expect(results.violations.length).toBe(0);
-  });
-  it("renders", async () => {
-    expect(host).not.toBeNull();
-  });
-  it("is has a live region", async () => {
-    expect(liveRegion).toEqualAttribute("aria-live", "polite");
-  });
-  // keyboard actions are handled from wm-chart. popover never actually receives focus
-  it("shows and hide the popover", async () => {
-    // initially div.popover is not there (content is not rendered when it is closed)
-    let popover = await page.find("wm-chart >>> .popover");
-    expect(popover).toBeNull();
-    // it opens / renders content when path is focused
-    await page.keyboard.press("Tab");
-    await page.waitForChanges();
-    await page.keyboard.press("ArrowDown");
-    await page.waitForChanges();
-    popover = await page.find("wm-chart >>> .popover");
-    expect(popover).not.toBeNull();
-    // closes on click away
-    await page.click("h1"); // click out of the component or slice
-    await page.waitForChanges();
-    popover = await page.find("wm-chart >>> .popover");
-    expect(popover).toBeNull();
-  });
-  it("hides the popover on scroll", async () => {
-    // initially div.popover is not there (content is not rendered when it is closed)
-    let popover = await page.find("wm-chart >>> .popover");
-    expect(popover).toBeNull();
-    // it opens / renders content when path is focused
-    await page.keyboard.press("Tab");
-    await page.waitForChanges();
-    await page.keyboard.press("ArrowDown");
-    await page.waitForChanges();
-    popover = await page.find("wm-chart >>> .popover");
-    expect(popover).not.toBeNull();
-    // closes on scroll
-    page.evaluate(() => {
-      window.scrollBy(0, 2000);
+        // chart = await page.find("wm-chart");
+        // paths = await page.findAll("wm-chart >>> path");
+        host = await page.find("wm-chart >>> priv-chart-popover");
+        liveRegion = await page.find("wm-chart >>> .live-region");
+        // firstRect = await page.evaluate(() => {
+        //   document.querySelector("wm-chart")!.shadowRoot!.querySelectorAll("rect")
+        // })
+        await page.waitForChanges();
     });
-    await page.waitForTimeout(300); // waitForChanges alone doesn't always work
-    await page.waitForChanges(); // but somehow both are needed
-    popover = await page.find("wm-chart >>> .popover");
-    expect(popover).toBeNull();
-  });
-  // if the component has a button:
-  it("applies focus styles when user is tabbing", async () => {
-    await page.keyboard.press("Tab");
-    await page.waitForChanges();
-    await page.keyboard.press("ArrowDown");
-    await page.waitForChanges();
-    await page.waitForTimeout(300);
-    expect(host).toHaveClass("user-is-tabbing");
-  });
-  // button fires event wmPopoverButtonClicked when clicked, but I can't figure out how to test if the event has fired
+    it("passes Axe checks", async () => {
+        const results = await new AxePuppeteer(page).analyze();
+        expect(results.violations.length).toBe(0);
+    });
+    it("renders", async () => {
+        expect(host).not.toBeNull();
+    });
+    it("is has a live region", async () => {
+        expect(liveRegion).toEqualAttribute("aria-live", "polite");
+    });
+    // keyboard actions are handled from wm-chart. popover never actually receives focus
+    it("shows and hide the popover", async () => {
+        // initially div.popover is not there (content is not rendered when it is closed)
+        let popover = await page.find("wm-chart >>> .popover");
+        expect(popover).toBeNull();
+        // it opens / renders content when path is focused
+        await page.keyboard.press("Tab");
+        await page.waitForChanges();
+        await page.keyboard.press("ArrowDown");
+        await page.waitForChanges();
+        popover = await page.find("wm-chart >>> .popover");
+        expect(popover).not.toBeNull();
+        // closes on click away
+        await page.click("h1"); // click out of the component or slice
+        await page.waitForChanges();
+        popover = await page.find("wm-chart >>> .popover");
+        expect(popover).toBeNull();
+    });
+    it("hides the popover on scroll", async () => {
+        // initially div.popover is not there (content is not rendered when it is closed)
+        let popover = await page.find("wm-chart >>> .popover");
+        expect(popover).toBeNull();
+        // it opens / renders content when path is focused
+        await page.keyboard.press("Tab");
+        await page.waitForChanges();
+        await page.keyboard.press("ArrowDown");
+        await page.waitForChanges();
+        popover = await page.find("wm-chart >>> .popover");
+        expect(popover).not.toBeNull();
+        // closes on scroll
+        page.evaluate(() => {
+            window.scrollBy(0, 2000);
+        });
+        await page.waitForTimeout(300); // waitForChanges alone doesn't always work
+        await page.waitForChanges(); // but somehow both are needed
+        popover = await page.find("wm-chart >>> .popover");
+        expect(popover).toBeNull();
+    });
+    // if the component has a button:
+    it("applies focus styles when user is tabbing", async () => {
+        await page.keyboard.press("Tab");
+        await page.waitForChanges();
+        await page.keyboard.press("ArrowDown");
+        await page.waitForChanges();
+        await page.waitForTimeout(300);
+        expect(host).toHaveClass("user-is-tabbing");
+    });
+    // button fires event wmPopoverButtonClicked when clicked, but I can't figure out how to test if the event has fired
 });
 // Not tested:
 // Screen readers should re-announce the content when the button is clicked a second time (or more). Otherwise the parent element looks interactive but is inert.