@esri/calcite-components 1.0.0-next.597 → 1.0.0-next.598

package/dist/collection/components/label/label.e2e.js

@@ -1,156 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { renders, hidden } from "../../tests/commonTests";
-describe("calcite-label", () => {
-    it("renders", () => renders("calcite-label", { display: "inline" }));
-    it("renders default props when none are provided", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`
-    <calcite-label>
-    Label text
-    <calcite-input></calcite-input>
-    </calcite-label>
-    `);
-        const element = await page.find("calcite-label");
-        expect(element).toEqualAttribute("status", "idle");
-        expect(element).toEqualAttribute("layout", "default");
-    });
-    it("renders requested props when valid props are provided", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`
-    <calcite-label layout="inline-space-between">
-    Label text
-    <calcite-input></calcite-input>
-    </calcite-label>
-    `);
-        const element = await page.find("calcite-label");
-        expect(element).toEqualAttribute("layout", "inline-space-between");
-    });
-    it("honors hidden attribute", async () => hidden("calcite-label"));
-    describe("alignment prop", () => {
-        let page;
-        let element;
-        let style;
-        describe("default behavior", () => {
-            it("should render with 'start' alignment", async () => {
-                page = await newE2EPage({
-                    html: `<calcite-label>Label text
-          <calcite-input></calcite-input>
-          </calcite-label>`
-                });
-                element = await page.find("calcite-label");
-                expect(await element.getProperty("alignment")).toEqual("start");
-            });
-            describe("when in a center-aligned container", () => {
-                describe("when direction is left-to-right", () => {
-                    it("should render text left-aligned", async () => {
-                        page = await newE2EPage({
-                            html: `<div style="text-align: center;">
-              <calcite-label dir="ltr">Label text
-              <calcite-input></calcite-input>
-              </calcite-label>
-              </div>`
-                        });
-                        element = await page.find("calcite-label >>> .container");
-                        style = await element.getComputedStyle();
-                        expect(style["textAlign"]).toEqual("start");
-                    });
-                });
-                describe("when direction is right-to-left", () => {
-                    it("should render text right-aligned", async () => {
-                        page = await newE2EPage({
-                            html: `<div style="text-align: center;">
-              <calcite-label dir="rtl">Label text
-              <calcite-input></calcite-input>
-              </calcite-label>
-              </div>`
-                        });
-                        element = await page.find("calcite-label >>> .container");
-                        style = await element.getComputedStyle();
-                        expect(style["textAlign"]).toEqual("start");
-                    });
-                });
-            });
-        });
-        describe("when alignment prop is provided", () => {
-            describe("'center' alignment", () => {
-                it("should render text center-aligned", async () => {
-                    page = await newE2EPage({
-                        html: `<calcite-label alignment="center">Label text
-            <calcite-input></calcite-input>
-            </calcite-label>`
-                    });
-                    element = await page.find("calcite-label >>> .container");
-                    style = await element.getComputedStyle();
-                    expect(style["textAlign"]).toEqual("center");
-                });
-            });
-            describe("'end' alignment", () => {
-                describe("when direction is left-to-right", () => {
-                    it("should render text right-aligned", async () => {
-                        page = await newE2EPage({
-                            html: `<calcite-label alignment="end" dir="ltr">Label text
-              <calcite-input></calcite-input>
-              </calcite-label>`
-                        });
-                        element = await page.find("calcite-label >>> .container");
-                        style = await element.getComputedStyle();
-                        expect(style["textAlign"]).toEqual("end");
-                    });
-                });
-                describe("when direction is right-to-left", () => {
-                    it("should render text left-aligned", async () => {
-                        page = await newE2EPage({
-                            html: `<calcite-label alignment="end" dir="rtl">Label text
-              <calcite-input></calcite-input>
-              </calcite-label>`
-                        });
-                        element = await page.find("calcite-label >>> .container");
-                        style = await element.getComputedStyle();
-                        expect(style["textAlign"]).toEqual("end");
-                    });
-                });
-            });
-        });
-    });
-    it("does not pass id to child label element", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`
-    <calcite-label id="dont-duplicate-me" layout="inline-space-between">
-    Label text
-    <calcite-input></calcite-input>
-    </calcite-label>
-    `);
-        const element = await page.find("calcite-label");
-        const childElement = await page.find("calcite-label >>> .container");
-        expect(element).toEqualAttribute("id", "dont-duplicate-me");
-        expect(childElement).not.toHaveAttribute("id");
-        expect(element).toEqualAttribute("layout", "inline-space-between");
-    });
-    // TODO: need shadow DOM equivalent update on helper
-    it("clicking sibling label focuses input when both are inside a shadowRoot", async () => {
-        const page = await newE2EPage();
-        await page.evaluate(() => {
-            document.addEventListener("calciteInputFocus", (event) => {
-                window.eventDetail = event.detail;
-            });
-        });
-        await page.evaluate(() => {
-            class ShadowComponent extends HTMLElement {
-                constructor() {
-                    super();
-                    const shadow = this.attachShadow({ mode: "open" });
-                    shadow.innerHTML = `
-            <calcite-label for="input">Label</calcite-label>
-            <calcite-input id="input"></calcite-input>
-          `;
-                }
-            }
-            customElements.define("shadow-component", ShadowComponent);
-            const shadowComponent = document.createElement("shadow-component");
-            document.body.appendChild(shadowComponent);
-            shadowComponent.shadowRoot.querySelector("calcite-label").click();
-        });
-        const eventDetail = await page.evaluateHandle(() => window.eventDetail);
-        expect(eventDetail).toBeTruthy();
-    });
-});

package/dist/collection/components/link/link.e2e.js

@@ -1,257 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { accessible, defaults, disabled, renders, hidden } from "../../tests/commonTests";
-describe("calcite-link", () => {
-    it("renders", async () => renders("<calcite-link href='/'>link</calcite-link>", { display: "inline" }));
-    it("honors hidden attribute", async () => hidden("calcite-link"));
-    it("defaults", async () => defaults("calcite-link", [
-        {
-            propertyName: "download",
-            defaultValue: false
-        }
-    ]));
-    it("is accessible", async () => {
-        await accessible("<calcite-link href='/'>link</calcite-link>");
-        await accessible("<calcite-link>link</calcite-link>");
-        await accessible("<calcite-link icon-start='plus' icon-end='plus' href='/'>Go</calcite-link>");
-    });
-    it("can be disabled", () => disabled(`<calcite-link href='/'>link</calcite-link>`));
-    it("sets download attribute on internal anchor", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link href="file.jpg">Continue</calcite-link>`);
-        const elementAsLink = await page.find("calcite-link >>> a");
-        expect(elementAsLink).not.toBeNull();
-        expect(await elementAsLink.getProperty("download")).toBe("");
-        expect(elementAsLink).not.toHaveAttribute("download");
-        const element = await page.find("calcite-link");
-        element.setProperty("download", true);
-        await page.waitForChanges();
-        expect(await elementAsLink.getProperty("download")).toBe("");
-        expect(elementAsLink).toHaveAttribute("download");
-        expect(elementAsLink.getAttribute("download")).toBe("");
-        const newFilename = "my-cool-file.jpg";
-        element.setProperty("download", newFilename);
-        await page.waitForChanges();
-        expect(await elementAsLink.getProperty("download")).toBe(newFilename);
-        expect(elementAsLink.getAttribute("download")).toBe(newFilename);
-        element.setProperty("download", false);
-        await page.waitForChanges();
-        expect(await elementAsLink.getProperty("download")).toBe("");
-        expect(elementAsLink).not.toHaveAttribute("download");
-    });
-    it("renders as a span with default props", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link>Continue</calcite-link>`);
-        const element = await page.find("calcite-link");
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(element).not.toHaveAttribute("icon-flip-rtl");
-        expect(elementAsLink).toBeNull();
-        expect(elementAsSpan).not.toBeNull();
-        expect(iconStart).toBeNull();
-        expect(iconEnd).toBeNull();
-    });
-    it("should update childElType when href changes", async () => {
-        const page = await newE2EPage({ html: `<calcite-link>Continue</calcite-link>` });
-        const link = await page.find("calcite-link");
-        let elementAsLink;
-        let elementAsSpan;
-        elementAsSpan = await page.find("calcite-link >>> span");
-        elementAsLink = await page.find("calcite-link >>> a");
-        expect(elementAsSpan).not.toBeNull();
-        expect(elementAsLink).toBeNull();
-        link.setProperty("href", "/");
-        await page.waitForChanges();
-        elementAsSpan = await page.find("calcite-link >>> span");
-        elementAsLink = await page.find("calcite-link >>> a");
-        expect(elementAsSpan).toBeNull();
-        expect(elementAsLink).not.toBeNull();
-    });
-    it("renders as a link with default props", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link href="/">Continue</calcite-link>`);
-        const element = await page.find("calcite-link");
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(element).not.toHaveAttribute("icon-flip-rtl");
-        expect(elementAsLink).not.toBeNull();
-        expect(elementAsSpan).toBeNull();
-        expect(iconStart).toBeNull();
-        expect(iconEnd).toBeNull();
-    });
-    it("renders as a span with requested props", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link>Continue</calcite-link>`);
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(elementAsLink).toBeNull();
-        expect(elementAsSpan).not.toBeNull();
-        expect(iconStart).toBeNull();
-        expect(iconEnd).toBeNull();
-    });
-    it("renders as a link with requested props", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link href="/">Continue</calcite-link>`);
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(elementAsLink).not.toBeNull();
-        expect(elementAsSpan).toBeNull();
-        expect(iconStart).toBeNull();
-        expect(iconEnd).toBeNull();
-    });
-    it("passes attributes to rendered child link", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link rel="noopener noreferrer" target="_blank" class="mycustomclass" href="google.com">Continue</calcite-link>`);
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(elementAsLink).not.toBeNull();
-        expect(elementAsSpan).toBeNull();
-        expect(elementAsLink).not.toHaveClass("mycustomclass");
-        expect(elementAsLink).toEqualAttribute("href", "google.com");
-        expect(elementAsLink).toEqualAttribute("rel", "noopener noreferrer");
-        expect(elementAsLink).toEqualAttribute("target", "_blank");
-        expect(iconStart).toBeNull();
-        expect(iconEnd).toBeNull();
-    });
-    it("renders with an icon-start", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link icon-start='plus'>Continue</calcite-link>`);
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(elementAsLink).toBeNull();
-        expect(elementAsSpan).not.toBeNull();
-        expect(iconStart).not.toBeNull();
-        expect(iconEnd).toBeNull();
-    });
-    it("renders with an icon-end", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link icon-end='plus'>Continue</calcite-link>`);
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(elementAsLink).toBeNull();
-        expect(elementAsSpan).not.toBeNull();
-        expect(iconStart).toBeNull();
-        expect(iconEnd).not.toBeNull();
-    });
-    it("renders with an icon-start and icon-end", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-link icon-start='plus' icon-end='plus'>Continue</calcite-link>`);
-        const elementAsSpan = await page.find("calcite-link >>> span");
-        const elementAsLink = await page.find("calcite-link >>> a");
-        const iconStart = await page.find("calcite-link >>> .calcite-link--icon.icon-start");
-        const iconEnd = await page.find("calcite-link >>> .calcite-link--icon.icon-end");
-        expect(elementAsLink).toBeNull();
-        expect(elementAsSpan).not.toBeNull();
-        expect(iconStart).not.toBeNull();
-        expect(iconEnd).not.toBeNull();
-    });
-    describe("link interactivity", () => {
-        const targetPage = "#test";
-        let page;
-        let pageUrl;
-        let targetUrl;
-        beforeEach(async () => {
-            page = await newE2EPage({
-                html: `<calcite-link href="/${targetPage}">link</calcite-link>`
-            });
-            pageUrl = page.url();
-            targetUrl = `${pageUrl}${targetPage}`;
-        });
-        it("keyboard", async () => {
-            const element = await page.find("calcite-link");
-            await element.callMethod("setFocus");
-            await page.keyboard.press("Enter");
-            await page.waitForChanges();
-            expect(page.url()).toBe(targetUrl);
-        });
-        it("mouse", async () => {
-            // workaround for https://github.com/puppeteer/puppeteer/issues/2977
-            await page.$eval("calcite-link", (link) => {
-                link.shadowRoot.querySelector("a").click();
-            });
-            await page.waitForChanges();
-            expect(page.url()).toBe(targetUrl);
-        });
-        it("non user-initiated click event", async () => {
-            const link = await page.find("calcite-link");
-            const clickEvent = await link.spyOnEvent("click");
-            // helps test click behavior via HTMLElement.click()
-            await link.callMethod("click");
-            await page.waitForChanges();
-            expect(page.url()).toBe(targetUrl);
-            // make sure forwarded internal event does not propagate
-            expect(clickEvent).toHaveReceivedEventTimes(1);
-        });
-    });
-    describe("CSS properties for light/dark themes", () => {
-        const linkHtml = `
-      <h3>
-        A link <calcite-link href="#" title="in the middle with an icon" icon-start='launch'>
-        with an icon </calcite-link> in some text.
-      </h3>
-    `;
-        let page;
-        let link;
-        let linkStyles;
-        let linkUnderlineStyle;
-        it("should have defined CSS custom properties", async () => {
-            page = await newE2EPage({ html: linkHtml });
-            linkUnderlineStyle = await page.evaluate(() => {
-                link = document.querySelector("calcite-link");
-                link.style.setProperty("--calcite-link-blue-underline", "red");
-                return window.getComputedStyle(link).getPropertyValue("--calcite-link-blue-underline");
-            });
-            expect(linkUnderlineStyle).toEqual("red");
-        });
-        describe("when theme attribute is not provided", () => {
-            it("should render link background with default value tied to light theme", async () => {
-                page = await newE2EPage({ html: linkHtml });
-                link = await page.find("calcite-link >>> a");
-                linkStyles = await link.getComputedStyle();
-                linkUnderlineStyle = await linkStyles.getPropertyValue("background-image");
-                expect(linkUnderlineStyle).toEqual("linear-gradient(rgb(0, 97, 155), rgb(0, 97, 155)), linear-gradient(rgba(0, 97, 155, 0.4), rgba(0, 97, 155, 0.4))");
-            });
-        });
-        describe("when theme attribute is dark", () => {
-            it("should render link background with value tied to dark theme", async () => {
-                page = await newE2EPage({
-                    html: `<article class="calcite-theme-dark">${linkHtml}</article>`
-                });
-                link = await page.find("calcite-link >>> a");
-                linkStyles = await link.getComputedStyle();
-                linkUnderlineStyle = await linkStyles.getPropertyValue("background-image");
-                expect(linkUnderlineStyle).toEqual("linear-gradient(rgb(0, 160, 255), rgb(0, 160, 255)), linear-gradient(rgba(0, 160, 255, 0.4), rgba(0, 160, 255, 0.4))");
-            });
-        });
-        it("should allow the CSS custom property to be overridden", async () => {
-            const overrideStyle = "rgba(255, 244, 40, 0.5)";
-            page = await newE2EPage({
-                html: `
-        <style>
-          :root {
-            --calcite-link-blue-underline: ${overrideStyle};
-          }
-        </style>
-        ${linkHtml}
-        `
-            });
-            link = await page.find("calcite-link >>> a");
-            linkStyles = await link.getComputedStyle();
-            linkUnderlineStyle = await linkStyles.getPropertyValue("background-image");
-            expect(linkUnderlineStyle).toEqual(`linear-gradient(rgb(0, 97, 155), rgb(0, 97, 155)), linear-gradient(${overrideStyle}, ${overrideStyle})`);
-        });
-    });
-});

package/dist/collection/components/list/list.e2e.js

@@ -1,32 +0,0 @@
-import { accessible, hidden, renders, focusable, disabled } from "../../tests/commonTests";
-import { placeholderImage } from "../../tests/utils";
-import { html } from "../../../support/formatting";
-const placeholder = placeholderImage({
-    width: 140,
-    height: 100
-});
-describe("calcite-list", () => {
-    it("renders", async () => renders("calcite-list", { display: "block" }));
-    it("is focusable", () => focusable(html `<calcite-list>
-        <calcite-list-item label="test" description="hello world"></calcite-list-item>
-      </calcite-list>`, {
-        focusTargetSelector: "calcite-list-item"
-    }));
-    it("honors hidden attribute", async () => hidden("calcite-list"));
-    it("should be accessible", async () => {
-        await accessible(`<calcite-list>
-    <calcite-list-item label="candy" description="kingdom">
-      <calcite-action icon="banana" label="finn" slot="actions-start" />
-      <calcite-icon icon="banana" slot="content-start" />
-      <img slot="content-start" src="${placeholder}" alt="Test image" />
-      <calcite-icon icon="banana" slot="content-end" />
-      <calcite-action icon="banana" label="jake" slot="actions-end" />
-    </calcite-list-item>
-    <calcite-list-item label="test" non-interactive description="hello world"></calcite-list-item>
-    <calcite-list-item label="test" description="hello world"></calcite-list-item>
-  </calcite-list>`);
-    });
-    it("can be disabled", () => disabled(html `<calcite-list>
-        <calcite-list-item label="test" description="hello world"></calcite-list-item>
-      </calcite-list>`, { focusTarget: "child" }));
-});

package/dist/collection/components/list-item/list-item.e2e.js

@@ -1,46 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { hidden, renders, focusable, slots, disabled } from "../../tests/commonTests";
-import { defaults } from "../../tests/commonTests";
-import { CSS, SLOTS } from "./resources";
-describe("calcite-list-item", () => {
-    it("renders", async () => renders("calcite-list-item", { display: "flex" }));
-    it("is focusable", () => focusable("calcite-list-item", {
-        shadowFocusTargetSelector: `.${CSS.contentContainerButton}`
-    }));
-    it("honors hidden attribute", async () => hidden("calcite-list-item"));
-    it("has property defaults", async () => defaults("calcite-list-item", [
-        {
-            propertyName: "nonInteractive",
-            defaultValue: false
-        },
-        {
-            propertyName: "description",
-            defaultValue: undefined
-        },
-        {
-            propertyName: "disabled",
-            defaultValue: false
-        },
-        {
-            propertyName: "label",
-            defaultValue: undefined
-        }
-    ]));
-    it("has slots", () => slots("calcite-list-item", SLOTS));
-    it("can be disabled", () => disabled(`<calcite-list-item label="test"></calcite-list-item>`));
-    it("renders content node when label is provided", async () => {
-        const page = await newE2EPage({ html: `<calcite-list-item label="test"></calcite-list-item>` });
-        const contentNode = await page.find(`calcite-list-item >>> .${CSS.content}`);
-        expect(contentNode).not.toBeNull();
-    });
-    it("renders content node when description is provided", async () => {
-        const page = await newE2EPage({ html: `<calcite-list-item description="test"></calcite-list-item>` });
-        const contentNode = await page.find(`calcite-list-item >>> .${CSS.content}`);
-        expect(contentNode).not.toBeNull();
-    });
-    it("does not render content node when description and label is not provided", async () => {
-        const page = await newE2EPage({ html: `<calcite-list-item></calcite-list-item>` });
-        const contentNode = await page.find(`calcite-list-item >>> .${CSS.content}`);
-        expect(contentNode).toBeNull();
-    });
-});

package/dist/collection/components/list-item-group/list-item-group.e2e.js

@@ -1,16 +0,0 @@
-import { hidden, renders } from "../../tests/commonTests";
-import { defaults } from "../../tests/commonTests";
-describe("calcite-list-item-group", () => {
-    it("renders", async () => renders("calcite-list-item-group", { display: "flex" }));
-    it("honors hidden attribute", async () => hidden("calcite-list-item-group"));
-    it("has property defaults", async () => defaults("calcite-list-item-group", [
-        {
-            propertyName: "heading",
-            defaultValue: undefined
-        },
-        {
-            propertyName: "headingLevel",
-            defaultValue: undefined
-        }
-    ]));
-});

package/dist/collection/components/loader/loader.e2e.js

@@ -1,49 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { renders, hidden } from "../../tests/commonTests";
-describe("calcite-loader", () => {
-    it("renders", async () => {
-        await renders("calcite-loader", { display: "none", visible: false });
-        await renders(`<calcite-loader active></calcite-loader>`, { display: "flex", visible: true });
-    });
-    it("honors hidden attribute", async () => hidden("calcite-loader"));
-    it("displays label from text prop", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-loader active text="testing"></calcite-loader>`);
-        const elm = await page.find("calcite-loader >>> .loader__text");
-        expect(elm).toEqualText("testing");
-    });
-    it("sets aria attributes properly for indeterminate loader", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-loader></calcite-loader>`);
-        const loader = await page.find("calcite-loader");
-        expect(loader).toEqualAttribute("role", "progressbar");
-        expect(loader).not.toHaveAttribute("aria-valuemin");
-        expect(loader).not.toHaveAttribute("aria-valuemax");
-        expect(loader).not.toHaveAttribute("aria-valuenow");
-    });
-    it("sets aria attributes properly for determinate loader", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-loader type="determinate"></calcite-loader>`);
-        const loader = await page.find("calcite-loader");
-        expect(loader).toHaveAttribute("aria-valuenow");
-        expect(loader).toEqualAttribute("aria-valuenow", 0);
-        expect(loader).toEqualAttribute("aria-valuemin", 0);
-        expect(loader).toEqualAttribute("aria-valuemax", 100);
-        loader.setProperty("value", 24);
-        await page.waitForChanges();
-        expect(loader).toEqualAttribute("aria-valuenow", 24);
-    });
-    it("displays inline with text from inline prop", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-loader active inline></calcite-loader>`);
-        const rect = await page.find("calcite-loader >>> circle");
-        expect(rect).toEqualAttribute("r", "7.2");
-    });
-    it("sets a default id when none is provided", async () => {
-        const page = await newE2EPage();
-        await page.setContent(`<calcite-loader active></calcite-loader>`);
-        const loader = await page.find("calcite-loader");
-        expect(loader).toHaveAttribute("id");
-        expect(loader.getAttribute("id").length).toEqual(36);
-    });
-});