@ukic/web-components 2.1.0-beta.9 → 2.2.0

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

@@ -0,0 +1,94 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { MenuGroup } from "../../ic-menu-group";
+import { MenuItem } from "../../../ic-menu-item/ic-menu-item";
+describe("menu group", () => {
+  it("should render a menu group with a label", async () => {
+    const page = await newSpecPage({
+      components: [MenuGroup, MenuItem],
+      html: `<ic-menu-group label="Menu item label">
+            <ic-menu-item label="Button">
+              <svg
+                slot="icon"
+                xmlns="http://www.w3.org/2000/svg"
+                height="24px"
+                viewBox="0 0 24 24"
+                width="24px"
+              >
+                <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-menu-item>
+            <ic-menu-item label="Button">
+              <svg
+                slot="icon"
+                xmlns="http://www.w3.org/2000/svg"
+                height="24px"
+                viewBox="0 0 24 24"
+                width="24px"
+              >
+                <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-menu-item>
+            <ic-menu-item
+              label="Button"
+              href="#"
+              description="This button has a href and so it behaves like a link"
+            >
+            </ic-menu-item>
+          </ic-menu-group>`,
+    });
+    expect(page.root).toMatchSnapshot();
+    const ariaLabel = page.root.getAttribute("aria-label");
+    expect(ariaLabel).toMatch(page.rootInstance.label);
+  });
+  it("should render a menu group without a label", async () => {
+    const page = await newSpecPage({
+      components: [MenuGroup, MenuItem],
+      html: `<ic-menu-group>
+            <ic-menu-item label="Button">
+              <svg
+                slot="icon"
+                xmlns="http://www.w3.org/2000/svg"
+                height="24px"
+                viewBox="0 0 24 24"
+                width="24px"
+              >
+                <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-menu-item>
+            <ic-menu-item label="Button">
+              <svg
+                slot="icon"
+                xmlns="http://www.w3.org/2000/svg"
+                height="24px"
+                viewBox="0 0 24 24"
+                width="24px"
+              >
+                <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-menu-item>
+            <ic-menu-item
+              label="Button"
+              href="#"
+              description="This button has a href and so it behaves like a link"
+            >
+            </ic-menu-item>
+          </ic-menu-group>`,
+    });
+    expect(page.root).toMatchSnapshot();
+    const ariaLabel = page.root.getAttribute("aria-label");
+    expect(ariaLabel).toBeNull();
+  });
+});
+//# sourceMappingURL=ic-menu-group.spec.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ic-menu-group.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-menu-group/test/basic/ic-menu-group.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAE9D,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;EAC1B,EAAE,CAAC,yCAAyC,EAAE,KAAK,IAAI,EAAE;IACvD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC;MACjC,IAAI,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAmCe;KACtB,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IAEpC,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;IACvD,MAAM,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;EACrD,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;IAC1D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC;MACjC,IAAI,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAmCe;KACtB,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IAEpC,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;IACvD,MAAM,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,CAAC;EAC/B,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { MenuGroup } from \"../../ic-menu-group\";\nimport { MenuItem } from \"../../../ic-menu-item/ic-menu-item\";\n\ndescribe(\"menu group\", () => {\n  it(\"should render a menu group with a label\", async () => {\n    const page = await newSpecPage({\n      components: [MenuGroup, MenuItem],\n      html: `<ic-menu-group label=\"Menu item label\">\n            <ic-menu-item label=\"Button\">\n              <svg\n                slot=\"icon\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                height=\"24px\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n              >\n                <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                <path\n                  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                />\n              </svg>\n            </ic-menu-item>\n            <ic-menu-item label=\"Button\">\n              <svg\n                slot=\"icon\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                height=\"24px\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n              >\n                <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                <path\n                  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                />\n              </svg>\n            </ic-menu-item>\n            <ic-menu-item\n              label=\"Button\"\n              href=\"#\"\n              description=\"This button has a href and so it behaves like a link\"\n            >\n            </ic-menu-item>\n          </ic-menu-group>`,\n    });\n\n    expect(page.root).toMatchSnapshot();\n\n    const ariaLabel = page.root.getAttribute(\"aria-label\");\n    expect(ariaLabel).toMatch(page.rootInstance.label);\n  });\n\n  it(\"should render a menu group without a label\", async () => {\n    const page = await newSpecPage({\n      components: [MenuGroup, MenuItem],\n      html: `<ic-menu-group>\n            <ic-menu-item label=\"Button\">\n              <svg\n                slot=\"icon\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                height=\"24px\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n              >\n                <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                <path\n                  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                />\n              </svg>\n            </ic-menu-item>\n            <ic-menu-item label=\"Button\">\n              <svg\n                slot=\"icon\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                height=\"24px\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n              >\n                <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                <path\n                  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                />\n              </svg>\n            </ic-menu-item>\n            <ic-menu-item\n              label=\"Button\"\n              href=\"#\"\n              description=\"This button has a href and so it behaves like a link\"\n            >\n            </ic-menu-item>\n          </ic-menu-group>`,\n    });\n\n    expect(page.root).toMatchSnapshot();\n\n    const ariaLabel = page.root.getAttribute(\"aria-label\");\n    expect(ariaLabel).toBeNull();\n  });\n});\n"]}