@watermarkinsights/ripple 4.1.0 → 4.2.0-0

package/dist/collection/components/wm-input/wm-input.spec.js

@@ -1,173 +1,173 @@
 import { newSpecPage } from "@stencil/core/testing";
 import { Input } from "./wm-input";
 describe("input", () => {
-  let page;
-  beforeEach(async () => {
-    page = await newSpecPage({
-      components: [Input],
-      html: "<wm-input label='input'></wm-input>",
+    let page;
+    beforeEach(async () => {
+        page = await newSpecPage({
+            components: [Input],
+            html: "<wm-input label='input'></wm-input>",
+        });
+    });
+    it("has the right aria attributes", async () => {
+        let inputField = await page.root.shadowRoot.querySelector("input");
+        // input field is described by help text
+        expect(inputField).toEqualAttribute("aria-describedby", "info error");
+    });
+    it("inputfield is disabled when the prop is passed", async () => {
+        await page.setContent(`<wm-input label="input" disabled></wm-input>`);
+        let inputField = await page.root.shadowRoot.querySelector("input");
+        expect(inputField).toHaveAttribute("disabled");
+    });
+    it("handles keydown", () => {
+        // handleKeyDown
+        const component = new Input();
+        component.characterLimit = 10;
+        let event = { key: "", ctrlKey: false, metaKey: false, altKey: false };
+        let inputEl = document.createElement("input");
+        // @ts-ignore
+        component.inputEl = inputEl;
+        const mockAnnounce = (component.announce = jest.fn());
+        const mockGenerateCharacterLimiWarning = (component.generateCharacterLimitWarning = jest.fn());
+        function resetKeys() {
+            event.key = "";
+            event.ctrlKey = false;
+            event.metaKey = false;
+            event.altKey = false;
+            //@ts-ignore
+            component.inputEl.value = "";
+        }
+        // no modifiers, empty key
+        resetKeys();
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(0);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
+        jest.clearAllMocks();
+        // no modifiers, wrong key
+        resetKeys();
+        event.key = "ArrowDown";
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(0);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
+        jest.clearAllMocks();
+        // no modifiers, right key, not at limit
+        resetKeys();
+        event.key = "a";
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(0);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
+        jest.clearAllMocks();
+        // no modifiers, right key, at limit
+        resetKeys();
+        //@ts-ignore
+        component.inputEl.value = "1234567890";
+        event.key = "a";
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(1);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(1);
+        jest.clearAllMocks();
+        // no modifiers, right key, above limit
+        resetKeys();
+        //@ts-ignore
+        component.inputEl.value = "12345678901234567890";
+        event.key = "a";
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(1);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(1);
+        jest.clearAllMocks();
+        // ctrl modifier, right key, above limit
+        resetKeys();
+        //@ts-ignore
+        component.inputEl.value = "12345678901234567890";
+        event.key = "a";
+        event.ctrlKey = true;
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(0);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
+        jest.clearAllMocks();
+        // meta modifier, right key, above limit
+        resetKeys();
+        //@ts-ignore
+        component.inputEl.value = "12345678901234567890";
+        event.key = "a";
+        event.metaKey = true;
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(0);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
+        jest.clearAllMocks();
+        // alt modifier, right key, above limit
+        resetKeys();
+        //@ts-ignore
+        component.inputEl.value = "12345678901234567890";
+        event.key = "a";
+        event.altKey = true;
+        component.handleKeyDown(event);
+        expect(mockAnnounce).toHaveBeenCalledTimes(0);
+        expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
+        jest.clearAllMocks();
+        jest.restoreAllMocks();
+    });
+    it("handles input", () => {
+        // handleInput
+        const component = new Input();
+        let inputEl = {};
+        let event = { target: inputEl };
+        const mockAnnounce = (component.announce = jest.fn());
+        const mockGenerateCharacterLimitWarning = (component.generateCharacterLimitWarning = jest.fn(() => "announcement"));
+        inputEl.value = "fish";
+        event.target = inputEl;
+        //@ts-ignore
+        component.handleInput(event);
+        expect(component.value).toBe("fish");
+        expect(component.charCount).toBe(4);
+        expect(mockAnnounce).toHaveBeenCalledTimes(0);
+        expect(mockGenerateCharacterLimitWarning).toHaveBeenCalledTimes(0);
+        component.characterLimit = 10;
+        inputEl.value = "two fish";
+        event.target = inputEl;
+        //@ts-ignore
+        component.handleInput(event);
+        expect(component.value).toBe("two fish");
+        expect(component.charCount).toBe(8);
+        expect(mockAnnounce).toHaveBeenCalledTimes(1);
+        expect(mockAnnounce).toHaveBeenCalledWith("announcement");
+        expect(mockGenerateCharacterLimitWarning).toHaveBeenCalledTimes(1);
+        expect(mockGenerateCharacterLimitWarning).toHaveBeenCalledWith(8, 10);
+        jest.resetAllMocks();
+    });
+    it("updates classes on focus", () => {
+        const component = new Input();
+        const divEl = document.createElement("div");
+        //@ts-ignore
+        component.inputWrapperEl = divEl;
+        //@ts-ignore
+        expect(component.inputWrapperEl).not.toHaveClass("focus");
+        component.handleFocus();
+        //@ts-ignore
+        expect(component.inputWrapperEl).toHaveClass("focus");
+    });
+    it("updates the live region announcement", () => {
+        // announce
+        const component = new Input();
+        let divEl = document.createElement("div");
+        //@ts-ignore
+        component.liveRegionEl = divEl;
+        component.announce("Message");
+        expect(component.announcement).toBe("Message");
+        //@ts-ignore
+        component.liveRegionEl.textContent = "Message";
+        component.announce("Message");
+        expect(component.announcement).toBe("Message" + "\u00A0");
+    });
+    it("generates the appropriate character limit warning", () => {
+        // generateCharacterLimitWarning
+        const component = new Input();
+        expect(component.generateCharacterLimitWarning(0, 10)).toBe("0 of 10 characters entered.");
+        expect(component.generateCharacterLimitWarning(5, 8)).toBe("5 of 8 characters entered.");
+        expect(component.generateCharacterLimitWarning(8, 8)).toBe("8 of 8 characters entered. No additional characters will be entered.");
+    });
+    it("sets input to required", async () => {
+        await page.setContent(`<wm-input label='input' required-field='true'></wm-input>`);
+        const input = await page.root.shadowRoot.querySelector("input");
+        expect(input).toEqualAttribute("aria-required", "true");
     });
-  });
-  it("has the right aria attributes", async () => {
-    let inputField = await page.root.shadowRoot.querySelector("input");
-    // input field is described by help text
-    expect(inputField).toEqualAttribute("aria-describedby", "info error");
-  });
-  it("inputfield is disabled when the prop is passed", async () => {
-    await page.setContent(`<wm-input label="input" disabled></wm-input>`);
-    let inputField = await page.root.shadowRoot.querySelector("input");
-    expect(inputField).toHaveAttribute("disabled");
-  });
-  it("handles keydown", () => {
-    // handleKeyDown
-    const component = new Input();
-    component.characterLimit = 10;
-    let event = { key: "", ctrlKey: false, metaKey: false, altKey: false };
-    let inputEl = document.createElement("input");
-    // @ts-ignore
-    component.inputEl = inputEl;
-    const mockAnnounce = (component.announce = jest.fn());
-    const mockGenerateCharacterLimiWarning = (component.generateCharacterLimitWarning = jest.fn());
-    function resetKeys() {
-      event.key = "";
-      event.ctrlKey = false;
-      event.metaKey = false;
-      event.altKey = false;
-      //@ts-ignore
-      component.inputEl.value = "";
-    }
-    // no modifiers, empty key
-    resetKeys();
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(0);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
-    jest.clearAllMocks();
-    // no modifiers, wrong key
-    resetKeys();
-    event.key = "ArrowDown";
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(0);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
-    jest.clearAllMocks();
-    // no modifiers, right key, not at limit
-    resetKeys();
-    event.key = "a";
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(0);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
-    jest.clearAllMocks();
-    // no modifiers, right key, at limit
-    resetKeys();
-    //@ts-ignore
-    component.inputEl.value = "1234567890";
-    event.key = "a";
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(1);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(1);
-    jest.clearAllMocks();
-    // no modifiers, right key, above limit
-    resetKeys();
-    //@ts-ignore
-    component.inputEl.value = "12345678901234567890";
-    event.key = "a";
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(1);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(1);
-    jest.clearAllMocks();
-    // ctrl modifier, right key, above limit
-    resetKeys();
-    //@ts-ignore
-    component.inputEl.value = "12345678901234567890";
-    event.key = "a";
-    event.ctrlKey = true;
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(0);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
-    jest.clearAllMocks();
-    // meta modifier, right key, above limit
-    resetKeys();
-    //@ts-ignore
-    component.inputEl.value = "12345678901234567890";
-    event.key = "a";
-    event.metaKey = true;
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(0);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
-    jest.clearAllMocks();
-    // alt modifier, right key, above limit
-    resetKeys();
-    //@ts-ignore
-    component.inputEl.value = "12345678901234567890";
-    event.key = "a";
-    event.altKey = true;
-    component.handleKeyDown(event);
-    expect(mockAnnounce).toHaveBeenCalledTimes(0);
-    expect(mockGenerateCharacterLimiWarning).toHaveBeenCalledTimes(0);
-    jest.clearAllMocks();
-    jest.restoreAllMocks();
-  });
-  it("handles input", () => {
-    // handleInput
-    const component = new Input();
-    let inputEl = {};
-    let event = { target: inputEl };
-    const mockAnnounce = (component.announce = jest.fn());
-    const mockGenerateCharacterLimitWarning = (component.generateCharacterLimitWarning = jest.fn(() => "announcement"));
-    inputEl.value = "fish";
-    event.target = inputEl;
-    //@ts-ignore
-    component.handleInput(event);
-    expect(component.value).toBe("fish");
-    expect(component.charCount).toBe(4);
-    expect(mockAnnounce).toHaveBeenCalledTimes(0);
-    expect(mockGenerateCharacterLimitWarning).toHaveBeenCalledTimes(0);
-    component.characterLimit = 10;
-    inputEl.value = "two fish";
-    event.target = inputEl;
-    //@ts-ignore
-    component.handleInput(event);
-    expect(component.value).toBe("two fish");
-    expect(component.charCount).toBe(8);
-    expect(mockAnnounce).toHaveBeenCalledTimes(1);
-    expect(mockAnnounce).toHaveBeenCalledWith("announcement");
-    expect(mockGenerateCharacterLimitWarning).toHaveBeenCalledTimes(1);
-    expect(mockGenerateCharacterLimitWarning).toHaveBeenCalledWith(8, 10);
-    jest.resetAllMocks();
-  });
-  it("updates classes on focus", () => {
-    const component = new Input();
-    const divEl = document.createElement("div");
-    //@ts-ignore
-    component.inputWrapperEl = divEl;
-    //@ts-ignore
-    expect(component.inputWrapperEl).not.toHaveClass("focus");
-    component.handleFocus();
-    //@ts-ignore
-    expect(component.inputWrapperEl).toHaveClass("focus");
-  });
-  it("updates the live region announcement", () => {
-    // announce
-    const component = new Input();
-    let divEl = document.createElement("div");
-    //@ts-ignore
-    component.liveRegionEl = divEl;
-    component.announce("Message");
-    expect(component.announcement).toBe("Message");
-    //@ts-ignore
-    component.liveRegionEl.textContent = "Message";
-    component.announce("Message");
-    expect(component.announcement).toBe("Message" + "\u00A0");
-  });
-  it("generates the appropriate character limit warning", () => {
-    // generateCharacterLimitWarning
-    const component = new Input();
-    expect(component.generateCharacterLimitWarning(0, 10)).toBe("0 of 10 characters entered.");
-    expect(component.generateCharacterLimitWarning(5, 8)).toBe("5 of 8 characters entered.");
-    expect(component.generateCharacterLimitWarning(8, 8)).toBe("8 of 8 characters entered. No additional characters will be entered.");
-  });
-  it("sets input to required", async () => {
-    await page.setContent(`<wm-input label='input' required-field='true'></wm-input>`);
-    const input = await page.root.shadowRoot.querySelector("input");
-    expect(input).toEqualAttribute("aria-required", "true");
-  });
 });

package/dist/collection/components/wm-menuitem/wm-menuitem.e2e.js

@@ -1,23 +1,23 @@
 import { newE2EPage } from "@stencil/core/testing";
 describe("wm-menuitem", () => {
-  let page;
-  beforeEach(async () => {
-    page = await newE2EPage();
-    await page.setContent(`<html lang='en'><head><title>Page</title></head><body><main><h1>Title</h1>
+    let page;
+    beforeEach(async () => {
+        page = await newE2EPage();
+        await page.setContent(`<html lang='en'><head><title>Page</title></head><body><main><h1>Title</h1>
       <wm-action-menu id='menu' tooltip="menu name"><wm-menuitem id='first' disabled onClick='action()'>First action</wm-menuitem><wm-menuitem id='second'>Second action</wm-menuitem><wm-menuitem id='third'>Third action</wm-menuitem></wm-action-menu>
       <script>function action() {document.getElementById('second').innerHTML = 'Changed text'}</script></main></body></html>`);
-  });
-  it("renders", async () => {
-    const element = await page.find("wm-menuitem");
-    expect(element).not.toBeNull();
-  });
-  it("prevents action on disabled item", async () => {
-    await page.keyboard.press("Tab");
-    await page.keyboard.press("Enter"); // open popup
-    await page.waitForChanges();
-    await page.keyboard.press("Enter");
-    await page.waitForChanges();
-    let changedMenuitem = await page.find("wm-menuitem#second");
-    expect(changedMenuitem.innerHTML).toEqual("Second action");
-  });
+    });
+    it("renders", async () => {
+        const element = await page.find("wm-menuitem");
+        expect(element).not.toBeNull();
+    });
+    it("prevents action on disabled item", async () => {
+        await page.keyboard.press("Tab");
+        await page.keyboard.press("Enter"); // open popup
+        await page.waitForChanges();
+        await page.keyboard.press("Enter");
+        await page.waitForChanges();
+        let changedMenuitem = await page.find("wm-menuitem#second");
+        expect(changedMenuitem.innerHTML).toEqual("Second action");
+    });
 });