@ukic/web-components 3.0.0-alpha.9 → 3.1.0

package/dist/collection/components/ic-alert/test/basic/ic-alert.spec.js

@@ -1,329 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { Alert } from "../../ic-alert";
-import { mockHasDynamicChildSlots, mockMutationObserverImplementation, mockRenderDynamicChildSlots, } from "../../../../testspec.setup";
-describe("ic-alert component", () => {
-    afterAll(() => {
-        jest.restoreAllMocks();
-    });
-    afterEach(() => {
-        jest.clearAllMocks();
-    });
-    it("should render with a heading when supplied", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert heading="Test heading"></ic-alert>`,
-        });
-        expect(page.root).toEqualHtml(`
-        <ic-alert class="dark" heading="Test heading" role="alert">
-            <mock:shadow-root>
-                <div class="container container-neutral">
-                    <div class="alert-icon-container">
-                        <div class="divider divider-neutral"></div>
-                        <span class="alert-icon icon-neutral svg-container">
-                            svg
-                        </span>
-                    </div>
-                    <div class="alert-content">
-                        <div class="alert-message">
-                            <ic-typography class="alert-title" variant="subtitle-large">
-                                <p>
-                                    Test heading
-                                </p>
-                            </ic-typography>
-                            <slot name="message">
-                                <ic-typography variant="body"></ic-typography>
-                            </slot>
-                        </div>
-                    </div>
-                    <div class="dismiss-icon-container">
-                    </div>
-                </div>
-            </mock:shadow-root>
-        </ic-alert>`);
-    });
-    it("should render with a message when supplied", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert message="Test message"></ic-alert>`,
-        });
-        expect(page.root).toEqualHtml(`
-        <ic-alert class="dark" message="Test message" role="alert">
-            <mock:shadow-root>
-                <div class="container container-neutral">
-                    <div class="alert-icon-container">
-                    <div class="divider divider-neutral"></div>
-                        <span class="alert-icon icon-neutral svg-container">
-                            svg
-                        </span>
-                    </div>
-                    <div class="alert-content">
-                        <div class="alert-message">
-                            <slot name="message">
-                                <ic-typography variant="body">
-                                    Test message
-                                </ic-typography>
-                            </slot>
-                        </div>
-                    </div>
-                    <div class="dismiss-icon-container">
-                    </div>
-                </div>
-            </mock:shadow-root>
-        </ic-alert>`);
-    });
-    it("should render an action in the correct position when supplied", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert message="This has an action"><button slot="action"></button></ic-alert>`,
-        });
-        expect(page.root).toEqualHtml(`
-        <ic-alert class="dark" message="This has an action" role="alert">
-            <mock:shadow-root>
-                <div class="container container-neutral">
-                    <div class="alert-icon-container">
-                        <div class="divider divider-neutral"></div>
-                        <span class="alert-icon icon-neutral svg-container">
-                            svg
-                        </span>
-                    </div>
-                    <div class="alert-content">
-                        <div class="alert-message">
-                            <slot name="message">
-                                <ic-typography variant="body">
-                                    This has an action
-                                </ic-typography>
-                            </slot>
-                        </div>
-                        <div class="alert-action-container">
-                            <slot name="action"></slot>
-                        </div>
-                    </div>
-                    <div class="dismiss-icon-container">
-                    </div>
-                </div>
-            </mock:shadow-root>
-            <button slot="action"></button>
-        </ic-alert>`);
-    });
-    it("should render with a dismiss icon when the prop is applied", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert message="This is dismissible" dismissible=true></ic-alert>`,
-        });
-        expect(page.root).toEqualHtml(`
-            <ic-alert class="dark" message="This is dismissible" dismissible=true role="alert">
-                <mock:shadow-root>
-                    <div class="container container-neutral">
-                        <div class="alert-icon-container">
-                            <div class="divider divider-neutral"></div>
-                            <span class="alert-icon icon-neutral svg-container">
-                                svg
-                            </span>
-                        </div>
-                        <div class="alert-content">
-                            <div class="alert-message">
-                                <slot name="message">
-                                    <ic-typography variant="body">
-                                        This is dismissible
-                                    </ic-typography>
-                                </slot>
-                            </div>
-                        </div>
-                        <div class="dismiss-icon-container">
-                            <ic-button class="dismiss-icon svg-container" theme="dark" title="Dismiss" variant="icon">
-                                svg
-                            </ic-button>
-                        </div>
-                    </div>
-                </mock:shadow-root>
-            </ic-alert>`);
-    });
-    it("should render an element in the message slot", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert heading="Using custom message"><ic-typography variant="h1" slot="message">Custom h1 message</ic-typography></ic-alert>`,
-        });
-        expect(page.root).toEqualHtml(`
-        <ic-alert class="dark" heading="Using custom message" role="alert">
-            <mock:shadow-root>
-                <div class="container container-neutral">
-                    <div class="alert-icon-container">
-                        <div class="divider divider-neutral"></div>
-                            <span class="alert-icon icon-neutral svg-container">
-                                svg
-                            </span>
-                        </div>
-                    <div class="alert-content">
-                        <div class="alert-message">
-                            <ic-typography class="alert-title" variant="subtitle-large">
-                                <p>
-                                    Using custom message
-                                </p>
-                            </ic-typography>
-                            <slot name="message">
-                                <ic-typography variant="body"></ic-typography>
-                            </slot>
-                        </div>
-                    </div>
-                    <div class="dismiss-icon-container"></div>
-                </div>
-            </mock:shadow-root>
-            <ic-typography variant="h1" slot="message">Custom h1 message</ic-typography>
-        </ic-alert>`);
-    });
-    it("should render an icon in the neutral-icon slot", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `
-        <ic-alert heading="Using custom icon" message="This has a slotted icon">
-          <svg slot="neutral-icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000">
-          <path d="M0 0h24v24H0V0z" fill="none" />
-          <path d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"/>
-          </svg>
-        </ic-alert>
-        `,
-        });
-        expect(page.root).toEqualHtml(`
-        <ic-alert class="dark" heading="Using custom icon" message="This has a slotted icon" role="alert">
-            <mock:shadow-root>
-                <div class="container container-neutral">
-                    <div class="alert-icon-container">
-                        <div class="divider divider-neutral"></div>
-                        <div class="alert-icon icon-neutral svg-container">
-                        <slot name="neutral-icon"></slot>
-                    </div>
-                </div>
-                <div class="alert-content">
-                    <div class="alert-message">
-                    <ic-typography class="alert-title" variant="subtitle-large">
-                    <p>
-                        Using custom icon
-                    </p>
-                    </ic-typography>
-                <slot name="message">
-                <ic-typography variant="body">
-                  This has a slotted icon
-                </ic-typography>
-              </slot>
-            </div>
-          </div>
-          <div class="dismiss-icon-container"></div>
-        </div>
-      </mock:shadow-root>
-      <svg fill="#000000" height="24px" slot="neutral-icon" viewBox="0 0 24 24" width="24px" xmlns="http://www.w3.org/2000/svg">
-        <path d="M0 0h24v24H0V0z" fill="none"></path>
-        <path d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"></path>
-      </svg>
-    </ic-alert>`);
-    });
-    it("should render with no icon when the show-default-icon prop is set to false", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert heading="No icon" message="This alert has no icon" show-defaul-icon=false></ic-alert>`,
-        });
-        expect(page.root).toEqualHtml(`
-        <ic-alert class="dark" heading="No icon" message="This alert has no icon" role="alert" show-defaul-icon="false">
-        <mock:shadow-root>
-            <div class="container container-neutral">
-            <div class="alert-icon-container">
-                <div class="divider divider-neutral"></div>
-                <span class="alert-icon icon-neutral svg-container">
-                svg
-                </span>
-            </div>
-            <div class="alert-content">
-                <div class="alert-message">
-                <ic-typography class="alert-title" variant="subtitle-large">
-                    <p>
-                    No icon
-                    </p>
-                </ic-typography>
-                <slot name="message">
-                    <ic-typography variant="body">
-                    This alert has no icon
-                    </ic-typography>
-                </slot>
-                </div>
-            </div>
-            <div class="dismiss-icon-container"></div>
-            </div>
-        </mock:shadow-root>
-        </ic-alert>`);
-    });
-    it("should render default icon of success variant when the show-default-icon prop is set to false", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert heading="Success" message="This alert has the default success icon" variant="success" show-default-icon="false"></ic-alert>`,
-        });
-        expect(page.root).toEqualHtml(`
-        <ic-alert class="dark" heading="Success" message="This alert has the default success icon" role="alert" show-default-icon="false" variant="success">
-        <mock:shadow-root>
-            <div class="container container-success">
-            <div class="alert-icon-container">
-                <div class="divider divider-success"></div>
-                <span class="alert-icon icon-success svg-container">
-                svg
-                </span>
-            </div>
-            <div class="alert-content">
-                <div class="alert-message">
-                <ic-typography class="alert-title" variant="subtitle-large">
-                    <p>
-                    Success
-                    </p>
-                </ic-typography>
-                <slot name="message">
-                    <ic-typography variant="body">
-                    This alert has the default success icon
-                    </ic-typography>
-                </slot>
-                </div>
-            </div>
-            <div class="dismiss-icon-container"></div>
-            </div>
-        </mock:shadow-root>
-        </ic-alert>
-        `);
-    });
-    it("should close on dismiss icon click", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert message="This is dismissible" dismissible=true></ic-alert>`,
-        });
-        let alert = await page.root.shadowRoot.querySelector("div.container-neutral");
-        const dismissButton = await page.root.shadowRoot.querySelector("ic-button");
-        expect(alert).not.toBeNull();
-        expect(dismissButton).not.toBeNull();
-        await dismissButton.click();
-        await page.waitForChanges();
-        alert = await page.root.shadowRoot.querySelector("div.container-neutral");
-        expect(alert).toBeNull();
-    });
-    it("should test rendering an action after initial render", async () => {
-        const page = await newSpecPage({
-            components: [Alert],
-            html: `<ic-alert heading="Test heading"></ic-alert>`,
-        });
-        const component = page.rootInstance;
-        const host = page.root;
-        const observerInstance = mockMutationObserverImplementation.mock.results[0].value;
-        const action = document.createElement("button");
-        action.setAttribute("slot", "action");
-        observerInstance.observe(host, { childList: true });
-        host.appendChild(action);
-        const mockMutationRecord = [
-            {
-                addedNodes: [action],
-                removedNodes: [],
-                target: host,
-            },
-        ];
-        observerInstance.trigger(mockMutationRecord);
-        await page.waitForChanges();
-        expect(mockRenderDynamicChildSlots).toHaveBeenCalledTimes(1);
-        expect(mockRenderDynamicChildSlots).toHaveBeenCalledWith(mockMutationRecord, "action", component);
-        expect(mockHasDynamicChildSlots).toHaveBeenCalledTimes(1);
-        expect(page.root).toMatchSnapshot();
-    });
-});
-//# sourceMappingURL=ic-alert.spec.js.map

package/dist/collection/components/ic-alert/test/basic/ic-alert.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ic-alert.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-alert/test/basic/ic-alert.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { Alert } from \"../../ic-alert\";\nimport {\n  mockHasDynamicChildSlots,\n  mockMutationObserverImplementation,\n  MockMutationRecord,\n  mockRenderDynamicChildSlots,\n} from \"../../../../testspec.setup\";\n\ndescribe(\"ic-alert component\", () => {\n  afterAll(() => {\n    jest.restoreAllMocks();\n  });\n\n  afterEach(() => {\n    jest.clearAllMocks();\n  });\n\n  it(\"should render with a heading when supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert heading=\"Test heading\"></ic-alert>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n        <ic-alert class=\"dark\" heading=\"Test heading\" role=\"alert\">\n            <mock:shadow-root>\n                <div class=\"container container-neutral\">\n                    <div class=\"alert-icon-container\">\n                        <div class=\"divider divider-neutral\"></div>\n                        <span class=\"alert-icon icon-neutral svg-container\">\n                            svg\n                        </span>\n                    </div>\n                    <div class=\"alert-content\">\n                        <div class=\"alert-message\">\n                            <ic-typography class=\"alert-title\" variant=\"subtitle-large\">\n                                <p>\n                                    Test heading\n                                </p>\n                            </ic-typography>\n                            <slot name=\"message\">\n                                <ic-typography variant=\"body\"></ic-typography>\n                            </slot>\n                        </div>\n                    </div>\n                    <div class=\"dismiss-icon-container\">\n                    </div>\n                </div>\n            </mock:shadow-root>\n        </ic-alert>`);\n  });\n\n  it(\"should render with a message when supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert message=\"Test message\"></ic-alert>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n        <ic-alert class=\"dark\" message=\"Test message\" role=\"alert\">\n            <mock:shadow-root>\n                <div class=\"container container-neutral\">\n                    <div class=\"alert-icon-container\">\n                    <div class=\"divider divider-neutral\"></div>\n                        <span class=\"alert-icon icon-neutral svg-container\">\n                            svg\n                        </span>\n                    </div>\n                    <div class=\"alert-content\">\n                        <div class=\"alert-message\">\n                            <slot name=\"message\">\n                                <ic-typography variant=\"body\">\n                                    Test message\n                                </ic-typography>\n                            </slot>\n                        </div>\n                    </div>\n                    <div class=\"dismiss-icon-container\">\n                    </div>\n                </div>\n            </mock:shadow-root>\n        </ic-alert>`);\n  });\n\n  it(\"should render an action in the correct position when supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert message=\"This has an action\"><button slot=\"action\"></button></ic-alert>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n        <ic-alert class=\"dark\" message=\"This has an action\" role=\"alert\">\n            <mock:shadow-root>\n                <div class=\"container container-neutral\">\n                    <div class=\"alert-icon-container\">\n                        <div class=\"divider divider-neutral\"></div>\n                        <span class=\"alert-icon icon-neutral svg-container\">\n                            svg\n                        </span>\n                    </div>\n                    <div class=\"alert-content\">\n                        <div class=\"alert-message\">\n                            <slot name=\"message\">\n                                <ic-typography variant=\"body\">\n                                    This has an action\n                                </ic-typography>\n                            </slot>\n                        </div>\n                        <div class=\"alert-action-container\">\n                            <slot name=\"action\"></slot>\n                        </div>\n                    </div>\n                    <div class=\"dismiss-icon-container\">\n                    </div>\n                </div>\n            </mock:shadow-root>\n            <button slot=\"action\"></button>\n        </ic-alert>`);\n  });\n\n  it(\"should render with a dismiss icon when the prop is applied\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert message=\"This is dismissible\" dismissible=true></ic-alert>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n            <ic-alert class=\"dark\" message=\"This is dismissible\" dismissible=true role=\"alert\">\n                <mock:shadow-root>\n                    <div class=\"container container-neutral\">\n                        <div class=\"alert-icon-container\">\n                            <div class=\"divider divider-neutral\"></div>\n                            <span class=\"alert-icon icon-neutral svg-container\">\n                                svg\n                            </span>\n                        </div>\n                        <div class=\"alert-content\">\n                            <div class=\"alert-message\">\n                                <slot name=\"message\">\n                                    <ic-typography variant=\"body\">\n                                        This is dismissible\n                                    </ic-typography>\n                                </slot>\n                            </div>\n                        </div>\n                        <div class=\"dismiss-icon-container\">\n                            <ic-button class=\"dismiss-icon svg-container\" theme=\"dark\" title=\"Dismiss\" variant=\"icon\">\n                                svg\n                            </ic-button>\n                        </div>\n                    </div>\n                </mock:shadow-root>\n            </ic-alert>`);\n  });\n\n  it(\"should render an element in the message slot\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert heading=\"Using custom message\"><ic-typography variant=\"h1\" slot=\"message\">Custom h1 message</ic-typography></ic-alert>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n        <ic-alert class=\"dark\" heading=\"Using custom message\" role=\"alert\">\n            <mock:shadow-root>\n                <div class=\"container container-neutral\">\n                    <div class=\"alert-icon-container\">\n                        <div class=\"divider divider-neutral\"></div>\n                            <span class=\"alert-icon icon-neutral svg-container\">\n                                svg\n                            </span>\n                        </div>\n                    <div class=\"alert-content\">\n                        <div class=\"alert-message\">\n                            <ic-typography class=\"alert-title\" variant=\"subtitle-large\">\n                                <p>\n                                    Using custom message\n                                </p>\n                            </ic-typography>\n                            <slot name=\"message\">\n                                <ic-typography variant=\"body\"></ic-typography>\n                            </slot>\n                        </div>\n                    </div>\n                    <div class=\"dismiss-icon-container\"></div>\n                </div>\n            </mock:shadow-root>\n            <ic-typography variant=\"h1\" slot=\"message\">Custom h1 message</ic-typography>\n        </ic-alert>`);\n  });\n\n  it(\"should render an icon in the neutral-icon slot\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `\n        <ic-alert heading=\"Using custom icon\" message=\"This has a slotted icon\">\n          <svg slot=\"neutral-icon\" xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\">\n          <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n          <path d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"/>\n          </svg>\n        </ic-alert>\n        `,\n    });\n\n    expect(page.root).toEqualHtml(`\n        <ic-alert class=\"dark\" heading=\"Using custom icon\" message=\"This has a slotted icon\" role=\"alert\">\n            <mock:shadow-root>\n                <div class=\"container container-neutral\">\n                    <div class=\"alert-icon-container\">\n                        <div class=\"divider divider-neutral\"></div>\n                        <div class=\"alert-icon icon-neutral svg-container\">\n                        <slot name=\"neutral-icon\"></slot>\n                    </div>\n                </div>\n                <div class=\"alert-content\">\n                    <div class=\"alert-message\">\n                    <ic-typography class=\"alert-title\" variant=\"subtitle-large\">\n                    <p>\n                        Using custom icon\n                    </p>\n                    </ic-typography>\n                <slot name=\"message\">\n                <ic-typography variant=\"body\">\n                  This has a slotted icon\n                </ic-typography>\n              </slot>\n            </div>\n          </div>\n          <div class=\"dismiss-icon-container\"></div>\n        </div>\n      </mock:shadow-root>\n      <svg fill=\"#000000\" height=\"24px\" slot=\"neutral-icon\" viewBox=\"0 0 24 24\" width=\"24px\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M0 0h24v24H0V0z\" fill=\"none\"></path>\n        <path d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"></path>\n      </svg>\n    </ic-alert>`);\n  });\n\n  it(\"should render with no icon when the show-default-icon prop is set to false\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert heading=\"No icon\" message=\"This alert has no icon\" show-defaul-icon=false></ic-alert>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n        <ic-alert class=\"dark\" heading=\"No icon\" message=\"This alert has no icon\" role=\"alert\" show-defaul-icon=\"false\">\n        <mock:shadow-root>\n            <div class=\"container container-neutral\">\n            <div class=\"alert-icon-container\">\n                <div class=\"divider divider-neutral\"></div>\n                <span class=\"alert-icon icon-neutral svg-container\">\n                svg\n                </span>\n            </div>\n            <div class=\"alert-content\">\n                <div class=\"alert-message\">\n                <ic-typography class=\"alert-title\" variant=\"subtitle-large\">\n                    <p>\n                    No icon\n                    </p>\n                </ic-typography>\n                <slot name=\"message\">\n                    <ic-typography variant=\"body\">\n                    This alert has no icon\n                    </ic-typography>\n                </slot>\n                </div>\n            </div>\n            <div class=\"dismiss-icon-container\"></div>\n            </div>\n        </mock:shadow-root>\n        </ic-alert>`);\n  });\n\n  it(\"should render default icon of success variant when the show-default-icon prop is set to false\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert heading=\"Success\" message=\"This alert has the default success icon\" variant=\"success\" show-default-icon=\"false\"></ic-alert>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n        <ic-alert class=\"dark\" heading=\"Success\" message=\"This alert has the default success icon\" role=\"alert\" show-default-icon=\"false\" variant=\"success\">\n        <mock:shadow-root>\n            <div class=\"container container-success\">\n            <div class=\"alert-icon-container\">\n                <div class=\"divider divider-success\"></div>\n                <span class=\"alert-icon icon-success svg-container\">\n                svg\n                </span>\n            </div>\n            <div class=\"alert-content\">\n                <div class=\"alert-message\">\n                <ic-typography class=\"alert-title\" variant=\"subtitle-large\">\n                    <p>\n                    Success\n                    </p>\n                </ic-typography>\n                <slot name=\"message\">\n                    <ic-typography variant=\"body\">\n                    This alert has the default success icon\n                    </ic-typography>\n                </slot>\n                </div>\n            </div>\n            <div class=\"dismiss-icon-container\"></div>\n            </div>\n        </mock:shadow-root>\n        </ic-alert>\n        `);\n  });\n\n  it(\"should close on dismiss icon click\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert message=\"This is dismissible\" dismissible=true></ic-alert>`,\n    });\n\n    let alert = await page.root.shadowRoot.querySelector(\n      \"div.container-neutral\"\n    );\n    const dismissButton = await page.root.shadowRoot.querySelector(\"ic-button\");\n\n    expect(alert).not.toBeNull();\n    expect(dismissButton).not.toBeNull();\n\n    await dismissButton.click();\n\n    await page.waitForChanges();\n    alert = await page.root.shadowRoot.querySelector(\"div.container-neutral\");\n\n    expect(alert).toBeNull();\n  });\n\n  it(\"should test rendering an action after initial render\", async () => {\n    const page = await newSpecPage({\n      components: [Alert],\n      html: `<ic-alert heading=\"Test heading\"></ic-alert>`,\n    });\n\n    const component = page.rootInstance;\n    const host = page.root;\n\n    const observerInstance =\n      mockMutationObserverImplementation.mock.results[0].value;\n\n    const action = document.createElement(\"button\");\n    action.setAttribute(\"slot\", \"action\");\n\n    observerInstance.observe(host, { childList: true });\n\n    host.appendChild(action);\n\n    const mockMutationRecord: MockMutationRecord[] = [\n      {\n        addedNodes: [action],\n        removedNodes: [],\n        target: host,\n      },\n    ];\n\n    observerInstance.trigger(mockMutationRecord);\n\n    await page.waitForChanges();\n\n    expect(mockRenderDynamicChildSlots).toHaveBeenCalledTimes(1);\n    expect(mockRenderDynamicChildSlots).toHaveBeenCalledWith(\n      mockMutationRecord,\n      \"action\",\n      component\n    );\n\n    expect(mockHasDynamicChildSlots).toHaveBeenCalledTimes(1);\n\n    expect(page.root).toMatchSnapshot();\n  });\n});\n"]}

package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.spec.js

@@ -1,145 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { ClassificationBanner } from "../../../ic-classification-banner/ic-classification-banner";
-import { Footer } from "../../../ic-footer/ic-footer";
-import { BackToTop } from "../../ic-back-to-top";
-import { Button } from "../../../ic-button/ic-button";
-beforeAll(() => {
-    // IntersectionObserver isn't available in test environment
-    const mockIntersectionObserver = jest.fn();
-    mockIntersectionObserver.mockReturnValue({
-        observe: jest.fn().mockReturnValue(null),
-        unobserve: jest.fn().mockReturnValue(null),
-        disconnect: jest.fn().mockReturnValue(null),
-    });
-    Object.defineProperty(global, "IntersectionObserver", {
-        value: mockIntersectionObserver,
-    });
-});
-describe("ic-back-to-top", () => {
-    it("should render", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop, Button],
-            html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
-        });
-        expect(page.root).toMatchSnapshot("should render");
-    });
-    it("should render with light theme", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop, Button],
-            html: `<div id="topEl"><ic-back-to-top target="topEl" theme="light"></ic-back-to-top></div>`,
-        });
-        expect(page.root).toMatchSnapshot("should render with light theme");
-    });
-    it("should render with dark theme", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop, Button],
-            html: `<div id="topEl"><ic-back-to-top target="topEl" theme="dark"></ic-back-to-top></div>`,
-        });
-        expect(page.root).toMatchSnapshot("should render with dark theme");
-    });
-    it("should render with footer", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop, Button, Footer],
-            html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div><ic-footer></ic-footer>`,
-        });
-        expect(page.body).toMatchSnapshot("should render with footer");
-    });
-    it("should render with no targetId set", async () => {
-        jest.spyOn(console, "error").mockImplementation(jest.fn());
-        const page = await newSpecPage({
-            components: [BackToTop, Button],
-            html: `<ic-back-to-top></ic-back-to-top>`,
-        });
-        expect(page.root).toMatchSnapshot("should render with no targetId set");
-    });
-    it("should render when target starts with #", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop, Button],
-            html: `<div id="topEl"><ic-back-to-top target="#topEl"></ic-back-to-top></div>`,
-        });
-        expect(page.root).toMatchSnapshot("should render when target starts with #");
-    });
-    it("should offset due to classification banner", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop, ClassificationBanner],
-            html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top><ic-classification-banner></ic-classification-banner></div>`,
-        });
-        expect(page.rootInstance.bannerOffset).toBe(true);
-    });
-    it("should scroll to 0,0 if target is null", async () => {
-        jest.spyOn(console, "error").mockImplementation(jest.fn());
-        const page = await newSpecPage({
-            components: [BackToTop],
-            html: `<div id="topEl"><ic-back-to-top></ic-back-to-top></div>`,
-        });
-        expect(page.rootInstance.isTargetElNull).toBe(true);
-        page.root.shadowRoot.querySelector("ic-button").click();
-        expect(page.win.screenX).toBe(0);
-        expect(page.win.screenY).toBe(0);
-    });
-    it("should scroll targetEl into view", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop],
-            html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
-        });
-        page.root.shadowRoot.querySelector("ic-button").click();
-        expect(page.rootInstance.targetElVisible).toBe(true);
-    });
-    it("should return null targetElement when there's no target matching that given in back to top", async () => {
-        jest.spyOn(console, "error").mockImplementation(jest.fn());
-        const page = await newSpecPage({
-            components: [BackToTop],
-            html: `<div><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
-        });
-        const findTarget = page.rootInstance.findTargetEl("topEl");
-        expect(findTarget).toBeNull();
-    });
-    it("should stop observing observedEl when topObserver exists", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop],
-            html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
-        });
-        page.rootInstance.watchPropHandler(undefined, "topEl");
-        page.rootInstance.createTopObserver("topEl");
-        expect(page.rootInstance.topObserver).not.toBeNull();
-    });
-    it("should set footerVisible", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop],
-            html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
-        });
-        page.rootInstance.footerObserverCallback([{ isIntersecting: true }]);
-        //value is false as scrollY is always 0
-        expect(page.rootInstance.footerVisible).toBe(false);
-        page.rootInstance.footerObserverCallback([{ isIntersecting: false }]);
-        expect(page.rootInstance.footerVisible).toBe(false);
-    });
-    it("should set targetElVisible", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop],
-            html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
-        });
-        page.rootInstance.targetElObserverCallback([{ isIntersecting: true }]);
-        expect(page.rootInstance.targetElVisible).toBe(true);
-        page.rootInstance.targetElObserverCallback([{ isIntersecting: false }]);
-        expect(page.rootInstance.targetElVisible).toBe(false);
-    });
-    it("should test update of target from undefined to value", async () => {
-        jest.spyOn(console, "error").mockImplementation(jest.fn());
-        const page = await newSpecPage({
-            components: [BackToTop],
-            html: `<div id="topEl"><ic-back-to-top></ic-back-to-top></div>`,
-        });
-        page.root.target = "topEl";
-        await page.waitForChanges();
-        expect(page.rootInstance.target).toBe("topEl");
-    });
-    it("should render with an icon only", async () => {
-        const page = await newSpecPage({
-            components: [BackToTop, Button],
-            html: `<div id="topEl"><ic-back-to-top target="topEl" variant="icon"></ic-back-to-top></div>`,
-        });
-        expect(page.root).toMatchSnapshot("should render with an icon only");
-    });
-});
-//# sourceMappingURL=ic-back-to-top.spec.js.map

package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ic-back-to-top.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-back-to-top/test/basic/ic-back-to-top.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { ClassificationBanner } from \"../../../ic-classification-banner/ic-classification-banner\";\nimport { Footer } from \"../../../ic-footer/ic-footer\";\nimport { BackToTop } from \"../../ic-back-to-top\";\nimport { Button } from \"../../../ic-button/ic-button\";\n\nbeforeAll(() => {\n  // IntersectionObserver isn't available in test environment\n  const mockIntersectionObserver = jest.fn();\n  mockIntersectionObserver.mockReturnValue({\n    observe: jest.fn().mockReturnValue(null),\n    unobserve: jest.fn().mockReturnValue(null),\n    disconnect: jest.fn().mockReturnValue(null),\n  });\n\n  Object.defineProperty(global, \"IntersectionObserver\", {\n    value: mockIntersectionObserver,\n  });\n});\n\ndescribe(\"ic-back-to-top\", () => {\n  it(\"should render\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, Button],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render\");\n  });\n\n  it(\"should render with light theme\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, Button],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\" theme=\"light\"></ic-back-to-top></div>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with light theme\");\n  });\n\n  it(\"should render with dark theme\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, Button],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\" theme=\"dark\"></ic-back-to-top></div>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with dark theme\");\n  });\n\n  it(\"should render with footer\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, Button, Footer],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div><ic-footer></ic-footer>`,\n    });\n\n    expect(page.body).toMatchSnapshot(\"should render with footer\");\n  });\n\n  it(\"should render with no targetId set\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop, Button],\n      html: `<ic-back-to-top></ic-back-to-top>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with no targetId set\");\n  });\n\n  it(\"should render when target starts with #\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, Button],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"#topEl\"></ic-back-to-top></div>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render when target starts with #\"\n    );\n  });\n\n  it(\"should offset due to classification banner\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, ClassificationBanner],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top><ic-classification-banner></ic-classification-banner></div>`,\n    });\n\n    expect(page.rootInstance.bannerOffset).toBe(true);\n  });\n\n  it(\"should scroll to 0,0 if target is null\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top></ic-back-to-top></div>`,\n    });\n\n    expect(page.rootInstance.isTargetElNull).toBe(true);\n\n    page.root.shadowRoot.querySelector(\"ic-button\").click();\n    expect(page.win.screenX).toBe(0);\n    expect(page.win.screenY).toBe(0);\n  });\n\n  it(\"should scroll targetEl into view\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.root.shadowRoot.querySelector(\"ic-button\").click();\n    expect(page.rootInstance.targetElVisible).toBe(true);\n  });\n\n  it(\"should return null targetElement when there's no target matching that given in back to top\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    const findTarget = page.rootInstance.findTargetEl(\"topEl\");\n\n    expect(findTarget).toBeNull();\n  });\n\n  it(\"should stop observing observedEl when topObserver exists\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.rootInstance.watchPropHandler(undefined, \"topEl\");\n    page.rootInstance.createTopObserver(\"topEl\");\n    expect(page.rootInstance.topObserver).not.toBeNull();\n  });\n\n  it(\"should set footerVisible\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.rootInstance.footerObserverCallback([{ isIntersecting: true }]);\n    //value is false as scrollY is always 0\n    expect(page.rootInstance.footerVisible).toBe(false);\n\n    page.rootInstance.footerObserverCallback([{ isIntersecting: false }]);\n    expect(page.rootInstance.footerVisible).toBe(false);\n  });\n\n  it(\"should set targetElVisible\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.rootInstance.targetElObserverCallback([{ isIntersecting: true }]);\n    expect(page.rootInstance.targetElVisible).toBe(true);\n\n    page.rootInstance.targetElObserverCallback([{ isIntersecting: false }]);\n    expect(page.rootInstance.targetElVisible).toBe(false);\n  });\n\n  it(\"should test update of target from undefined to value\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top></ic-back-to-top></div>`,\n    });\n\n    page.root.target = \"topEl\";\n    await page.waitForChanges();\n\n    expect(page.rootInstance.target).toBe(\"topEl\");\n  });\n\n  it(\"should render with an icon only\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, Button],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\" variant=\"icon\"></ic-back-to-top></div>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with an icon only\");\n  });\n});\n"]}