@salesforcedevs/dx-components 0.16.3 → 0.17.1-review-diff1

package/src/modules/dx/header/__tests__/header.test.ts

@@ -1,242 +0,0 @@
-import Button from "dx/button";
-import Dropdown from "dx/dropdown";
-import Header from "dx/header";
-import Icon from "dx/icon";
-import { createRenderComponent } from "utils/tests";
-import {
-    mockPropsDevelopers,
-    mockPropsEmployees,
-    mockPropsNoNavigation
-} from "./mockProps";
-import { track } from "dx/instrumentation";
-
-const TAG = "dx-header";
-const render = createRenderComponent(TAG, Header);
-
-jest.mock("dx/instrumentation");
-
-const GTM_EVENT_NAME = "custEv_signupStart";
-const SIGN_UP_LABEL = "Sign Up";
-
-describe("dx-header", () => {
-    it("renders", () => {
-        const subtitle = "testsubtitle";
-        const element = render({ ...mockPropsDevelopers, subtitle });
-        const subtitleEl = element.shadowRoot.querySelector(".subtitle");
-        const buttons: Array<HTMLElement> = element.shadowRoot.querySelectorAll(
-            "dx-button"
-        );
-        const dropdown = element.shadowRoot.querySelector("dx-dropdown");
-        const headerEl = element.shadowRoot.querySelector("dx-header-nav");
-
-        expect(subtitleEl.textContent).toEqual(subtitle);
-        expect(headerEl).not.toBeNull();
-        expect(buttons).toHaveLength(2);
-        expect(dropdown).toBeNull();
-
-        const brandIcon = element.shadowRoot.querySelector(".brand-icon");
-        expect(brandIcon).toBeNull();
-        return expect(element).toBeAccessible();
-    });
-
-    it("doesn't render subnav when navitems is empty", () => {
-        const element = render(mockPropsNoNavigation);
-
-        const els = element.querySelectorAll(
-            "dx-header-mobile-nav-menu, .header_l2_group-nav"
-        );
-
-        expect(els).toHaveLength(0);
-    });
-
-    it("renders the brand icon when a brand has an icon associated", () => {
-        const element = render(mockPropsEmployees);
-
-        const brandIcon: Icon = element.shadowRoot.querySelector(".brand-icon");
-        expect(brandIcon).not.toBeNull();
-        expect(brandIcon.symbol).toBe(mockPropsEmployees.brand);
-    });
-
-    it("doesn't render brand icon when no brand is provided", () => {
-        const element = render({ ...mockPropsDevelopers, brand: undefined });
-
-        const brandIcon: Icon = element.shadowRoot.querySelector(".brand-icon");
-        expect(brandIcon).toBeNull();
-    });
-
-    it("receives breadcrumbs", () => {
-        const breadcrumbs = [
-            {
-                href: "/apis/salesforce",
-                label: "Apis",
-                last: true,
-                asLink: false
-            }
-        ];
-
-        const element = render({ ...mockPropsDevelopers, breadcrumbs });
-        const breadcrumb = element.shadowRoot.querySelector("dx-breadcrumbs");
-
-        expect(breadcrumb.breadcrumbs).toEqual(breadcrumbs);
-        expect(breadcrumb).not.toBeNull();
-        return expect(element).toBeAccessible();
-    });
-
-    it("receives versions", () => {
-        const version = { id: "123", label: "Test" };
-        const element = render({
-            ...mockPropsDevelopers,
-            versions: JSON.stringify([version])
-        });
-        const dropdown: Dropdown = element.shadowRoot.querySelector(
-            "dx-dropdown"
-        );
-        expect(dropdown).not.toBeNull();
-        expect(dropdown.options).toHaveLength(1);
-
-        const [option] = dropdown.options;
-        expect(option).toHaveProperty("id", version.id);
-        expect(option).toHaveProperty("label", version.label);
-
-        return expect(element).toBeAccessible();
-    });
-
-    it("triggers event on version change", () => {
-        const versionsListParameter = [{ id: "123", label: "Test" }];
-        const element = render({
-            ...mockPropsDevelopers,
-            versions: JSON.stringify(versionsListParameter)
-        });
-        const dropdown: HTMLElement = element.shadowRoot.querySelector(
-            ".header_version-dropdown"
-        );
-        const mockVersionChange = jest.fn();
-        element.addEventListener("versionchange", mockVersionChange);
-
-        dropdown.dispatchEvent(new CustomEvent("change", { detail: "123" }));
-        expect(mockVersionChange).toBeCalledTimes(1);
-        expect(mockVersionChange.mock.calls[0][0].detail).toEqual("123");
-        return expect(element).toBeAccessible();
-    });
-
-    it("triggers event onrequestopennav", () => {
-        const element = render({
-            ...mockPropsDevelopers
-        });
-        const headerEl = element.shadowRoot.querySelector("dx-header-nav");
-        const headerMobile = element.shadowRoot.querySelector(
-            "dx-header-mobile-nav-menu"
-        );
-
-        headerEl.dispatchEvent(
-            new CustomEvent("requestopennavmenu", { detail: "123" })
-        );
-
-        return Promise.resolve().then(() => {
-            expect(headerMobile.value).toEqual("123");
-            expect(headerMobile.open).toEqual(true);
-        });
-    });
-
-    it("tests toggle button", () => {
-        const element = render({
-            ...mockPropsDevelopers
-        });
-        const button: HTMLElement = element.shadowRoot.querySelector(
-            ".header_l2_group-nav_menu-button"
-        );
-        const header = element.shadowRoot.querySelector(
-            "dx-header-mobile-nav-menu"
-        );
-        const toggleStatus = header.open;
-
-        button.click();
-
-        return Promise.resolve().then(() =>
-            expect(header.open).toEqual(!toggleStatus)
-        );
-    });
-
-    it("tests mobile nav change", () => {
-        const element = render({
-            ...mockPropsDevelopers
-        });
-        const headerMobile = element.shadowRoot.querySelector(
-            "dx-header-mobile-nav-menu"
-        );
-
-        headerMobile.dispatchEvent(
-            new CustomEvent("change", { detail: "test" })
-        );
-        return Promise.resolve().then(() => {
-            expect(headerMobile.value).toEqual("test");
-        });
-    });
-
-    it("renders signup button and has bailLink", () => {
-        const element = render({
-            ...mockPropsDevelopers,
-            bailHref: "test",
-            bailLabel: "test",
-            signupLink: "/"
-        });
-        const buttons: Array<Button> = element.shadowRoot.querySelectorAll(
-            "dx-button"
-        );
-
-        expect(buttons[0].href).toEqual("/");
-        expect(buttons[2].href).toEqual("test");
-        return expect(element).toBeAccessible();
-    });
-
-    it("won't render search if any coveo properties are missing", () => {
-        const element = render({
-            subtitle: mockPropsDevelopers.subtitle,
-            navItems: mockPropsDevelopers.navItems
-        });
-        const headerSearch = element.shadowRoot.querySelector(
-            "dx-header-search"
-        );
-
-        expect(headerSearch).toBeNull();
-        return expect(element).toBeAccessible();
-    });
-
-    it("signup button track is beign called", () => {
-        const element = render(mockPropsDevelopers);
-
-        const button: HTMLElement = element.shadowRoot.querySelector(
-            "dx-button"
-        );
-
-        button.click();
-
-        expect(track).toBeCalledTimes(1);
-        expect(track).toBeCalledWith(button, GTM_EVENT_NAME, {
-            clickText: SIGN_UP_LABEL
-        });
-    });
-
-    it("hides signup button when signupLink property is empty", () => {
-        const updatedMockPropsDevelopers = {
-            ...mockPropsDevelopers,
-            signupLink: ""
-        };
-        const element = render(updatedMockPropsDevelopers);
-        const signupButtonContainer: HTMLElement =
-            element.shadowRoot.querySelector(".header-login-signup");
-        expect(signupButtonContainer).toBeNull();
-    });
-
-    it("hides banner when banner markup is empty", () => {
-        const bannerMarkup = "";
-        const updatedMockPropsDevelopers = {
-            ...mockPropsDevelopers,
-            bannerMarkup
-        };
-        const element = render(updatedMockPropsDevelopers);
-        const bannerElement: HTMLElement =
-            element.shadowRoot.querySelector("dx-banner");
-        expect(bannerElement).toBeNull();
-    });
-});

package/src/modules/dx/header/__tests__/mockNavArchitects.ts

@@ -1,169 +0,0 @@
-export default [
-    {
-        id: "home",
-        label: "Home",
-        link: {
-            href: "/architects",
-            target: null
-        }
-    },
-    {
-        id: "design",
-        label: "Design",
-        link: {
-            href: "/architects/design",
-            target: null
-        }
-    },
-    {
-        id: "deliver",
-        label: "Deliver",
-        link: {
-            href: "/architects/deliver",
-            target: null
-        }
-    },
-    {
-        id: "govern",
-        label: "Govern",
-        link: {
-            href: "/architects/govern",
-            target: null
-        }
-    },
-    {
-        id: "roadmap",
-        label: "Roadmap",
-        link: {
-            href: "/architects/roadmap",
-            target: null
-        }
-    },
-    {
-        id: "covid-19",
-        label: "COVID-19",
-        options: [
-            {
-                id: "covid-resources",
-                label: "COVID-19 Resources",
-                options: [
-                    {
-                        id: "covid19-work",
-                        label: "Work.com",
-                        link: {
-                            href: "https://www.salesforce.com/work",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-leading-through-change-with-data",
-                        label: "Leading Through Change with Data",
-                        link: {
-                            href:
-                                "https://www.tableau.com/leading-through-change?placement=homepage&utm_medium=Referral&utm_source=Salesforce",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-data-hub",
-                        label: "COVID-19 Data Hub",
-                        link: {
-                            href:
-                                "https://www.tableau.com/covid-19-coronavirus-data-resources?placement=homepage&utm_medium=Referral&utm_source=Salesforce",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-global-daily-tracker",
-                        label: "COVID-19 Global Daily Tracker",
-                        link: {
-                            href:
-                                "https://www.tableau.com/covid-19-coronavirus-data-resources/global-tracker?placement=homepage&utm_medium=Referral&utm_source=Salesforce",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-global-economy-data-track",
-                        label: "Global Economy Data Track",
-                        link: {
-                            href:
-                                "https://www.tableau.com/covid-19-coronavirus-data-resources/economy-data-track?placement=homepage&utm_medium=Referral&utm_source=Salesforce",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-government-data-track",
-                        label: "Government Data Track",
-                        link: {
-                            href:
-                                "https://www.tableau.com/covid-19-coronavirus-data-resources/government-data-track?placement=homepage&utm_medium=Referral&utm_source=Salesforce",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-healthcare-data-track",
-                        label: "Healthcare Data Track",
-                        link: {
-                            href:
-                                "https://www.tableau.com/covid-19-coronavirus-data-resources/healthcare-data-track?placement=homepage&utm_medium=Referral&utm_source=Salesforce",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-b-well-together",
-                        label: "B-Well Together",
-                        link: {
-                            href:
-                                "https://www.salesforce.com/resources/videos/be-well/?d=cta-glob-nav-5",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-leading-through-change",
-                        label: "Leading Through Change",
-                        link: {
-                            href:
-                                "https://www.salesforce.com/resources/leading-through-change/#!page=1",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-salesforce-care",
-                        label: "Salesforce Care",
-                        link: {
-                            href:
-                                "https://www.salesforce.com/solutions/covid-19-response/overview/?d=cta-glob-nav-7",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-trailhead-resources",
-                        label: "Trailhead Resources",
-                        link: {
-                            href:
-                                "https://trailhead.salesforce.com/users/strailhead/trailmixes/trailhead-resources-during-covid-19?utm_source=salesforce_properties&utm_medium=global_nav&utm_campaign=covid19&utm_content=covid_resources_trailmix",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-appexchange-resources",
-                        label: "AppExchange Resources",
-                        link: {
-                            href:
-                                "https://appexchange.salesforce.com/mktcollections/curated/c19response?d=cta-nav-external",
-                            target: "_blank"
-                        }
-                    },
-                    {
-                        id: "covid19-mulesoft-resources",
-                        label: "MuleSoft Resources",
-                        link: {
-                            href: "https://www.mulesoft.com/resources/covid-19",
-                            target: "_blank"
-                        }
-                    }
-                ]
-            }
-        ]
-    }
-];