@zanichelli/albe-web-components 16.3.0 → 16.3.1

package/dist/collection/components/z-app-header/index.spec.js

@@ -1,617 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { ZAppHeader } from "./index";
-global.ResizeObserver = jest.fn().mockImplementation(() => ({
-    observe: jest.fn(),
-    unobserve: jest.fn(),
-    disconnect: jest.fn(),
-}));
-describe("Suite test ZAppHeader", () => {
-    it("Test render empty ZAppHeader", async () => {
-        const page = await newSpecPage({
-            components: [ZAppHeader],
-            html: `<z-app-header></z-app-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-app-header enable-z-logo="" menu-length="0">
-        <mock:shadow-root>
-          <div class="heading-panel">
-            <div class="heading-container">
-              <div>
-                <slot name="top-subtitle"></slot>
-              </div>
-              <div class="heading-title">
-              <img alt="Logo Zanichelli" class="z-logo">
-                <slot name="product-logo"></slot>
-                <slot name="title"></slot>
-              </div>
-            </div>
-          </div>
-          <z-offcanvas transitiondirection="right" variant="overlay">
-            <div slot="canvasContent">
-              <button aria-hidden="true" aria-label="Chiudi menu" class="drawer-close" disabled="">
-                <z-icon name="close"></z-icon>
-              </button>
-              <div aria-hidden="true" class="drawer-content">
-                <slot name="menu"></slot>
-              </div>
-            </div>
-          </z-offcanvas>
-        </mock:shadow-root>
-      </z-app-header>
-    `);
-    });
-    it("Test render ZAppHeader with title", async () => {
-        const page = await newSpecPage({
-            components: [ZAppHeader],
-            html: `<z-app-header>
-        <h1 slot="title">Titolo di test</h1>
-      </z-app-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-app-header enable-z-logo="" menu-length="0">
-        <mock:shadow-root>
-          <div class="heading-panel">
-            <div class="heading-container">
-              <div>
-                <slot name="top-subtitle"></slot>
-              </div>
-              <div class="heading-title">
-              <img alt="Logo Zanichelli" class="z-logo">
-                <slot name="product-logo"></slot>
-                <slot name="title"></slot>
-              </div>
-            </div>
-          </div>
-          <z-offcanvas transitiondirection="right" variant="overlay">
-            <div slot="canvasContent">
-              <button aria-hidden="true" aria-label="Chiudi menu" class="drawer-close" disabled="">
-                <z-icon name="close"></z-icon>
-              </button>
-              <div aria-hidden="true" class="drawer-content">
-                <slot name="menu"></slot>
-              </div>
-            </div>
-          </z-offcanvas>
-        </mock:shadow-root>
-        <h1 slot="title">
-          Titolo di test
-        </h1>
-      </z-app-header>
-    `);
-    });
-    it("Test render ZAppHeader with title and top-subtitle", async () => {
-        const page = await newSpecPage({
-            components: [ZAppHeader],
-            html: `<z-app-header>
-        <h1 slot="title">Titolo di test</h1>
-        <h2 slot="top-subtitle">Payoff dell'applicazione</h2>
-      </z-app-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-app-header enable-z-logo="" menu-length="0">
-        <mock:shadow-root>
-          <div class="heading-panel">
-            <div class="heading-container">
-              <div>
-                <slot name="top-subtitle"></slot>
-              </div>
-              <div class="heading-title">
-                <slot name="title"></slot>
-              </div>
-            </div>
-          </div>
-          <z-offcanvas transitiondirection="right" variant="overlay">
-            <div slot="canvasContent">
-              <button aria-hidden="true" aria-label="Chiudi menu" class="drawer-close" disabled="">
-                <z-icon name="close"></z-icon>
-              </button>
-              <div aria-hidden="true" class="drawer-content">
-                <slot name="menu"></slot>
-              </div>
-            </div>
-          </z-offcanvas>
-        </mock:shadow-root>
-        <h1 slot="title">
-          Titolo di test
-        </h1>
-        <h2 slot="top-subtitle">
-          Payoff dell'applicazione
-        </h2>
-      </z-app-header>
-    `);
-    });
-    it("Test render ZAppHeader with z-logo and product-logo", async () => {
-        const page = await newSpecPage({
-            components: [ZAppHeader],
-            html: `<z-app-header enable-z-logo="true">
-        <h1 slot="title">Titolo di test</h1>
-        <img
-          slot="product-logo"
-          src="https://picsum.photos/id/237/320/320"
-          alt=""
-        />
-      </z-app-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-app-header enable-z-logo="true" menu-length="0">
-        <mock:shadow-root>
-          <div class="heading-panel">
-            <div class="heading-container">
-              <div>
-                <slot name="top-subtitle"></slot>
-              </div>
-              <div class="heading-title">
-                <img alt="Logo Zanichelli" class="z-logo">
-                <slot name="product-logo"></slot>
-                <slot name="title"></slot>
-              </div>
-            </div>
-          </div>
-          <z-offcanvas transitiondirection="right" variant="overlay">
-            <div slot="canvasContent">
-              <button aria-hidden="true" aria-label="Chiudi menu" class="drawer-close" disabled="">
-                <z-icon name="close"></z-icon>
-              </button>
-              <div aria-hidden="true" class="drawer-content">
-                <slot name="menu"></slot>
-              </div>
-            </div>
-          </z-offcanvas>
-        </mock:shadow-root>
-        <h1 slot="title">
-          Titolo di test
-        </h1>
-        <img alt="" slot="product-logo" src="https://picsum.photos/id/237/320/320">
-      </z-app-header>
-    `);
-    });
-    it("Test render ZAppHeader with stuck layout and with z-logo, product-logo", async () => {
-        const page = await newSpecPage({
-            components: [ZAppHeader],
-            html: `<z-app-header stuck  enable-z-logo="true">
-        <h1 slot="title">Titolo di test</h1>
-        <img
-          slot="product-logo"
-          src="https://picsum.photos/id/237/320/320"
-          alt=""
-        />
-      </z-app-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-app-header  enable-z-logo="true" menu-length="0" stuck>
-        <mock:shadow-root>
-          <div class="heading-panel">
-            <div class="heading-container">
-              <div>
-                <slot name="top-subtitle"></slot>
-              </div>
-              <div class="heading-title">
-                <img alt="Logo Zanichelli" class="z-logo">
-                <slot name="product-logo"></slot>
-                <slot name="title"></slot>
-              </div>
-            </div>
-          </div>
-          <z-offcanvas transitiondirection="right" variant="overlay">
-            <div slot="canvasContent">
-              <button aria-hidden="true" aria-label="Chiudi menu" class="drawer-close" disabled="">
-                <z-icon name="close"></z-icon>
-              </button>
-              <div aria-hidden="true" class="drawer-content">
-                <slot name="menu"></slot>
-              </div>
-            </div>
-          </z-offcanvas>
-        </mock:shadow-root>
-        <h1 slot="title">
-          Titolo di test
-        </h1>
-        <img alt="" slot="product-logo" src="https://picsum.photos/id/237/320/320">
-      </z-app-header>
-    `);
-    });
-    it("Test render ZAppHeader with z-logo, product-logo, searchbar and menu", async () => {
-        const page = await newSpecPage({
-            components: [ZAppHeader],
-            html: `<z-app-header enable-z-logo="true" enable-search="true">
-        <h1 slot="title">Titolo di test</h1>
-        <img
-          slot="product-logo"
-          src="https://picsum.photos/id/237/320/320"
-          alt=""
-        />
-              <z-menu
-        slot="menu"
-        floating=""
-      >
-        <a href="">Menu label</a>
-      </z-menu>
-      <z-menu
-        slot="menu"
-        floating=""
-      >
-        <h3>Not so short menu label</h3>
-        <a
-          href=""
-          slot="item"
-          >Item 1</a
-        >
-        <a
-          href=""
-          slot="item"
-          >Item 2</a
-        >
-        <z-menu-section slot="item">
-          <h3>Item 3</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 3.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 3.2</a
-          >
-        </z-menu-section>
-        <z-menu-section slot="item">
-          <h3>Item 4</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 4.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 4.2</a
-          >
-        </z-menu-section>
-        <a
-          href=""
-          slot="item"
-          >Item 5</a
-        >
-      </z-menu>
-      <z-menu
-        slot="menu"
-        floating=""
-      >
-        <h3>Not so short menu label</h3>
-        <a
-          href=""
-          slot="item"
-          >Item 1</a
-        >
-        <a
-          href=""
-          slot="item"
-          >Item 2</a
-        >
-        <z-menu-section slot="item">
-          <h3>Item 3</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 3.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 3.2</a
-          >
-        </z-menu-section>
-        <z-menu-section slot="item">
-          <h3>Item 4</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 4.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 4.2</a
-          >
-        </z-menu-section>
-        <a
-          href=""
-          slot="item"
-          >Item 5</a
-        >
-      </z-menu>
-      <z-menu
-        slot="menu"
-        floating=""
-      >
-        <a href="">Menu label</a>
-      </z-menu>
-      <z-menu
-        slot="menu"
-        floating=""
-      >
-        <h3>Not so short menu label</h3>
-        <a
-          href=""
-          slot="item"
-          >Item 1</a
-        >
-        <a
-          href=""
-          slot="item"
-          >Item 2</a
-        >
-        <z-menu-section slot="item">
-          <h3>Item 3</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 3.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 3.2</a
-          >
-        </z-menu-section>
-        <z-menu-section slot="item">
-          <h3>Item 4</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 4.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 4.2</a
-          >
-        </z-menu-section>
-        <a
-          href=""
-          slot="item"
-          >Item 5</a
-        >
-      </z-menu>
-      <z-menu
-        slot="menu"
-        floating=""
-      >
-        <h3>Not so short menu label</h3>
-        <a
-          href=""
-          slot="item"
-          >Item 1</a
-        >
-        <a
-          href=""
-          slot="item"
-          >Item 2</a
-        >
-        <z-menu-section slot="item">
-          <h3>Item 3</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 3.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 3.2</a
-          >
-        </z-menu-section>
-        <z-menu-section slot="item">
-          <h3>Item 4</h3>
-          <a
-            href=""
-            slot="section"
-            >Item 4.1</a
-          >
-          <a
-            href=""
-            slot="section"
-            >Item 4.2</a
-          >
-        </z-menu-section>
-        <a
-          href=""
-          slot="item"
-          >Item 5</a
-        >
-      </z-menu>
-      </z-app-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-app-header  enable-z-logo="true" menu-length="6"  enable-search="true">
-        <mock:shadow-root>
-          <div class="has-menu heading-panel">
-            <div class="heading-container">
-              <div>
-                <slot name="top-subtitle"></slot>
-              </div>
-              <div class="heading-title">
-                <img alt="Logo Zanichelli" class="z-logo">
-                <slot name="product-logo"></slot>
-                <slot name="title"></slot>
-                <z-searchbar placeholder="Cerca" preventsubmit="" showsearchbutton="" size="x-small" value="" variant="secondary"></z-searchbar>
-              </div>
-            </div>
-            <div class="menu-container" role="hidden" tabindex="0">
-              <slot name="menu"></slot>
-            </div>
-          </div>
-          <z-offcanvas transitiondirection="right" variant="overlay">
-            <div slot="canvasContent">
-              <button aria-hidden="true" aria-label="Chiudi menu" class="drawer-close" disabled="">
-                <z-icon name="close"></z-icon>
-              </button>
-              <div aria-hidden="true" class="drawer-content">
-                <slot name="menu"></slot>
-              </div>
-            </div>
-          </z-offcanvas>
-        </mock:shadow-root>
-        <h1 slot="title">
-          Titolo di test
-        </h1>
-        <img alt="" slot="product-logo" src="https://picsum.photos/id/237/320/320">
-        <z-menu floating="" role="menuitem" slot="menu" tabindex="-1">
-          <a href="">
-            Menu label
-          </a>
-        </z-menu>
-        <z-menu floating="" role="menuitem" slot="menu" tabindex="-1">
-          <h3>
-            Not so short menu label
-          </h3>
-          <a href="" slot="item">
-            Item 1
-          </a>
-          <a href="" slot="item">
-            Item 2
-          </a>
-          <z-menu-section slot="item">
-            <h3>
-              Item 3
-            </h3>
-            <a href="" slot="section">
-              Item 3.1
-            </a>
-            <a href="" slot="section">
-              Item 3.2
-            </a>
-          </z-menu-section>
-          <z-menu-section slot="item">
-            <h3>
-              Item 4
-            </h3>
-            <a href="" slot="section">
-              Item 4.1
-            </a>
-            <a href="" slot="section">
-              Item 4.2
-            </a>
-          </z-menu-section>
-          <a href="" slot="item">
-            Item 5
-          </a>
-        </z-menu>
-        <z-menu floating="" role="menuitem" slot="menu" tabindex="-1">
-          <h3>
-            Not so short menu label
-          </h3>
-          <a href="" slot="item">
-            Item 1
-          </a>
-          <a href="" slot="item">
-            Item 2
-          </a>
-          <z-menu-section slot="item">
-            <h3>
-              Item 3
-            </h3>
-            <a href="" slot="section">
-              Item 3.1
-            </a>
-            <a href="" slot="section">
-              Item 3.2
-            </a>
-          </z-menu-section>
-          <z-menu-section slot="item">
-            <h3>
-              Item 4
-            </h3>
-            <a href="" slot="section">
-              Item 4.1
-            </a>
-            <a href="" slot="section">
-              Item 4.2
-            </a>
-          </z-menu-section>
-          <a href="" slot="item">
-            Item 5
-          </a>
-        </z-menu>
-        <z-menu floating="" role="menuitem" slot="menu" tabindex="-1">
-          <a href="">
-            Menu label
-          </a>
-        </z-menu>
-        <z-menu floating="" role="menuitem" slot="menu" tabindex="-1">
-          <h3>
-            Not so short menu label
-          </h3>
-          <a href="" slot="item">
-            Item 1
-          </a>
-          <a href="" slot="item">
-            Item 2
-          </a>
-          <z-menu-section slot="item">
-            <h3>
-              Item 3
-            </h3>
-            <a href="" slot="section">
-              Item 3.1
-            </a>
-            <a href="" slot="section">
-              Item 3.2
-            </a>
-          </z-menu-section>
-          <z-menu-section slot="item">
-            <h3>
-              Item 4
-            </h3>
-            <a href="" slot="section">
-              Item 4.1
-            </a>
-            <a href="" slot="section">
-              Item 4.2
-            </a>
-          </z-menu-section>
-          <a href="" slot="item">
-            Item 5
-          </a>
-        </z-menu>
-        <z-menu floating="" role="menuitem" slot="menu" tabindex="-1">
-          <h3>
-            Not so short menu label
-          </h3>
-          <a href="" slot="item">
-            Item 1
-          </a>
-          <a href="" slot="item">
-            Item 2
-          </a>
-          <z-menu-section slot="item">
-            <h3>
-              Item 3
-            </h3>
-            <a href="" slot="section">
-              Item 3.1
-            </a>
-            <a href="" slot="section">
-              Item 3.2
-            </a>
-          </z-menu-section>
-          <z-menu-section slot="item">
-            <h3>
-              Item 4
-            </h3>
-            <a href="" slot="section">
-              Item 4.1
-            </a>
-            <a href="" slot="section">
-              Item 4.2
-            </a>
-          </z-menu-section>
-          <a href="" slot="item">
-            Item 5
-          </a>
-        </z-menu>
-      </z-app-header>
-    `);
-    });
-});
-//# sourceMappingURL=index.spec.js.map

package/dist/collection/components/z-app-header/index.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/z-app-header/index.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZAppHeader} from \"./index\";\n\nglobal.ResizeObserver = jest.fn().mockImplementation(() => ({\n  observe: jest.fn(),\n  unobserve: jest.fn(),\n  disconnect: jest.fn(),\n}));\n\ndescribe(\"Suite test ZAppHeader\", () => {\n  it(\"Test render empty ZAppHeader\", async () => {\n    const page = await newSpecPage({\n      components: [ZAppHeader],\n      html: `<z-app-header></z-app-header>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-app-header enable-z-logo=\"\" menu-length=\"0\">\n        <mock:shadow-root>\n          <div class=\"heading-panel\">\n            <div class=\"heading-container\">\n              <div>\n                <slot name=\"top-subtitle\"></slot>\n              </div>\n              <div class=\"heading-title\">\n              <img alt=\"Logo Zanichelli\" class=\"z-logo\">\n                <slot name=\"product-logo\"></slot>\n                <slot name=\"title\"></slot>\n              </div>\n            </div>\n          </div>\n          <z-offcanvas transitiondirection=\"right\" variant=\"overlay\">\n            <div slot=\"canvasContent\">\n              <button aria-hidden=\"true\" aria-label=\"Chiudi menu\" class=\"drawer-close\" disabled=\"\">\n                <z-icon name=\"close\"></z-icon>\n              </button>\n              <div aria-hidden=\"true\" class=\"drawer-content\">\n                <slot name=\"menu\"></slot>\n              </div>\n            </div>\n          </z-offcanvas>\n        </mock:shadow-root>\n      </z-app-header>\n    `);\n  });\n\n  it(\"Test render ZAppHeader with title\", async () => {\n    const page = await newSpecPage({\n      components: [ZAppHeader],\n      html: `<z-app-header>\n        <h1 slot=\"title\">Titolo di test</h1>\n      </z-app-header>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-app-header enable-z-logo=\"\" menu-length=\"0\">\n        <mock:shadow-root>\n          <div class=\"heading-panel\">\n            <div class=\"heading-container\">\n              <div>\n                <slot name=\"top-subtitle\"></slot>\n              </div>\n              <div class=\"heading-title\">\n              <img alt=\"Logo Zanichelli\" class=\"z-logo\">\n                <slot name=\"product-logo\"></slot>\n                <slot name=\"title\"></slot>\n              </div>\n            </div>\n          </div>\n          <z-offcanvas transitiondirection=\"right\" variant=\"overlay\">\n            <div slot=\"canvasContent\">\n              <button aria-hidden=\"true\" aria-label=\"Chiudi menu\" class=\"drawer-close\" disabled=\"\">\n                <z-icon name=\"close\"></z-icon>\n              </button>\n              <div aria-hidden=\"true\" class=\"drawer-content\">\n                <slot name=\"menu\"></slot>\n              </div>\n            </div>\n          </z-offcanvas>\n        </mock:shadow-root>\n        <h1 slot=\"title\">\n          Titolo di test\n        </h1>\n      </z-app-header>\n    `);\n  });\n\n  it(\"Test render ZAppHeader with title and top-subtitle\", async () => {\n    const page = await newSpecPage({\n      components: [ZAppHeader],\n      html: `<z-app-header>\n        <h1 slot=\"title\">Titolo di test</h1>\n        <h2 slot=\"top-subtitle\">Payoff dell'applicazione</h2>\n      </z-app-header>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-app-header enable-z-logo=\"\" menu-length=\"0\">\n        <mock:shadow-root>\n          <div class=\"heading-panel\">\n            <div class=\"heading-container\">\n              <div>\n                <slot name=\"top-subtitle\"></slot>\n              </div>\n              <div class=\"heading-title\">\n                <slot name=\"title\"></slot>\n              </div>\n            </div>\n          </div>\n          <z-offcanvas transitiondirection=\"right\" variant=\"overlay\">\n            <div slot=\"canvasContent\">\n              <button aria-hidden=\"true\" aria-label=\"Chiudi menu\" class=\"drawer-close\" disabled=\"\">\n                <z-icon name=\"close\"></z-icon>\n              </button>\n              <div aria-hidden=\"true\" class=\"drawer-content\">\n                <slot name=\"menu\"></slot>\n              </div>\n            </div>\n          </z-offcanvas>\n        </mock:shadow-root>\n        <h1 slot=\"title\">\n          Titolo di test\n        </h1>\n        <h2 slot=\"top-subtitle\">\n          Payoff dell'applicazione\n        </h2>\n      </z-app-header>\n    `);\n  });\n\n  it(\"Test render ZAppHeader with z-logo and product-logo\", async () => {\n    const page = await newSpecPage({\n      components: [ZAppHeader],\n      html: `<z-app-header enable-z-logo=\"true\">\n        <h1 slot=\"title\">Titolo di test</h1>\n        <img\n          slot=\"product-logo\"\n          src=\"https://picsum.photos/id/237/320/320\"\n          alt=\"\"\n        />\n      </z-app-header>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-app-header enable-z-logo=\"true\" menu-length=\"0\">\n        <mock:shadow-root>\n          <div class=\"heading-panel\">\n            <div class=\"heading-container\">\n              <div>\n                <slot name=\"top-subtitle\"></slot>\n              </div>\n              <div class=\"heading-title\">\n                <img alt=\"Logo Zanichelli\" class=\"z-logo\">\n                <slot name=\"product-logo\"></slot>\n                <slot name=\"title\"></slot>\n              </div>\n            </div>\n          </div>\n          <z-offcanvas transitiondirection=\"right\" variant=\"overlay\">\n            <div slot=\"canvasContent\">\n              <button aria-hidden=\"true\" aria-label=\"Chiudi menu\" class=\"drawer-close\" disabled=\"\">\n                <z-icon name=\"close\"></z-icon>\n              </button>\n              <div aria-hidden=\"true\" class=\"drawer-content\">\n                <slot name=\"menu\"></slot>\n              </div>\n            </div>\n          </z-offcanvas>\n        </mock:shadow-root>\n        <h1 slot=\"title\">\n          Titolo di test\n        </h1>\n        <img alt=\"\" slot=\"product-logo\" src=\"https://picsum.photos/id/237/320/320\">\n      </z-app-header>\n    `);\n  });\n\n  it(\"Test render ZAppHeader with stuck layout and with z-logo, product-logo\", async () => {\n    const page = await newSpecPage({\n      components: [ZAppHeader],\n      html: `<z-app-header stuck  enable-z-logo=\"true\">\n        <h1 slot=\"title\">Titolo di test</h1>\n        <img\n          slot=\"product-logo\"\n          src=\"https://picsum.photos/id/237/320/320\"\n          alt=\"\"\n        />\n      </z-app-header>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-app-header  enable-z-logo=\"true\" menu-length=\"0\" stuck>\n        <mock:shadow-root>\n          <div class=\"heading-panel\">\n            <div class=\"heading-container\">\n              <div>\n                <slot name=\"top-subtitle\"></slot>\n              </div>\n              <div class=\"heading-title\">\n                <img alt=\"Logo Zanichelli\" class=\"z-logo\">\n                <slot name=\"product-logo\"></slot>\n                <slot name=\"title\"></slot>\n              </div>\n            </div>\n          </div>\n          <z-offcanvas transitiondirection=\"right\" variant=\"overlay\">\n            <div slot=\"canvasContent\">\n              <button aria-hidden=\"true\" aria-label=\"Chiudi menu\" class=\"drawer-close\" disabled=\"\">\n                <z-icon name=\"close\"></z-icon>\n              </button>\n              <div aria-hidden=\"true\" class=\"drawer-content\">\n                <slot name=\"menu\"></slot>\n              </div>\n            </div>\n          </z-offcanvas>\n        </mock:shadow-root>\n        <h1 slot=\"title\">\n          Titolo di test\n        </h1>\n        <img alt=\"\" slot=\"product-logo\" src=\"https://picsum.photos/id/237/320/320\">\n      </z-app-header>\n    `);\n  });\n\n  it(\"Test render ZAppHeader with z-logo, product-logo, searchbar and menu\", async () => {\n    const page = await newSpecPage({\n      components: [ZAppHeader],\n      html: `<z-app-header enable-z-logo=\"true\" enable-search=\"true\">\n        <h1 slot=\"title\">Titolo di test</h1>\n        <img\n          slot=\"product-logo\"\n          src=\"https://picsum.photos/id/237/320/320\"\n          alt=\"\"\n        />\n              <z-menu\n        slot=\"menu\"\n        floating=\"\"\n      >\n        <a href=\"\">Menu label</a>\n      </z-menu>\n      <z-menu\n        slot=\"menu\"\n        floating=\"\"\n      >\n        <h3>Not so short menu label</h3>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 1</a\n        >\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 2</a\n        >\n        <z-menu-section slot=\"item\">\n          <h3>Item 3</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.2</a\n          >\n        </z-menu-section>\n        <z-menu-section slot=\"item\">\n          <h3>Item 4</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.2</a\n          >\n        </z-menu-section>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 5</a\n        >\n      </z-menu>\n      <z-menu\n        slot=\"menu\"\n        floating=\"\"\n      >\n        <h3>Not so short menu label</h3>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 1</a\n        >\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 2</a\n        >\n        <z-menu-section slot=\"item\">\n          <h3>Item 3</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.2</a\n          >\n        </z-menu-section>\n        <z-menu-section slot=\"item\">\n          <h3>Item 4</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.2</a\n          >\n        </z-menu-section>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 5</a\n        >\n      </z-menu>\n      <z-menu\n        slot=\"menu\"\n        floating=\"\"\n      >\n        <a href=\"\">Menu label</a>\n      </z-menu>\n      <z-menu\n        slot=\"menu\"\n        floating=\"\"\n      >\n        <h3>Not so short menu label</h3>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 1</a\n        >\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 2</a\n        >\n        <z-menu-section slot=\"item\">\n          <h3>Item 3</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.2</a\n          >\n        </z-menu-section>\n        <z-menu-section slot=\"item\">\n          <h3>Item 4</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.2</a\n          >\n        </z-menu-section>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 5</a\n        >\n      </z-menu>\n      <z-menu\n        slot=\"menu\"\n        floating=\"\"\n      >\n        <h3>Not so short menu label</h3>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 1</a\n        >\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 2</a\n        >\n        <z-menu-section slot=\"item\">\n          <h3>Item 3</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 3.2</a\n          >\n        </z-menu-section>\n        <z-menu-section slot=\"item\">\n          <h3>Item 4</h3>\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.1</a\n          >\n          <a\n            href=\"\"\n            slot=\"section\"\n            >Item 4.2</a\n          >\n        </z-menu-section>\n        <a\n          href=\"\"\n          slot=\"item\"\n          >Item 5</a\n        >\n      </z-menu>\n      </z-app-header>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-app-header  enable-z-logo=\"true\" menu-length=\"6\"  enable-search=\"true\">\n        <mock:shadow-root>\n          <div class=\"has-menu heading-panel\">\n            <div class=\"heading-container\">\n              <div>\n                <slot name=\"top-subtitle\"></slot>\n              </div>\n              <div class=\"heading-title\">\n                <img alt=\"Logo Zanichelli\" class=\"z-logo\">\n                <slot name=\"product-logo\"></slot>\n                <slot name=\"title\"></slot>\n                <z-searchbar placeholder=\"Cerca\" preventsubmit=\"\" showsearchbutton=\"\" size=\"x-small\" value=\"\" variant=\"secondary\"></z-searchbar>\n              </div>\n            </div>\n            <div class=\"menu-container\" role=\"hidden\" tabindex=\"0\">\n              <slot name=\"menu\"></slot>\n            </div>\n          </div>\n          <z-offcanvas transitiondirection=\"right\" variant=\"overlay\">\n            <div slot=\"canvasContent\">\n              <button aria-hidden=\"true\" aria-label=\"Chiudi menu\" class=\"drawer-close\" disabled=\"\">\n                <z-icon name=\"close\"></z-icon>\n              </button>\n              <div aria-hidden=\"true\" class=\"drawer-content\">\n                <slot name=\"menu\"></slot>\n              </div>\n            </div>\n          </z-offcanvas>\n        </mock:shadow-root>\n        <h1 slot=\"title\">\n          Titolo di test\n        </h1>\n        <img alt=\"\" slot=\"product-logo\" src=\"https://picsum.photos/id/237/320/320\">\n        <z-menu floating=\"\" role=\"menuitem\" slot=\"menu\" tabindex=\"-1\">\n          <a href=\"\">\n            Menu label\n          </a>\n        </z-menu>\n        <z-menu floating=\"\" role=\"menuitem\" slot=\"menu\" tabindex=\"-1\">\n          <h3>\n            Not so short menu label\n          </h3>\n          <a href=\"\" slot=\"item\">\n            Item 1\n          </a>\n          <a href=\"\" slot=\"item\">\n            Item 2\n          </a>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 3\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 3.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 3.2\n            </a>\n          </z-menu-section>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 4\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 4.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 4.2\n            </a>\n          </z-menu-section>\n          <a href=\"\" slot=\"item\">\n            Item 5\n          </a>\n        </z-menu>\n        <z-menu floating=\"\" role=\"menuitem\" slot=\"menu\" tabindex=\"-1\">\n          <h3>\n            Not so short menu label\n          </h3>\n          <a href=\"\" slot=\"item\">\n            Item 1\n          </a>\n          <a href=\"\" slot=\"item\">\n            Item 2\n          </a>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 3\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 3.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 3.2\n            </a>\n          </z-menu-section>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 4\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 4.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 4.2\n            </a>\n          </z-menu-section>\n          <a href=\"\" slot=\"item\">\n            Item 5\n          </a>\n        </z-menu>\n        <z-menu floating=\"\" role=\"menuitem\" slot=\"menu\" tabindex=\"-1\">\n          <a href=\"\">\n            Menu label\n          </a>\n        </z-menu>\n        <z-menu floating=\"\" role=\"menuitem\" slot=\"menu\" tabindex=\"-1\">\n          <h3>\n            Not so short menu label\n          </h3>\n          <a href=\"\" slot=\"item\">\n            Item 1\n          </a>\n          <a href=\"\" slot=\"item\">\n            Item 2\n          </a>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 3\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 3.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 3.2\n            </a>\n          </z-menu-section>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 4\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 4.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 4.2\n            </a>\n          </z-menu-section>\n          <a href=\"\" slot=\"item\">\n            Item 5\n          </a>\n        </z-menu>\n        <z-menu floating=\"\" role=\"menuitem\" slot=\"menu\" tabindex=\"-1\">\n          <h3>\n            Not so short menu label\n          </h3>\n          <a href=\"\" slot=\"item\">\n            Item 1\n          </a>\n          <a href=\"\" slot=\"item\">\n            Item 2\n          </a>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 3\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 3.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 3.2\n            </a>\n          </z-menu-section>\n          <z-menu-section slot=\"item\">\n            <h3>\n              Item 4\n            </h3>\n            <a href=\"\" slot=\"section\">\n              Item 4.1\n            </a>\n            <a href=\"\" slot=\"section\">\n              Item 4.2\n            </a>\n          </z-menu-section>\n          <a href=\"\" slot=\"item\">\n            Item 5\n          </a>\n        </z-menu>\n      </z-app-header>\n    `);\n  });\n});\n"]}