@esri/calcite-components 1.0.0-next.591 → 1.0.0-next.593

package/dist/collection/components/input-number/input-number.e2e.js

@@ -1,1004 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { defaults, disabled, focusable, formAssociated, labelable, reflects, renders, hidden } from "../../tests/commonTests";
-import { html } from "../../../support/formatting";
-import { letterKeys, numberKeys } from "../../utils/key";
-import { getDecimalSeparator, locales, localizeNumberString } from "../../utils/locale";
-import { getElementXY } from "../../tests/utils";
-describe("calcite-input-number", () => {
-    const delayFor2UpdatesInMs = 200;
-    /**
-     * This helper wraps number typing to work around test instability
-     *
-     * @param page
-     * @param numberAsText
-     */
-    async function typeNumberValue(page, numberAsText) {
-        await page.keyboard.type(numberAsText, numberAsText.length > 1 ? { delay: 100 } : undefined);
-    }
-    it("is labelable", async () => labelable("calcite-input-number"));
-    it("renders", () => renders("calcite-input-number", { display: "block" }));
-    it("honors hidden attribute", async () => hidden("calcite-input-number"));
-    it("reflects", async () => reflects("calcite-input-number", [
-        {
-            propertyName: "status",
-            value: "valid"
-        },
-        {
-            propertyName: "alignment",
-            value: "center"
-        },
-        {
-            propertyName: "numberButtonType",
-            value: "horizontal"
-        },
-        {
-            propertyName: "scale",
-            value: "s"
-        }
-    ]));
-    it("has defaults", async () => defaults("calcite-input-number", [
-        {
-            propertyName: "status",
-            defaultValue: "idle"
-        },
-        {
-            propertyName: "alignment",
-            defaultValue: "start"
-        },
-        {
-            propertyName: "numberButtonType",
-            defaultValue: "vertical"
-        },
-        {
-            propertyName: "scale",
-            defaultValue: "m"
-        },
-        {
-            propertyName: "value",
-            defaultValue: ""
-        }
-    ]));
-    it("can be disabled", () => disabled("calcite-input-number"));
-    it("when disabled, spinner buttons  should not be interactive/should not nudge the number", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number disabled></calcite-input-number>`);
-        const numberButtonItem = await page.find("calcite-input-number >>> .number-button-item");
-        const calciteInputInput = await page.spyOnEvent("calciteInputNumberInput");
-        await numberButtonItem.click();
-        await page.waitForChanges();
-        expect(calciteInputInput).not.toHaveReceivedEvent();
-    });
-    it("inherits requested props when from wrapping calcite-label when props are provided", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `
-      <calcite-label status="invalid" scale="s">
-        Label text
-        <calcite-input-number></calcite-input-number>
-      </calcite-label>
-    `);
-        const deprecatedLabelStatusElement = await page.find("calcite-input-number");
-        expect(await deprecatedLabelStatusElement.getProperty("status")).toEqual("invalid");
-        expect(await deprecatedLabelStatusElement.getProperty("scale")).toEqual("s");
-    });
-    it("renders an icon when explicit Calcite UI is requested, and is a type without a default icon", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number icon="key"></calcite-input-number>`);
-        const icon = await page.find("calcite-input-number >>> .icon");
-        expect(icon).not.toBeNull();
-    });
-    it("does not render an icon when requested without an explicit Calcite UI, and is a type without a default icon", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number icon></calcite-input-number>`);
-        const icon = await page.find("calcite-input-number >>> .icon");
-        expect(icon).toBeNull();
-    });
-    it("renders number buttons in default vertical alignment", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const numberVerticalWrapper = await page.find("calcite-input-number >>> .number-button-wrapper");
-        const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='down']");
-        const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='up']");
-        expect(numberVerticalWrapper).not.toBeNull();
-        expect(numberHorizontalItemDown).toBeNull();
-        expect(numberHorizontalItemUp).toBeNull();
-    });
-    it("renders number buttons in horizontal vertical alignment and number button type is horizontal", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number number-button-type="horizontal"></calcite-input-number>`);
-        const numberVerticalWrapper = await page.find("calcite-input-number >>> .number-button-wrapper");
-        const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='down']");
-        const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='up']");
-        expect(numberVerticalWrapper).toBeNull();
-        expect(numberHorizontalItemDown).not.toBeNull();
-        expect(numberHorizontalItemUp).not.toBeNull();
-    });
-    it("does not render number buttons in default vertical alignment and read-only", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number read-only></calcite-input-number>`);
-        const numberVerticalWrapper = await page.find("calcite-input-number >>> .number-button-wrapper");
-        expect(numberVerticalWrapper).toBeNull();
-    });
-    it("does not render number buttons in horizontal alignment, number button type is horizontal, and read-only", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number number-button-type="horizontal" read-only></calcite-input-number>`);
-        const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='down']");
-        const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='up']");
-        expect(numberHorizontalItemDown).toBeNull();
-        expect(numberHorizontalItemUp).toBeNull();
-    });
-    it("renders no buttons and number button type is none", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number number-button-type="none"></calcite-input-number>`);
-        const numberVerticalWrapper = await page.find("calcite-input-number >>> .number-button-wrapper");
-        const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='down']");
-        const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item--horizontal[data-adjustment='up']");
-        expect(numberVerticalWrapper).toBeNull();
-        expect(numberHorizontalItemDown).toBeNull();
-        expect(numberHorizontalItemUp).toBeNull();
-    });
-    it("is focusable", async () => focusable(`calcite-input-number`, {
-        shadowFocusTargetSelector: "input"
-    }));
-    describe("increment/decrement functionality", () => {
-        let page;
-        beforeEach(async () => {
-            page = await newE2EPage();
-        });
-        it("correctly increments and decrements decimal value when number buttons are clicked and the step precision matches the precision of the initial value", async () => {
-            await page.setContent(html `<calcite-input-number value="3.123" step="0.001"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='down']");
-            const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='up']");
-            expect(await element.getProperty("value")).toBe("3.123");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("3.122");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("3.123");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("3.124");
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            expect(await element.getProperty("value")).toBe("3.134");
-        });
-        it("correctly increments and decrements initial decimal value by 1 when number buttons are clicked and step is set to default of 1.", async () => {
-            await page.setContent(html `<calcite-input-number value="3.123"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='down']");
-            const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='up']");
-            expect(await element.getProperty("value")).toBe("3.123");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("2.123");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("3.123");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("4.123");
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            await numberHorizontalItemUp.click();
-            expect(await element.getProperty("value")).toBe("14.123");
-        });
-        it("correctly increments and decrements value when number buttons are clicked and step is set to an integer", async () => {
-            await page.setContent(html `<calcite-input-number step="10" value="15"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='down']");
-            const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='up']");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("5");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("15");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("25");
-        });
-        it("correctly increments and decrements on long hold on mousedown and step is set to a decimal", async () => {
-            await page.setContent(html `<calcite-input-number value="0" step="0.01"></calcite-input-number>`);
-            const input = await page.find("calcite-input-number");
-            const [buttonUpLocationX, buttonUpLocationY] = await getElementXY(page, "calcite-input-number", ".number-button-item[data-adjustment='up']");
-            const inputEventSpy = await input.spyOnEvent("calciteInputNumberInput");
-            await page.mouse.move(buttonUpLocationX, buttonUpLocationY);
-            await page.mouse.down();
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.mouse.up();
-            await page.waitForChanges();
-            const totalNudgesUp = inputEventSpy.length;
-            expect(await input.getProperty("value")).toBe(`0.0${totalNudgesUp}`);
-            const [buttonDownLocationX, buttonDownLocationY] = await getElementXY(page, "calcite-input-number", ".number-button-item[data-adjustment='down']");
-            await page.mouse.move(buttonDownLocationX, buttonDownLocationY);
-            await page.mouse.down();
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.mouse.up();
-            await page.waitForChanges();
-            const totalNudgesDown = inputEventSpy.length - totalNudgesUp;
-            const finalNudgedValue = totalNudgesUp - totalNudgesDown;
-            expect(await input.getProperty("value")).toBe(finalNudgedValue === 0 ? "0" : `0.0${finalNudgedValue}`);
-        });
-        it("correctly increments and decrements value by one when any is set for step", async () => {
-            await page.setContent(html `<calcite-input-number step="any" value="5.5"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='down']");
-            const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='up']");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("4.5");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("5.5");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("6.5");
-        });
-        it("correctly increments and decrements value by one when step is undefined", async () => {
-            await page.setContent(html `<calcite-input-number value="5"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='down']");
-            const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='up']");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("4");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("5");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("6");
-        });
-        it("correctly stops decrementing value when min is set", async () => {
-            await page.setContent(html `<calcite-input-number min="10" value="11"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='down']");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("10");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("10");
-        });
-        it("correctly stops incrementing value when max is set", async () => {
-            await page.setContent(html `<calcite-input-number max="10" value="9"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='up']");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("10");
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("10");
-        });
-        it("should emit event when up or down clicked", async () => {
-            await page.setContent(html `<calcite-input-number max="0" value="-2"></calcite-input-number>`);
-            const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-            const numberHorizontalItemUp = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='up']");
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(0);
-            await numberHorizontalItemUp.click();
-            await page.waitForChanges();
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(1);
-            const numberHorizontalItemDown = await page.find("calcite-input-number >>> .number-button-item[data-adjustment='down']");
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(2);
-            await numberHorizontalItemDown.click();
-            await page.waitForChanges();
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(3);
-        });
-        it("should emit an event on an interval when ArrowUp/ArrowDown keys are down and stop on key up", async () => {
-            await page.setContent(html `<calcite-input-number value="0"></calcite-input-number>`);
-            const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-            const input = await page.find("calcite-input-number");
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(0);
-            await input.callMethod("setFocus");
-            await page.keyboard.down("ArrowUp");
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.waitForEvent("calciteInputNumberInput");
-            await page.keyboard.up("ArrowUp");
-            await page.waitForChanges();
-            const totalNudgesUp = calciteInputNumberInput.length;
-            expect(await input.getProperty("value")).toBe(`${totalNudgesUp}`);
-            await page.keyboard.down("ArrowDown");
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.keyboard.up("ArrowDown");
-            await page.waitForChanges();
-            const totalNudgesDown = calciteInputNumberInput.length - totalNudgesUp;
-            const finalNudgedValue = totalNudgesUp - totalNudgesDown;
-            expect(await input.getProperty("value")).toBe(`${finalNudgedValue}`);
-        });
-        it("should emit an event on an interval when up/down buttons are down and stop on mouseup/mouseleave", async () => {
-            await page.setContent(html `<calcite-input-number value="0"></calcite-input-number>`);
-            const input = await page.find("calcite-input-number");
-            const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-            const [buttonUpLocationX, buttonUpLocationY] = await getElementXY(page, "calcite-input-number", ".number-button-item[data-adjustment='up']");
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(0);
-            await page.mouse.move(buttonUpLocationX, buttonUpLocationY);
-            await page.mouse.down();
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.mouse.up();
-            await page.waitForChanges();
-            let totalNudgesUp = calciteInputNumberInput.length;
-            expect(await input.getProperty("value")).toBe(`${totalNudgesUp}`);
-            await page.mouse.down();
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.mouse.move(buttonUpLocationX - 1, buttonUpLocationY - 1);
-            totalNudgesUp = calciteInputNumberInput.length;
-            expect(await input.getProperty("value")).toBe(`${totalNudgesUp}`);
-            // assert changes no longer emitted after moving away from stepper
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            expect(await input.getProperty("value")).toBe(`${totalNudgesUp}`);
-            await page.mouse.up(); // mouseleave assertion done, we release
-            const [buttonDownLocationX, buttonDownLocationY] = await getElementXY(page, "calcite-input-number", ".number-button-item[data-adjustment='down']");
-            await page.mouse.move(buttonDownLocationX, buttonDownLocationY);
-            await page.mouse.down();
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.mouse.up();
-            await page.waitForChanges();
-            let totalNudgesDown = calciteInputNumberInput.length - totalNudgesUp;
-            let finalNudgedValue = totalNudgesUp - totalNudgesDown;
-            expect(await input.getProperty("value")).toBe(`${finalNudgedValue}`);
-            await page.mouse.down();
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.mouse.move(buttonDownLocationX - 1, buttonDownLocationY - 1);
-            totalNudgesDown = calciteInputNumberInput.length - totalNudgesUp;
-            finalNudgedValue = totalNudgesUp - totalNudgesDown;
-            expect(await input.getProperty("value")).toBe(`${finalNudgedValue}`);
-            // assert changes no longer emitted after moving away from stepper
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            expect(await input.getProperty("value")).toBe(`${finalNudgedValue}`);
-        });
-        it("when both 'ArrowUp' and 'ArrowDown' are pressed at the same time most recently pressed key takes over", async () => {
-            await page.setContent(html `<calcite-input-number value="0"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            await element.callMethod("setFocus");
-            const arrowUpDown = page.keyboard.down("ArrowUp");
-            const arrowDownDown = page.keyboard.down("ArrowDown");
-            await Promise.all([arrowUpDown, arrowDownDown]);
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            expect(await element.getProperty("value")).toBe("-1");
-        });
-        it("should emit event only twice when toggled fast between up/down arrows", async () => {
-            await page.setContent(html `<calcite-input-number value="0"></calcite-input-number>`);
-            const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-            const element = await page.find("calcite-input-number");
-            await element.callMethod("setFocus");
-            const arrowUpDown = page.keyboard.down("ArrowUp");
-            const arrowUpUp = page.keyboard.up("ArrowUp");
-            const arrowDownDown = page.keyboard.down("ArrowDown");
-            const arrowDownUp = page.keyboard.up("ArrowDown");
-            await Promise.all([arrowUpDown, arrowUpUp, arrowDownDown, arrowDownUp]);
-            await page.waitForChanges();
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(2);
-        });
-        it("up/down arrow keys increments and decrements correctly when the step is a decimal", async () => {
-            await page.setContent(html `<calcite-input-number step="0.1"></calcite-input-number> `);
-            const input = await page.find("calcite-input-number");
-            await input.callMethod("setFocus");
-            await page.keyboard.press("ArrowUp");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("0.1");
-            await page.keyboard.press("ArrowUp");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("0.2");
-            await page.keyboard.press("ArrowDown");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("0.1");
-            await page.keyboard.press("ArrowDown");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("0");
-        });
-        it("up/down arrow keys increments and decrements correctly when the step is an integer and the value is a decimal", async () => {
-            await page.setContent(html `<calcite-input-number step="5" value="1.008"></calcite-input-number>`);
-            const input = await page.find("calcite-input-number");
-            await input.callMethod("setFocus");
-            await page.keyboard.press("ArrowUp");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("6.008");
-            await page.keyboard.press("ArrowUp");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("11.008");
-            await page.keyboard.press("ArrowDown");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("6.008");
-            await page.keyboard.press("ArrowDown");
-            await page.waitForChanges();
-            expect(await input.getProperty("value")).toBe("1.008");
-        });
-    });
-    describe("direct changes to the value", () => {
-        let page;
-        beforeEach(async () => {
-            page = await newE2EPage();
-        });
-        it("incrementing correctly updates the value after focus and blur events", async () => {
-            await page.setContent(html `<calcite-input-number value="1"></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            await element.click();
-            await page.waitForChanges;
-            await element.callMethod("blur");
-            await page.waitForChanges;
-            element.setProperty("value", "2");
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe("2");
-            const input = await page.find("calcite-input-number >>> input");
-            expect(await input.getProperty("value")).toBe("2");
-        });
-    });
-    describe("emits events when value is modified", () => {
-        async function assertChangeEvents() {
-            const page = await newE2EPage();
-            await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            const calciteInputNumberInput = await element.spyOnEvent("calciteInputNumberInput");
-            const calciteInputNumberChange = await element.spyOnEvent("calciteInputNumberChange");
-            const inputFirstPart = "12345";
-            await element.callMethod("setFocus");
-            await typeNumberValue(page, inputFirstPart);
-            expect(await element.getProperty("value")).toBe(inputFirstPart);
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(5);
-            expect(calciteInputNumberChange).toHaveReceivedEventTimes(0);
-            await element.callMethod("setFocus");
-            await page.keyboard.press("Enter");
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(5);
-            expect(calciteInputNumberChange).toHaveReceivedEventTimes(1);
-            await element.callMethod("setFocus");
-            await page.keyboard.press("Enter");
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(5);
-            expect(calciteInputNumberChange).toHaveReceivedEventTimes(1);
-            const textSecondPart = "67890";
-            await element.callMethod("setFocus");
-            await typeNumberValue(page, textSecondPart);
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(10);
-            expect(calciteInputNumberChange).toHaveReceivedEventTimes(1);
-            await element.callMethod("setFocus");
-            await page.keyboard.press("Tab");
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(10);
-            expect(calciteInputNumberChange).toHaveReceivedEventTimes(2);
-            expect(await element.getProperty("value")).toBe(`${inputFirstPart}${textSecondPart}`);
-            await element.callMethod("setFocus");
-            await page.keyboard.press("Tab");
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(10);
-            expect(calciteInputNumberChange).toHaveReceivedEventTimes(2);
-            expect(await element.getProperty("value")).toBe(`${inputFirstPart}${textSecondPart}`);
-            const programmaticSetValue = "1337";
-            element.setProperty("value", programmaticSetValue);
-            await page.waitForChanges();
-            expect(await element.getProperty("value")).toBe(programmaticSetValue);
-            expect(calciteInputNumberInput).toHaveReceivedEventTimes(10);
-            expect(calciteInputNumberChange).toHaveReceivedEventTimes(2);
-        }
-        it("emits events", () => assertChangeEvents());
-    });
-    it("value stays in sync when value property is controlled with javascript", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const calciteInput = await page.find("calcite-input-number");
-        const input = await page.find("calcite-input-number >>> input");
-        await page.evaluate(() => {
-            document
-                .querySelector("calcite-input-number")
-                .addEventListener("calciteInputNumberInput", (event) => {
-                const target = event.target;
-                target.value = "5";
-            });
-        });
-        await calciteInput.click();
-        await typeNumberValue(page, "1");
-        await page.waitForChanges();
-        expect(await calciteInput.getProperty("value")).toBe("5");
-        expect(await input.getProperty("value")).toBe("5");
-        await typeNumberValue(page, "2");
-        await page.waitForChanges();
-        expect(await calciteInput.getProperty("value")).toBe("5");
-        expect(await input.getProperty("value")).toBe("5");
-    });
-    it("doesn't round numbers larger than double-precision floating-point", async () => {
-        const preciseNumber = "4.9999999999999999";
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number value=${preciseNumber}></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        expect(await element.getProperty("value")).toBe(preciseNumber);
-    });
-    it("allows typing negative decimal values", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await page.waitForChanges();
-        await typeNumberValue(page, "-");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("");
-        await typeNumberValue(page, "0.001");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("-0.001");
-    });
-    it("allows exponential number format", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await page.waitForChanges();
-        await typeNumberValue(page, "1.2e5");
-        await page.waitForChanges();
-        expect(Number(await element.getProperty("value"))).toBe(120000);
-        await page.keyboard.press("ArrowLeft");
-        await page.waitForChanges();
-        await typeNumberValue(page, "-");
-        await page.waitForChanges();
-        expect(Number(await element.getProperty("value"))).toBe(0.000012);
-    });
-    it("sanitizes numbers when using exponential format", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await page.waitForChanges();
-        await typeNumberValue(page, "------000005eeee00005----eee");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("-5e5");
-        expect(Number(await element.getProperty("value"))).toBe(-500000);
-    });
-    it("increments correctly with exponential numbers", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await page.waitForChanges();
-        await typeNumberValue(page, "2e-2");
-        await page.waitForChanges();
-        expect(Number(await element.getProperty("value"))).toBe(0.02);
-        await page.waitForChanges();
-        await page.keyboard.press("ArrowUp");
-        await page.waitForChanges();
-        expect(Number(await element.getProperty("value"))).toBe(1.02);
-    });
-    it("decrements correctly with exponential numbers", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number step="5"></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await page.waitForChanges();
-        await typeNumberValue(page, "2e2");
-        await page.waitForChanges();
-        expect(Number(await element.getProperty("value"))).toBe(200);
-        await page.waitForChanges();
-        await page.keyboard.press("ArrowDown");
-        await page.waitForChanges();
-        expect(Number(await element.getProperty("value"))).toBe(195);
-    });
-    it("disallows typing number with shift modifier key down", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const calciteInput = await page.find("calcite-input-number");
-        const input = await page.find("calcite-input-number >>> input");
-        await calciteInput.callMethod("setFocus");
-        for (let i = 0; i < numberKeys.length; i++) {
-            await page.keyboard.down("Shift");
-            await page.keyboard.press(numberKeys[i]);
-            await page.keyboard.up("Shift");
-            expect(await calciteInput.getProperty("value")).toBeFalsy();
-            expect(await input.getProperty("value")).toBeFalsy();
-        }
-        const nonELetterKeys = letterKeys.filter((key) => key !== "e");
-        for (let i = 0; i < nonELetterKeys.length; i++) {
-            await page.keyboard.down("Shift");
-            await page.keyboard.press(nonELetterKeys[i]);
-            await page.keyboard.up("Shift");
-            expect(await calciteInput.getProperty("value")).toBeFalsy();
-            expect(await input.getProperty("value")).toBeFalsy();
-        }
-    });
-    it("allows shift tabbing", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `
-      <calcite-input-number id="input1" label="one"></calcite-input-number>
-      <calcite-input-number id="input2" label="two"></calcite-input-number>
-    `);
-        const calciteInput2 = await page.find("#input2");
-        await calciteInput2.callMethod("setFocus");
-        expect(await page.evaluate(() => document.activeElement.getAttribute("label"))).toEqual("two");
-        await page.keyboard.down("Shift");
-        await page.keyboard.press("Tab");
-        expect(await page.evaluate(() => document.activeElement.getAttribute("label"))).toEqual("one");
-    });
-    it("typing zero and then a non-zero number sets and emits the non-zero number", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-        const calciteInput = await page.find("calcite-input-number");
-        await calciteInput.callMethod("setFocus");
-        await page.keyboard.press("0");
-        await page.waitForChanges();
-        expect(await calciteInput.getProperty("value")).toBe("0");
-        expect(calciteInputNumberInput).toHaveReceivedEventTimes(1);
-        await page.keyboard.press("1");
-        await page.waitForChanges();
-        expect(await calciteInput.getProperty("value")).toBe("1");
-        expect(calciteInputNumberInput).toHaveReceivedEventTimes(2);
-    });
-    it("allows any valid number", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number>`);
-        const input = await page.find("calcite-input-number");
-        await input.callMethod("setFocus");
-        await typeNumberValue(page, "1.005");
-        await page.waitForChanges();
-        expect(await input.getProperty("value")).toBe("1.005");
-    });
-    it("allows clearing value with an empty string", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number value="1"></calcite-input-number>`);
-        const input = await page.find("calcite-input-number");
-        input.setProperty("value", "");
-        await page.waitForChanges();
-        expect(await input.getProperty("value")).toBe("");
-    });
-    describe("number locale support", () => {
-        // "nb" and "es-MX" locales skipped per: https://github.com/Esri/calcite-components/issues/2323
-        const localesWithIssues = ["ar", "bs", "mk", "nb", "es-MX"];
-        locales
-            .filter((locale) => !localesWithIssues.includes(locale))
-            .forEach((locale) => {
-            it(`displays decimal separator on initial load for ${locale} locale`, async () => {
-                const value = "1234.56";
-                const page = await newE2EPage();
-                await page.setContent(html `<calcite-input-number lang="${locale}" value="${value}"></calcite-input-number>`);
-                const calciteInput = await page.find("calcite-input-number");
-                const input = await page.find("calcite-input-number >>> input");
-                expect(await calciteInput.getProperty("value")).toBe(value);
-                expect(await input.getProperty("value")).toBe(localizeNumberString(value, locale));
-            });
-            it(`displays group and decimal separator on initial load for ${locale} locale using opt-in prop`, async () => {
-                const value = "1234.56";
-                const page = await newE2EPage();
-                await page.setContent(html `<calcite-input-number lang="${locale}" value="${value}" group-separator></calcite-input-number>`);
-                const calciteInput = await page.find("calcite-input-number");
-                const input = await page.find("calcite-input-number >>> input");
-                expect(await calciteInput.getProperty("value")).toBe(value);
-                expect(await input.getProperty("value")).toBe(localizeNumberString(value, locale, true));
-            });
-            it(`allows typing valid decimal characters for ${locale} locale`, async () => {
-                const page = await newE2EPage();
-                await page.setContent(html `<calcite-input-number lang="${locale}"></calcite-input-number>`);
-                const calciteInput = await page.find("calcite-input-number");
-                const input = await page.find("calcite-input-number >>> input");
-                const decimal = getDecimalSeparator(locale);
-                const unformattedValue = "1234.56";
-                await page.keyboard.press("Tab");
-                await typeNumberValue(page, "1234");
-                await page.keyboard.sendCharacter(decimal);
-                await input.press("5");
-                await input.press("6");
-                expect(await calciteInput.getProperty("value")).toBe(`1234.56`);
-                expect(await input.getProperty("value")).toBe(localizeNumberString(unformattedValue, locale));
-            });
-            it(`displays correct formatted value when using exponential numbers for ${locale} locale`, async () => {
-                const page = await newE2EPage();
-                await page.setContent(html `<calcite-input-number lang="${locale}"></calcite-input-number>`);
-                const calciteInput = await page.find("calcite-input-number");
-                const input = await page.find("calcite-input-number >>> input");
-                const decimal = getDecimalSeparator(locale);
-                await page.keyboard.press("Tab");
-                await page.waitForChanges();
-                await typeNumberValue(page, `1${decimal}5e-6`);
-                await page.waitForChanges();
-                expect(await calciteInput.getProperty("value")).toBe(`1.5e-6`);
-                expect(await input.getProperty("value")).toBe(localizeNumberString("1.5e-6", locale));
-            });
-            it(`displays correct formatted value when the value is changed programmatically for ${locale} locale`, async () => {
-                const page = await newE2EPage();
-                await page.setContent(html `<calcite-input-number lang="${locale}"></calcite-input-number><input id="external" />`);
-                await page.evaluate(() => {
-                    const input = document.getElementById("external");
-                    const calciteInput = document.querySelector("calcite-input-number");
-                    input.addEventListener("input", (event) => {
-                        const value = event.target.value;
-                        if (value.endsWith(".")) {
-                            return;
-                        }
-                        calciteInput.value = value;
-                    });
-                });
-                const assertedValue = "1234567.891011";
-                const externalInput = await page.find("#external");
-                const calciteInput = await page.find("calcite-input-number");
-                const internalLocaleInput = await page.find("calcite-input-number >>> input");
-                await externalInput.click();
-                await typeNumberValue(page, assertedValue);
-                await page.waitForChanges();
-                expect(await calciteInput.getProperty("value")).toBe(assertedValue);
-                expect(await internalLocaleInput.getProperty("value")).toBe(localizeNumberString(assertedValue, locale));
-            });
-        });
-    });
-    it(`allows negative, decimal numbers for ar locale`, async () => {
-        const value = "-0001.0001";
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number lang="ar"></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await typeNumberValue(page, value);
-        await page.waitForChanges();
-        await page.keyboard.press("Tab");
-        expect(await element.getProperty("value")).toBe("-1.0001");
-    });
-    it(`Using the select method selects all text`, async () => {
-        const value = "-98.76";
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number value="123.45"></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        // overwrite initial value by selecting and typing
-        await element.callMethod("selectText");
-        await element.callMethod("setFocus");
-        await typeNumberValue(page, value);
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe(value);
-    });
-    it(`allows clearing value`, async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number value="1"></calcite-input-number>`);
-        const input = await page.find("calcite-input-number");
-        input.setProperty("value", null);
-        await page.waitForChanges();
-        expect(await input.getProperty("value")).toBe("");
-        input.setProperty("value", undefined);
-        await page.waitForChanges();
-        expect(await input.getProperty("value")).toBe("");
-    });
-    it(`disallows setting text value`, async () => {
-        const nonNumberValue = "i am a text value";
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number value=${nonNumberValue}></calcite-input-number>`);
-        const calciteInput = await page.find("calcite-input-number");
-        const input = await page.find("calcite-input-number >>> input");
-        expect(await calciteInput.getProperty("value")).toBe("");
-        expect(await input.getProperty("value")).toBe("");
-        const numberValue = "1234";
-        calciteInput.setProperty("value", numberValue);
-        await page.waitForChanges();
-        expect(await calciteInput.getProperty("value")).toBe(numberValue);
-        expect(await input.getProperty("value")).toBe(numberValue);
-        calciteInput.setProperty("value", nonNumberValue);
-        await page.waitForChanges();
-        expect(await calciteInput.getProperty("value")).toBe(numberValue);
-        expect(await input.getProperty("value")).toBe(numberValue);
-    });
-    it(`disallows pasting just text characters with no initial value`, async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number></calcite-input-number><input id="copy" value="invalid number" />`);
-        const calciteInput = await page.find("calcite-input-number");
-        const input = await page.find("calcite-input-number >>> input");
-        const copyInput = await page.find("#copy");
-        expect(await calciteInput.getProperty("value")).toBe("");
-        expect(await input.getProperty("value")).toBe("");
-        await copyInput.focus();
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("a");
-        await page.keyboard.press("c");
-        await page.keyboard.up("Meta");
-        await calciteInput.callMethod("setFocus");
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("v");
-        await page.keyboard.up("Meta");
-        expect(await calciteInput.getProperty("value")).toBe("");
-        expect(await input.getProperty("value")).toBe("");
-    });
-    it(`disallows pasting just text characters with existing number value`, async () => {
-        const initialValue = "1234.56";
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number value="1234.56"></calcite-input-number><input id="copy" value="invalid number" />`);
-        const calciteInput = await page.find("calcite-input-number");
-        const input = await page.find("calcite-input-number >>> input");
-        const copyInput = await page.find("#copy");
-        expect(await calciteInput.getProperty("value")).toBe(initialValue);
-        expect(await input.getProperty("value")).toBe(initialValue);
-        await copyInput.focus();
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("a");
-        await page.keyboard.press("c");
-        await page.keyboard.up("Meta");
-        await calciteInput.callMethod("setFocus");
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("v");
-        await page.keyboard.up("Meta");
-        expect(await calciteInput.getProperty("value")).toBe(initialValue);
-        expect(await input.getProperty("value")).toBe(initialValue);
-    });
-    it(`disallows pasting just text characters with no initial value with group separator`, async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number group-separator></calcite-input-number><input id="copy" value="invalid number" />`);
-        const calciteInput = await page.find("calcite-input-number");
-        const input = await page.find("calcite-input-number >>> input");
-        const copyInput = await page.find("#copy");
-        expect(await calciteInput.getProperty("value")).toBe("");
-        expect(await input.getProperty("value")).toBe("");
-        await copyInput.focus();
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("a");
-        await page.keyboard.press("c");
-        await page.keyboard.up("Meta");
-        await calciteInput.callMethod("setFocus");
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("v");
-        await page.keyboard.up("Meta");
-        expect(await calciteInput.getProperty("value")).toBe("");
-        expect(await input.getProperty("value")).toBe("");
-    });
-    it(`disallows pasting just text characters with existing number value with group separator`, async () => {
-        const initialValue = "1234.56";
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number value="1234.56" group-separator></calcite-input-number
-        ><input id="copy" value="invalid number" />`);
-        const calciteInput = await page.find("calcite-input-number");
-        const input = await page.find("calcite-input-number >>> input");
-        const copyInput = await page.find("#copy");
-        expect(await calciteInput.getProperty("value")).toBe(initialValue);
-        expect(await input.getProperty("value")).toBe(localizeNumberString(initialValue, "en-US", true));
-        await copyInput.focus();
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("a");
-        await page.keyboard.press("c");
-        await page.keyboard.up("Meta");
-        await calciteInput.callMethod("setFocus");
-        await page.keyboard.down("Meta");
-        await page.keyboard.press("v");
-        await page.keyboard.up("Meta");
-        expect(await calciteInput.getProperty("value")).toBe(initialValue);
-        expect(await input.getProperty("value")).toBe(localizeNumberString(initialValue, "en-US", true));
-    });
-    it("cannot be modified when readOnly is true", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number read-only value="123" clearable></calcite-input-number>`);
-        const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-        const element = await page.find("calcite-input-number");
-        expect(await element.getProperty("value")).toBe("123");
-        await element.callMethod("setFocus");
-        await page.keyboard.press("4");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("123");
-        await page.keyboard.press("Escape");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("123");
-        expect(calciteInputNumberInput).toHaveReceivedEventTimes(0);
-    });
-    it("number cannot be modified when readOnly is true", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number read-only value="5"></calcite-input-number>`);
-        const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-        const element = await page.find("calcite-input-number");
-        expect(await element.getProperty("value")).toBe("5");
-        await element.callMethod("setFocus");
-        await page.keyboard.press("ArrowUp");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("5");
-        await page.keyboard.press("Escape");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("5");
-        expect(calciteInputNumberInput).toHaveReceivedEventTimes(0);
-    });
-    it("sets internals to readOnly or disabled when readOnly is true", async () => {
-        const page = await newE2EPage();
-        await page.setContent(html `<calcite-input-number read-only></calcite-input-number>`);
-        const inputs = await page.findAll("calcite-input-number >>> input");
-        for (const input of inputs) {
-            expect(await input.getProperty("readOnly")).toBe(true);
-        }
-        const buttons = await page.findAll("calcite-input-number button");
-        for (const button of buttons) {
-            expect(await button.getProperty("disabled")).toBe(true);
-        }
-    });
-    it("input event fires when number ends with a decimal", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`
-    <calcite-input-number value="1.2"></calcite-input-number>
-    `);
-        const calciteInputNumberInput = await page.spyOnEvent("calciteInputNumberInput");
-        const element = await page.find("calcite-input-number");
-        expect(await element.getProperty("value")).toBe("1.2");
-        await element.callMethod("setFocus");
-        await page.keyboard.press("Backspace");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("1");
-        expect(calciteInputNumberInput).toHaveReceivedEventTimes(1);
-    });
-    it("sanitize leading zeros from value", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`
-    <calcite-input-number></calcite-input-number>
-    `);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await typeNumberValue(page, "0000000");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("0");
-        await typeNumberValue(page, "1");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("1");
-        await typeNumberValue(page, "0000000");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("10000000");
-    });
-    it("sanitize extra dashes from value", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-input-number></calcite-input-number>`);
-        const element = await page.find("calcite-input-number");
-        await element.callMethod("setFocus");
-        await typeNumberValue(page, "1--2---3");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("123");
-        await page.keyboard.press("ArrowLeft");
-        await page.keyboard.press("ArrowLeft");
-        await page.keyboard.press("ArrowLeft");
-        await typeNumberValue(page, "----");
-        await page.waitForChanges();
-        expect(await element.getProperty("value")).toBe("-123");
-    });
-    describe("ArrowUp/ArrowDown function of moving caret to the beginning/end of text", () => {
-        let page;
-        const determineCaretIndex = (position) => {
-            return page.evaluate((position) => {
-                const element = document.querySelector("calcite-input-number");
-                const el = element.shadowRoot.querySelector("input");
-                return el.selectionStart === (position !== undefined ? position : el.value.length);
-            }, position);
-        };
-        beforeEach(async () => {
-            page = await newE2EPage();
-        });
-        it("should not work, but increment instead", async () => {
-            await page.setContent(`<calcite-input-number></calcite-input-number>`);
-            const element = await page.find("calcite-input-number");
-            await element.callMethod("setFocus");
-            await page.keyboard.type("12345");
-            await page.waitForChanges();
-            await page.keyboard.press("ArrowUp");
-            await page.waitForChanges();
-            expect(await determineCaretIndex()).toBeTruthy();
-            expect(await element.getProperty("value")).toBe("12346");
-            await page.keyboard.press("ArrowDown");
-            await page.waitForChanges();
-            expect(await determineCaretIndex()).toBeTruthy();
-            expect(await element.getProperty("value")).toBe("12345");
-        });
-        it("does not jump to the beginning of input while incrementing on ArrowUp held down", async () => {
-            await page.setContent(html `<calcite-input-number value="0"></calcite-input-number>`);
-            let cursorHomeCount = 0;
-            await page.keyboard.down("ArrowUp");
-            await page.$eval("calcite-input-number", (element) => {
-                document.addEventListener("calciteInputNumberInput", async () => {
-                    const input = element.shadowRoot.querySelector("input");
-                    if (input.selectionStart === 0) {
-                        cursorHomeCount++;
-                    }
-                });
-            }, cursorHomeCount);
-            await page.waitForTimeout(delayFor2UpdatesInMs);
-            await page.keyboard.up("ArrowUp");
-            await page.waitForChanges();
-            expect(cursorHomeCount).toBe(0);
-        });
-    });
-    it("is form-associated", () => formAssociated("<calcite-input-number></calcite-input-number>", {
-        testValue: 5,
-        submitsOnEnter: true
-    }));
-});