npm - @mgdis/mg-components - Versions diffs - 5.18.0 → 5.19.1 - Mend

@mgdis/mg-components 5.18.0 → 5.19.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (358) hide show

package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.e2e.playwright.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"mg-input-title.e2e.playwright.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-input-title/test/mg-input-title.e2e.playwright.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAY,MAAM,6CAA6C,CAAC;AAEnH,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,mBAAmB,gBAAgB,iCAAM,IAAI,KAAE,UAAU,EAAE,YAAY,IAAG,yBAAyB,CAAC;AAE/H,MAAM,OAAO,GAAG,IAAI,CAAC;AAErB,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;EAC9B,QAAQ,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAC/I,kBAAkB,EAClB,KAAK,EAAE,IAAc,EAAE,IAAI,EAAE,EAAE;IAC7B,MAAM,cAAc,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;IAE7C,MAAM,IAAI,CAAC,OAAO,CAAC,yBAAyB,CAAC,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC;IAE5E,MAAM,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC;EACnE,CAAC,CACF,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import { renderAttributes } from '../../../../utils/e2e.test.utils';\nimport { setPageContent, describe, testEach, expect, PageType } from '../../../../utils/playwright.e2e.test.utils';\n\nconst createHtml = args => `<mg-input-title ${renderAttributes({ ...args, identifier: 'identifier' })}>Label</mg-input-title>`;\n\nconst TIMEOUT = 1000;\n\ndescribe('mg-input-title', () => {\n testEach([true, false].flatMap(isLegend => [true, false].flatMap(required => [true, false].map(readonly => ({ isLegend, required, readonly })))))(\n 'Should render %s',\n async (page: PageType, args) => {\n await setPageContent(page, createHtml(args));\n\n await page.locator('mg-input-title.hydrated').waitFor({ timeout: TIMEOUT });\n\n await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();\n },\n );\n});\n"]}

package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.spec.js CHANGED Viewed

@@ -6,11 +6,7 @@ const getPage = args => newSpecPage({
   template: () => h("mg-input-title", Object.assign({}, args), "mg-input-title"),
 });
 describe('mg-input-title', () => {
-  test.each([
-    { required: false, identifier: 'identifier' },
-    { required: true, identifier: 'identifier' },
-    { isLegend: true, identifier: 'identifier' },
-  ])('Should render label with args %s', async (args) => {
+  test.each([true, false].flatMap(isLegend => [true, false].flatMap(required => [true, false].map(readonly => ({ isLegend, required, readonly, identifier: 'identifier' })))))('Should render label with args %s', async (args) => {
     const { root } = await getPage(args);
     expect(root).toMatchSnapshot();
   });

package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-input-title.spec.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-input-title/test/mg-input-title.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,CACrB,WAAW,CAAC;EACV,UAAU,EAAE,CAAC,YAAY,CAAC;EAC1B,QAAQ,EAAE,GAAG,EAAE,CAAC,sCAAoB,IAAI,oBAAiC;CAC1E,CAAC,CAAC;AAEL,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;EAC9B,IAAI,CAAC,IAAI,CAAC~~;IACR~~,~~EAAE~~,~~QAAQ~~,EAAE,KAAK,~~EAAE~~,~~UAAU~~,~~EAAE~~,~~YAAY~~,EAAE~~;IAC7C~~,EAAE,QAAQ,EAAE,IAAI,EAAE,~~UAAU~~,EAAE,~~YAAY~~,EAAE~~;IAC5C~~,EAAE,QAAQ,EAAE,~~IAAI~~,EAAE,UAAU,EAAE,YAAY,EAAE~~;GAC7C~~,CAAC,CAAC,kCAAkC,~~EAAE~~,KAAK,EAAC,IAAI,EAAC,EAAE;~~IAClD~~,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;EACjC,CAAC,~~CAAC~~,CAAC;~~EAEH~~,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,kDAAkD,EAAE,KAAK,EAAC,UAAU,EAAC,EAAE;IACrG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACrB,IAAI;MACF,MAAM,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;KAC/B;IAAC,OAAO,GAAG,EAAE;MACZ,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,iDAAiD,CAAC,CAAC;KAClF;EACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgInputTitle } from '../mg-input-title';\n\nconst getPage = args =>\n newSpecPage({\n components: [MgInputTitle],\n template: () => <mg-input-title {...args}>mg-input-title</mg-input-title>,\n });\n\ndescribe('mg-input-title', () => {\n test.each([~~\n {~~ ~~required:~~ false, ~~identifier:~~ ~~'identifier'~~ ~~},\n {~~ required: true, ~~identifier:~~ ~~'identifier'~~ ~~},\n~~ { isLegend: ~~true~~, identifier: 'identifier' }~~,\n ]~~)('Should render label with args %s', async args => {\n const { root } = await getPage(args);\n expect(root).toMatchSnapshot();\n });\n\n test.each(['', ' ', undefined])('Should throw error, case invalid identifier prop', async identifier => {\n expect.assertions(1);\n try {\n await getPage({ identifier });\n } catch (err) {\n expect(err.message).toContain('<mg-input-title> prop \"identifier\" is required.');\n }\n });\n});\n"]}
1	+ {"version":3,"file":"mg-input-title.spec.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-input-title/test/mg-input-title.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,CACrB,WAAW,CAAC;EACV,UAAU,EAAE,CAAC,YAAY,CAAC;EAC1B,QAAQ,EAAE,GAAG,EAAE,CAAC,sCAAoB,IAAI,oBAAiC;CAC1E,CAAC,CAAC;AAEL,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;EAC9B,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAC1K,kCAAkC,EAClC,KAAK,EAAC,IAAI,EAAC,EAAE;IACX,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;EACjC,CAAC,CACF,CAAC;EAEF,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,kDAAkD,EAAE,KAAK,EAAC,UAAU,EAAC,EAAE;IACrG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACrB,IAAI;MACF,MAAM,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;KAC/B;IAAC,OAAO,GAAG,EAAE;MACZ,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,iDAAiD,CAAC,CAAC;KAClF;EACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgInputTitle } from '../mg-input-title';\n\nconst getPage = args =>\n newSpecPage({\n components: [MgInputTitle],\n template: () => <mg-input-title {...args}>mg-input-title</mg-input-title>,\n });\n\ndescribe('mg-input-title', () => {\n test.each([true, false].flatMap(isLegend => [true, false].flatMap(required => [true, false].map(readonly => ({ isLegend, required, readonly, identifier: 'identifier' })))))(\n 'Should render label with args %s',\n async args => {\n const { root } = await getPage(args);\n expect(root).toMatchSnapshot();\n },\n );\n\n test.each(['', ' ', undefined])('Should throw error, case invalid identifier prop', async identifier => {\n expect.assertions(1);\n try {\n await getPage({ identifier });\n } catch (err) {\n expect(err.message).toContain('<mg-input-title> prop \"identifier\" is required.');\n }\n });\n});\n"]}

package/dist/collection/components/atoms/mg-tag/mg-tag.js CHANGED Viewed

@@ -1,18 +1,18 @@
 import { h } from "@stencil/core";
 import { variants } from "./mg-tag.conf";
-import { ClassList } from "../../../utils/components.utils";
+import { ClassList, isValidString } from "../../../utils/components.utils";
 export class MgTag {
   constructor() {
     /************
      * Internal *
      ************/
     // Classes
-    this.classOutline = 'mg-tag--outline';
-    this.classSoft = 'mg-tag--soft';
+    this.classOutline = 'mg-c-tag--outline';
+    this.classSoft = 'mg-c-tag--soft';
     this.variant = variants[0];
     this.outline = undefined;
     this.soft = undefined;
-    this.classCollection = new ClassList(['mg-tag']);
+    this.classCollection = new ClassList(['mg-c-tag']);
   }
   validateVariant(newValue, oldValue) {
     if (!variants.includes(newValue)) {
@@ -20,9 +20,9 @@ export class MgTag {
     }
     else {
       if (oldValue !== undefined) {
-        this.classCollection.delete(`mg-tag--${oldValue}`);
+        this.classCollection.delete(`mg-c-tag--${oldValue}`);
       }
-      this.classCollection.add(`mg-tag--${newValue}`);
+      this.classCollection.add(`mg-c-tag--${newValue}`);
     }
   }
   validateOutline(newValue) {
@@ -49,7 +49,7 @@ export class MgTag {
    * @param textContent - html element textContent property
    */
   validateTextContent(textContent) {
-    if (typeof textContent !== 'string' || textContent.trim() === '')
+    if (!isValidString(textContent))
       throw new Error('<mg-tag> slot must contain a text content.');
   }
   /*************
@@ -75,12 +75,12 @@ export class MgTag {
   static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() {
     return {
-      "$": ["mg-tag.scss"]
+      "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-tag.css"]
     };
   }
   static get styleUrls() {
     return {
-      "$": ["mg-tag.css"]
+      "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-tag.css"]
     };
   }
   static get properties() {

package/dist/collection/components/atoms/mg-tag/mg-tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tag.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tag/mg-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAkB,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;~~AAM5D~~,MAAM,OAAO,KAAK;;IAChB;;kBAEc;IAEd,UAAU;IACO,iBAAY,GAAG,~~iBAAiB~~,CAAC;~~IACjC~~,cAAS,GAAG,~~cAAc~~,CAAC;~~mBAcV~~,QAAQ,CAAC,CAAC,CAAC;;;2BAwCP,IAAI,SAAS,CAAC,CAAC,~~QAAQ~~,CAAC,CAAC;;~~EAtC/D~~,eAAe,CAAC,QAA0B,EAAE,QAA2B;IACrE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;MAChC,MAAM,IAAI,KAAK,CAAC,2CAA2C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACpF;SAAM;MACL,IAAI,QAAQ,KAAK,SAAS,EAAE;QAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,~~WAAW~~,QAAQ,EAAE,CAAC,CAAC;~~OACpD~~;MACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,~~WAAW~~,QAAQ,EAAE,CAAC,CAAC;~~KACjD~~;EACH,CAAC;EAOD,eAAe,CAAC,QAA0B;IACxC,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;MACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EACtD,CAAC;EAOD,YAAY,CAAC,QAAuB;IAClC,mBAAmB;IACnB,IAAI,QAAQ,IAAI,IAAI,CAAC,OAAO;MAAE,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAC;IAE3G,cAAc;IACd,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;;MAClD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;EACnD,CAAC;EAOD;;iBAEe;EAEf;;;KAGG;EACK,mBAAmB,CAAC,WAAmB;IAC7C,IAAI,~~OAAO~~,~~WAAW~~,~~KAAK~~,~~QAAQ,IAAI,~~WAAW,CAAC~~,IAAI,EAAE,KAAK,EAAE~~;MAAE,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAC;~~EAClI~~,CAAC;EAED;;iBAEe;EAEf;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC7B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EACrD,CAAC;EAED;;;KAGG;EACH,MAAM;IACJ,OAAO,CACL,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;MACtC,eAAa,CACR,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch, Element } from '@stencil/core';\nimport { TagVariantType, variants } from './mg-tag.conf';\nimport { ClassList } from '../../../utils/components.utils';\n@Component({\n tag: 'mg-tag',\n styleUrl: 'mg-tag.~~scss~~',\n shadow: true,\n})\nexport class MgTag {\n /***********\n Internal \n *********/\n\n // Classes\n private readonly classOutline = 'mg-tag--outline';\n private readonly classSoft = 'mg-tag--soft';\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTagElement;\n\n /\n Define tag variant\n /\n @Prop() variant: TagVariantType = variants[0]; // primary\n @Watch('variant')\n validateVariant(newValue: MgTag['variant'], oldValue?: MgTag['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-tag> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-tag--${oldValue}`);\n }\n this.classCollection.add(`mg-tag--${newValue}`);\n }\n }\n\n /\n Define if tag is using outline style\n /\n @Prop() outline: boolean;\n @Watch('outline')\n validateOutline(newValue: MgTag['outline']): void {\n if (newValue) this.classCollection.add(this.classOutline);\n else this.classCollection.delete(this.classOutline);\n }\n\n /\n Define if tag is using soft style\n /\n @Prop() soft: boolean;\n @Watch('soft')\n validateSoft(newValue: MgTag['soft']): void {\n // usage validation\n if (newValue && this.outline) throw new Error('<mg-tag> prop \"soft\" can NOT be used with prop \"outline\".');\n\n // apply class\n if (newValue) this.classCollection.add(this.classSoft);\n else this.classCollection.delete(this.classSoft);\n }\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-tag']);\n\n /***********\n Methods \n **********/\n\n /\n * Validate the given textContent\n * @param textContent - html element textContent property\n /\n private validateTextContent(textContent: string): void {\n if (~~typeof~~ textContent ~~!== 'string' \|\| textContent.trim(~~) ~~=== ''~~) throw new Error('<mg-tag> slot must contain a text content.');\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if props are well configured on init\n /\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateOutline(this.outline);\n this.validateSoft(this.soft);\n this.validateTextContent(this.element.textContent);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <span class={this.classCollection.join()}>\n <slot></slot>\n </span>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-tag.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tag/mg-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAkB,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAM3E,MAAM,OAAO,KAAK;;IAChB;;kBAEc;IAEd,UAAU;IACO,iBAAY,GAAG,mBAAmB,CAAC;IACnC,cAAS,GAAG,gBAAgB,CAAC;mBAcZ,QAAQ,CAAC,CAAC,CAAC;;;2BAwCP,IAAI,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC;;EAtCjE,eAAe,CAAC,QAA0B,EAAE,QAA2B;IACrE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;MAChC,MAAM,IAAI,KAAK,CAAC,2CAA2C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACpF;SAAM;MACL,IAAI,QAAQ,KAAK,SAAS,EAAE;QAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,aAAa,QAAQ,EAAE,CAAC,CAAC;OACtD;MACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,aAAa,QAAQ,EAAE,CAAC,CAAC;KACnD;EACH,CAAC;EAOD,eAAe,CAAC,QAA0B;IACxC,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;MACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EACtD,CAAC;EAOD,YAAY,CAAC,QAAuB;IAClC,mBAAmB;IACnB,IAAI,QAAQ,IAAI,IAAI,CAAC,OAAO;MAAE,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAC;IAE3G,cAAc;IACd,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;;MAClD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;EACnD,CAAC;EAOD;;iBAEe;EAEf;;;KAGG;EACK,mBAAmB,CAAC,WAAmB;IAC7C,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC;MAAE,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAC;EACjG,CAAC;EAED;;iBAEe;EAEf;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC7B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EACrD,CAAC;EAED;;;KAGG;EACH,MAAM;IACJ,OAAO,CACL,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;MACtC,eAAa,CACR,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch, Element } from '@stencil/core';\nimport { TagVariantType, variants } from './mg-tag.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\n@Component({\n tag: 'mg-tag',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tag.css',\n shadow: true,\n})\nexport class MgTag {\n /***********\n Internal \n *********/\n\n // Classes\n private readonly classOutline = 'mg-c-tag--outline';\n private readonly classSoft = 'mg-c-tag--soft';\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTagElement;\n\n /\n Define tag variant\n /\n @Prop() variant: TagVariantType = variants[0]; // primary\n @Watch('variant')\n validateVariant(newValue: MgTag['variant'], oldValue?: MgTag['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-tag> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-tag--${oldValue}`);\n }\n this.classCollection.add(`mg-c-tag--${newValue}`);\n }\n }\n\n /\n Define if tag is using outline style\n /\n @Prop() outline: boolean;\n @Watch('outline')\n validateOutline(newValue: MgTag['outline']): void {\n if (newValue) this.classCollection.add(this.classOutline);\n else this.classCollection.delete(this.classOutline);\n }\n\n /\n Define if tag is using soft style\n /\n @Prop() soft: boolean;\n @Watch('soft')\n validateSoft(newValue: MgTag['soft']): void {\n // usage validation\n if (newValue && this.outline) throw new Error('<mg-tag> prop \"soft\" can NOT be used with prop \"outline\".');\n\n // apply class\n if (newValue) this.classCollection.add(this.classSoft);\n else this.classCollection.delete(this.classSoft);\n }\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-tag']);\n\n /***********\n Methods \n **********/\n\n /\n * Validate the given textContent\n * @param textContent - html element textContent property\n /\n private validateTextContent(textContent: string): void {\n if (!isValidString(textContent)) throw new Error('<mg-tag> slot must contain a text content.');\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if props are well configured on init\n /\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateOutline(this.outline);\n this.validateSoft(this.soft);\n this.validateTextContent(this.element.textContent);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <span class={this.classCollection.join()}>\n <slot></slot>\n </span>\n );\n }\n}\n"]}

package/dist/collection/components/atoms/mg-tag/test/mg-tag.e2e.playwright.js ADDED Viewed

@@ -0,0 +1,23 @@
+import { darkBackground, renderAttributes } from "../../../../utils/e2e.test.utils";
+import { describe, expect, setPageContent, test, testEach } from "../../../../utils/playwright.e2e.test.utils";
+import { variants } from "../mg-tag.conf";
+describe('mg-tag', () => {
+  testEach(variants.flatMap(variant => [true, false].flatMap(icon => [
+    { outline: false, soft: false },
+    { outline: true, soft: false },
+    { outline: false, soft: true },
+  ].map(({ outline, soft }) => darkBackground(variant === 'secondary', `<mg-tag style="margin: 0.2rem;" ${renderAttributes({ variant, outline, soft })}>${icon ? `<mg-icon ${renderAttributes({ icon: 'user', size: 'small' })}></mg-icon>` : ''}${variant}</mg-tag>`)))))('Should render %s', async (page, html) => {
+    await setPageContent(page, html);
+    await page.locator('mg-tag.hydrated').waitFor({ timeout: 1000 });
+    await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();
+  });
+  test('Should render a 2 lines tag', async ({ page }) => {
+    await setPageContent(page, `<mg-tag>Tag with a<br> two lines text</mg-tag>`);
+    await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();
+  });
+  test('Should render a tag in a paragraph', async ({ page }) => {
+    await setPageContent(page, `<p>This is a <mg-tag>tag</mg-tag> in a paragraph.</p>`);
+    await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();
+  });
+});
+//# sourceMappingURL=mg-tag.e2e.playwright.js.map

package/dist/collection/components/atoms/mg-tag/test/mg-tag.e2e.playwright.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"mg-tag.e2e.playwright.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tag/test/mg-tag.e2e.playwright.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpF,OAAO,EAAY,QAAQ,EAAE,MAAM,EAAE,cAAc,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAC;AACzH,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE1C,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;EACtB,QAAQ,CACN,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CACzB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAC3B;IACE,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE;IAC/B,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE;IAC9B,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE;GAC/B,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,CAC1B,cAAc,CACZ,OAAO,KAAK,WAAW,EACvB,mCAAmC,gBAAgB,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,IAC7E,IAAI,CAAC,CAAC,CAAC,YAAY,gBAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,EACtF,GAAG,OAAO,WAAW,CACtB,CACF,CACF,CACF,CACF,CAAC,kBAAkB,EAAE,KAAK,EAAE,IAAc,EAAE,IAAY,EAAE,EAAE;IAC3D,MAAM,cAAc,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAEjC,MAAM,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAEjE,MAAM,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC;EACnE,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,6BAA6B,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;IACrD,MAAM,cAAc,CAAC,IAAI,EAAE,gDAAgD,CAAC,CAAC;IAE7E,MAAM,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC;EACnE,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,oCAAoC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;IAC5D,MAAM,cAAc,CAAC,IAAI,EAAE,uDAAuD,CAAC,CAAC;IAEpF,MAAM,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC;EACnE,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { darkBackground, renderAttributes } from '../../../../utils/e2e.test.utils';\nimport { PageType, describe, expect, setPageContent, test, testEach } from '../../../../utils/playwright.e2e.test.utils';\nimport { variants } from '../mg-tag.conf';\n\ndescribe('mg-tag', () => {\n testEach(\n variants.flatMap(variant =>\n [true, false].flatMap(icon =>\n [\n { outline: false, soft: false },\n { outline: true, soft: false },\n { outline: false, soft: true },\n ].map(({ outline, soft }) =>\n darkBackground(\n variant === 'secondary',\n `<mg-tag style=\"margin: 0.2rem;\" ${renderAttributes({ variant, outline, soft })}>${\n icon ? `<mg-icon ${renderAttributes({ icon: 'user', size: 'small' })}></mg-icon>` : ''\n }${variant}</mg-tag>`,\n ),\n ),\n ),\n ),\n )('Should render %s', async (page: PageType, html: string) => {\n await setPageContent(page, html);\n\n await page.locator('mg-tag.hydrated').waitFor({ timeout: 1000 });\n\n await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();\n });\n\n test('Should render a 2 lines tag', async ({ page }) => {\n await setPageContent(page, `<mg-tag>Tag with a<br> two lines text</mg-tag>`);\n\n await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();\n });\n\n test('Should render a tag in a paragraph', async ({ page }) => {\n await setPageContent(page, `<p>This is a <mg-tag>tag</mg-tag> in a paragraph.</p>`);\n\n await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();\n });\n});\n"]}

package/dist/collection/components/atoms/mg-tag/test/mg-tag.spec.js CHANGED Viewed

@@ -20,21 +20,21 @@ describe('mg-tag', () => {
   test('Should replace classes on variant/ouline changes', async () => {
     const page = await getPage({}, 'Blu');
     const element = page.doc.querySelector('mg-tag');
-    let classPrimary = element.shadowRoot.querySelector('.mg-tag--primary');
-    let classOutline = element.shadowRoot.querySelector('.mg-tag--outline');
+    let classPrimary = element.shadowRoot.querySelector('.mg-c-tag--primary');
+    let classOutline = element.shadowRoot.querySelector('.mg-c-tag--outline');
     expect(classPrimary).not.toBeNull();
     expect(classOutline).toBeNull();
     // Change variant
     element.variant = 'danger';
     await page.waitForChanges();
-    classPrimary = element.shadowRoot.querySelector('.mg-tag--primary');
-    const classDanger = element.shadowRoot.querySelector('.mg-tag--danger');
+    classPrimary = element.shadowRoot.querySelector('.mg-c-tag--primary');
+    const classDanger = element.shadowRoot.querySelector('.mg-c-tag--danger');
     expect(classPrimary).toBeNull();
     expect(classDanger).not.toBeNull();
     // Change outline
     element.outline = true;
     await page.waitForChanges();
-    classOutline = element.shadowRoot.querySelector('.mg-tag--outline');
+    classOutline = element.shadowRoot.querySelector('.mg-c-tag--outline');
     expect(classOutline).not.toBeNull();
   });
   describe('errors', () => {

package/dist/collection/components/atoms/mg-tag/test/mg-tag.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tag.spec.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tag/test/mg-tag.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE1C,MAAM,OAAO,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,CAC7B,WAAW,CAAC;EACV,UAAU,EAAE,CAAC,KAAK,CAAC;EACnB,QAAQ,EAAE,GAAG,EAAE,CAAC,8BAAY,IAAI,GAAG,IAAI,CAAU;CAClD,CAAC,CAAC;AAEL,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;EACtB,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,YAAY,EAAE,OAAO,CAAC,EAAE;IAC9C,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,YAAY,EAAE,KAAK,EAAC,OAAO,EAAC,EAAE;MACrD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,OAAO,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,CAAC,CAAC;MAC9D,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,EAAC,IAAI,EAAC,EAAE;MAC/C,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,OAAO,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,OAAO,CAAC,CAAC;MAC3D,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,kDAAkD,EAAE,KAAK,IAAI,EAAE;IAClE,MAAM,IAAI,GAAG,MAAM,OAAO,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;IACtC,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjD,IAAI,YAAY,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,~~kBAAkB~~,CAAC,CAAC;~~IACxE~~,IAAI,YAAY,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,~~kBAAkB~~,CAAC,CAAC;~~IAExE~~,MAAM,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;IACpC,MAAM,CAAC,YAAY,CAAC,CAAC,QAAQ,EAAE,CAAC;IAEhC,iBAAiB;IACjB,OAAO,CAAC,OAAO,GAAG,QAAQ,CAAC;IAC3B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,YAAY,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,~~kBAAkB~~,CAAC,CAAC;~~IACpE~~,MAAM,WAAW,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,~~iBAAiB~~,CAAC,CAAC;~~IAExE~~,MAAM,CAAC,YAAY,CAAC,CAAC,QAAQ,EAAE,CAAC;IAChC,MAAM,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;IAEnC,iBAAiB;IACjB,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;IACvB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,YAAY,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,~~kBAAkB~~,CAAC,CAAC;~~IACpE~~,MAAM,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;EACtC,CAAC,CAAC,CAAC;EAEH,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;IACtB,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC,CAAC,wCAAwC,EAAE,KAAK,EAAC,OAAO,EAAC,EAAE;MAC/E,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;MACrB,IAAI;QACF,MAAM,OAAO,CAAC,EAAE,OAAO,EAAE,EAAE,eAAe,CAAC,CAAC;OAC7C;MAAC,OAAO,GAAG,EAAE;QACZ,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,0CAA0C,CAAC,CAAC;OAC3E;IACH,CAAC,CAAC,CAAC;IACH,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,CAAC,qCAAqC,EAAE,KAAK,EAAC,IAAI,EAAC,EAAE;MAC9E,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;MACrB,IAAI;QACF,MAAM,OAAO,CAAC,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;OAC/C;MAAC,OAAO,GAAG,EAAE;QACZ,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,4CAA4C,CAAC,CAAC;OACxE;IACH,CAAC,CAAC,CAAC;IACH,IAAI,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;MACrD,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;MAC5B,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;MACrB,IAAI;QACF,MAAM,OAAO,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,OAAO,CAAC,CAAC;OAChE;MAAC,OAAO,GAAG,EAAE;QACZ,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,2DAA2D,CAAC,CAAC;OACvF;IACH,CAAC,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgTag } from '../mg-tag';\nimport { variants } from '../mg-tag.conf';\n\nconst getPage = (args, slot) =>\n newSpecPage({\n components: [MgTag],\n template: () => <mg-tag {...args}>{slot}</mg-tag>,\n });\n\ndescribe('mg-tag', () => {\n describe.each(variants)('variant %s', variant => {\n test.each([true, false])('outline %s', async outline => {\n const { root } = await getPage({ variant, outline }, variant);\n expect(root).toMatchSnapshot();\n });\n\n test.each([true, false])('soft %s', async soft => {\n const { root } = await getPage({ variant, soft }, variant);\n expect(root).toMatchSnapshot();\n });\n });\n\n test('Should replace classes on variant/ouline changes', async () => {\n const page = await getPage({}, 'Blu');\n const element = page.doc.querySelector('mg-tag');\n let classPrimary = element.shadowRoot.querySelector('.mg-tag--primary');\n let classOutline = element.shadowRoot.querySelector('.mg-tag--outline');\n\n expect(classPrimary).not.toBeNull();\n expect(classOutline).toBeNull();\n\n // Change variant\n element.variant = 'danger';\n await page.waitForChanges();\n\n classPrimary = element.shadowRoot.querySelector('.mg-tag--primary');\n const classDanger = element.shadowRoot.querySelector('.mg-tag--danger');\n\n expect(classPrimary).toBeNull();\n expect(classDanger).not.toBeNull();\n\n // Change outline\n element.outline = true;\n await page.waitForChanges();\n\n classOutline = element.shadowRoot.querySelector('.mg-tag--outline');\n expect(classOutline).not.toBeNull();\n });\n\n describe('errors', () => {\n test.each(['', 'blu'])('Should throw error, case wrong variant', async variant => {\n expect.assertions(1);\n try {\n await getPage({ variant }, 'wrong variant');\n } catch (err) {\n expect(err.message).toContain('<mg-tag> prop \"variant\" must be one of: ');\n }\n });\n test.each([undefined, ' '])('Should throw error, case empty slot', async slot => {\n expect.assertions(1);\n try {\n await getPage({ variant: variants[0] }, slot);\n } catch (err) {\n expect(err.message).toBe('<mg-tag> slot must contain a text content.');\n }\n });\n test('Should throw error, case empty slot', async () => {\n const variant = variants[0];\n expect.assertions(1);\n try {\n await getPage({ variant, outline: true, soft: true }, variant);\n } catch (err) {\n expect(err.message).toBe('<mg-tag> prop \"soft\" can NOT be used with prop \"outline\".');\n }\n });\n });\n});\n"]}
1	+ {"version":3,"file":"mg-tag.spec.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tag/test/mg-tag.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgTag } from '../mg-tag';\nimport { variants } from '../mg-tag.conf';\n\nconst getPage = (args, slot) =>\n newSpecPage({\n components: [MgTag],\n template: () => <mg-tag {...args}>{slot}</mg-tag>,\n });\n\ndescribe('mg-tag', () => {\n describe.each(variants)('variant %s', variant => {\n test.each([true, false])('outline %s', async outline => {\n const { root } = await getPage({ variant, outline }, variant);\n expect(root).toMatchSnapshot();\n });\n\n test.each([true, false])('soft %s', async soft => {\n const { root } = await getPage({ variant, soft }, variant);\n expect(root).toMatchSnapshot();\n });\n });\n\n test('Should replace classes on variant/ouline changes', async () => {\n const page = await getPage({}, 'Blu');\n const element = page.doc.querySelector('mg-tag');\n let classPrimary = element.shadowRoot.querySelector('.mg-c-tag--primary');\n let classOutline = element.shadowRoot.querySelector('.mg-c-tag--outline');\n\n expect(classPrimary).not.toBeNull();\n expect(classOutline).toBeNull();\n\n // Change variant\n element.variant = 'danger';\n await page.waitForChanges();\n\n classPrimary = element.shadowRoot.querySelector('.mg-c-tag--primary');\n const classDanger = element.shadowRoot.querySelector('.mg-c-tag--danger');\n\n expect(classPrimary).toBeNull();\n expect(classDanger).not.toBeNull();\n\n // Change outline\n element.outline = true;\n await page.waitForChanges();\n\n classOutline = element.shadowRoot.querySelector('.mg-c-tag--outline');\n expect(classOutline).not.toBeNull();\n });\n\n describe('errors', () => {\n test.each(['', 'blu'])('Should throw error, case wrong variant', async variant => {\n expect.assertions(1);\n try {\n await getPage({ variant }, 'wrong variant');\n } catch (err) {\n expect(err.message).toContain('<mg-tag> prop \"variant\" must be one of: ');\n }\n });\n test.each([undefined, ' '])('Should throw error, case empty slot', async slot => {\n expect.assertions(1);\n try {\n await getPage({ variant: variants[0] }, slot);\n } catch (err) {\n expect(err.message).toBe('<mg-tag> slot must contain a text content.');\n }\n });\n test('Should throw error, case empty slot', async () => {\n const variant = variants[0];\n expect.assertions(1);\n try {\n await getPage({ variant, outline: true, soft: true }, variant);\n } catch (err) {\n expect(err.message).toBe('<mg-tag> prop \"soft\" can NOT be used with prop \"outline\".');\n }\n });\n });\n});\n"]}

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js CHANGED Viewed

@@ -17,12 +17,12 @@ export class MgTooltipContent {
   static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() {
     return {
-      "$": ["mg-tooltip-content.scss"]
+      "$": ["../../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip-content.css"]
     };
   }
   static get styleUrls() {
     return {
-      "$": ["mg-tooltip-content.css"]
+      "$": ["../../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip-content.css"]
     };
   }
   static get properties() {

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tooltip-content.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,gBAAgB;;;;EAM3B;;iBAEe;EAEf;;;KAGG;EACH,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IAAC,IAAI,EAAC,SAAS;MAClB,YAAM,SAAS,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAC,6BAA6B,GAAQ;MAC1E,YAAM,IAAI,EAAC,OAAO,GAAQ,CACrB,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'mg-tooltip-content',\n styleUrl: 'mg-tooltip-content.~~scss~~',\n shadow: true,\n})\nexport class MgTooltipContent {\n /*\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n\n /***********\n Lifecycle \n **********/\n\n /\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"tooltip\">\n <span innerHTML={this.message} class=\"mg-tooltip-content__message\"></span>\n <slot name=\"arrow\"></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-tooltip-content.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,gBAAgB;;;;EAM3B;;iBAEe;EAEf;;;KAGG;EACH,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IAAC,IAAI,EAAC,SAAS;MAClB,YAAM,SAAS,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAC,6BAA6B,GAAQ;MAC1E,YAAM,IAAI,EAAC,OAAO,GAAQ,CACrB,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'mg-tooltip-content',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip-content.css',\n shadow: true,\n})\nexport class MgTooltipContent {\n /*\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n\n /***********\n Lifecycle \n **********/\n\n /\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"tooltip\">\n <span innerHTML={this.message} class=\"mg-tooltip-content__message\"></span>\n <slot name=\"arrow\"></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { h, Host } from "@stencil/core";
-import { createID, focusableElements, getWindows } from "../../../utils/components.utils";
+import { createID, focusableElements, getWindows, isValidString } from "../../../utils/components.utils";
 import { createPopper } from "@popperjs/core";
 import { Guard } from "./mg-tooltip.conf";
 /**
@@ -102,12 +102,12 @@ export class MgTooltip {
     this.setMgButtonWrapper = (mgButton) => {
       if (mgButton.disabled) {
         const div = document.createElement('div');
-        div.classList.add('mg-tooltip__mg-button-wrapper');
+        div.classList.add('mg-c-tooltip__mg-button-wrapper');
         mgButton.parentNode.insertBefore(div, mgButton);
         div.appendChild(mgButton);
         this.tooltipedElement = div;
       }
-      else if (mgButton.parentElement.classList.contains('mg-tooltip__mg-button-wrapper')) {
+      else if (mgButton.parentElement.classList.contains('mg-c-tooltip__mg-button-wrapper')) {
         this.element.firstElementChild.replaceWith(mgButton);
         this.tooltipedElement = mgButton;
       }
@@ -119,7 +119,7 @@ export class MgTooltip {
      */
     this.initTooltip = (slotElement, interactiveElement) => {
       // Add tabindex to slotted element if we can't find any interactive element
-      if (!this.disabled && !Boolean(interactiveElement)) {
+      if (!this.disabled && !interactiveElement) {
         this.hasCustomTabIndex = true;
         slotElement.tabIndex = 0;
         // Add role on non-interactive element to work with "aria-describedby" for screen readers
@@ -193,7 +193,7 @@ export class MgTooltip {
     this.renderTooltipContent();
   }
   validateMessage(newValue) {
-    if (typeof newValue !== 'string' || newValue.trim() === '') {
+    if (!isValidString(newValue)) {
       throw new Error('<mg-tooltip> prop "message" is required.');
     }
     this.mgTooltipContent.message = newValue;
@@ -299,12 +299,12 @@ export class MgTooltip {
   static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() {
     return {
-      "$": ["mg-tooltip.scss"]
+      "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip.css"]
     };
   }
   static get styleUrls() {
     return {
-      "$": ["mg-tooltip.css"]
+      "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip.css"]
     };
   }
   static get properties() {

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tooltip.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tooltip/mg-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\nimport { createID, focusableElements, getWindows } from '../../../utils/components.utils';\nimport { Instance as PopperInstance, createPopper, Placement } from '@popperjs/core';\nimport { Guard } from './mg-tooltip.conf';\n\n/*\n HTMLMgButtonElement type guard\n * @param element - element to check\n * @returns return true if type is HTMLMgButtonElement\n /\nconst isButton = (element: unknown): element is HTMLMgButtonElement => typeof element === 'object' && ['MG-BUTTON', 'BUTTON'].includes((element as Element).tagName);\n\n@Component({\n tag: 'mg-tooltip',\n styleUrl: 'mg-tooltip.scss',\n shadow: true,\n})\nexport class MgTooltip {\n /**********\n Internal \n *********/\n\n private popper: PopperInstance;\n private mgTooltipContent: HTMLMgTooltipContentElement;\n private tooltipedElement: HTMLElement;\n private windows: Window[];\n private hasCustomTabIndex: boolean;\n\n // tooltip actions guards\n private guard: Guard;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTooltipElement;\n\n /\n Sets an `id` attribute.\n * Needed by the input for accessibility `aria-decribedby`.\n /\n @Prop() identifier: string = createID('mg-tooltip');\n @Watch('identifier')\n validateIdentifier(): void {\n // use renderTooltipContent to update tooltip-content id\n this.renderTooltipContent();\n }\n\n /\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n @Watch('message')\n validateMessage(newValue: string): void {\n if (typeof newValue !== 'string' \|\| newValue.trim() === '') {\n throw new Error('<mg-tooltip> prop \"message\" is required.');\n }\n this.mgTooltipContent.message = newValue;\n }\n\n /\n Tooltip placement\n /\n @Prop() placement: Placement = 'bottom';\n\n /\n Display tooltip\n /\n @Prop({ mutable: true }) display = false;\n @Watch('display')\n handleDisplay(newValue: boolean): void {\n if (newValue) {\n this.show();\n } else {\n this.hide();\n }\n }\n\n /\n Disable tooltip\n /\n @Prop() disabled = false;\n @Watch('disabled')\n validateDisabled(newValue: MgTooltip['disabled']): void {\n if (this.hasCustomTabIndex) {\n if (newValue) this.tooltipedElement.removeAttribute('tabindex');\n else if (this.tooltipedElement.getAttribute('tabindex') === null) this.tooltipedElement.setAttribute('tabindex', '0');\n }\n }\n\n /\n Show tooltip\n /\n private show = (): void => {\n // Make the tooltip visible\n this.mgTooltipContent.dataset.show = '';\n // Enable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: true }],\n }));\n // hide when click outside\n // setTimeout is used to prevent event to trigger after creation\n setTimeout(() => {\n this.windows.forEach((localWindow: Window) => {\n localWindow.addEventListener('click', this.clickOutside, false);\n localWindow.addEventListener('keydown', this.pressEscape, false);\n });\n }, 0);\n };\n\n /\n Hide tooltip\n /\n private hide = (): void => {\n // Hide the tooltip\n this.mgTooltipContent.removeAttribute('data-show');\n // Disable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: false }],\n }));\n // Remove event listener\n this.windows.forEach((localWindow: Window) => {\n localWindow.removeEventListener('click', this.clickOutside, false);\n localWindow.removeEventListener('keyboard', this.pressEscape, false);\n });\n };\n\n /\n Check if clicked outside of component and hidde tooltip\n * @param event - mouse event\n /\n private clickOutside = (event: MouseEvent & { target: HTMLElement }): void => {\n if (event.target.closest('mg-tooltip') !== this.element) this.setDisplay(false);\n };\n\n /\n Check if 'Escape' key is pressed of component and hidde tooltip\n * @param event - keyboard event\n /\n private pressEscape = (event: KeyboardEvent): void => {\n if (event.code === 'Escape') {\n this.setDisplay(false);\n this.resetGuard();\n }\n };\n\n /\n Method to set display prop\n * @param newValue - display prop new value\n * @param condition - additionnal condition to apply display prop newValue\n /\n private setDisplay = (newValue: boolean, condition = true): void => {\n if (!this.disabled && condition) this.display = newValue;\n };\n\n /\n Action for tooltip element and tooltiped element mouse listener\n * @param elementGuard - tooltip element guard\n * @param isMouseenter - mouseenter validation\n * @param conditionalGuard - guard condition\n /\n private tooltipMouseListenerAction = (elementGuard: Guard, isMouseenter: boolean, conditionalGuard: Guard): void => {\n // we mutate elementGuard\n if (this.guard !== Guard.FOCUS) {\n this.guard = elementGuard;\n if (!isMouseenter) {\n setTimeout(() => {\n this.setDisplay(isMouseenter, this.guard !== conditionalGuard);\n this.resetGuard();\n }, 100);\n } else if (this.guard === Guard.HOVER_TOOLTIPED_ELEMENT) {\n this.setDisplay(isMouseenter);\n }\n }\n };\n\n /\n Method to reset guard value\n /\n private resetGuard = (): void => {\n this.guard = undefined;\n };\n\n /\n Update slot content when it is a mg-button\n * @param mgButton - slotted mg-button\n /\n private setMgButtonWrapper = (mgButton: HTMLMgButtonElement): void => {\n if (mgButton.disabled) {\n const div = document.createElement('div');\n div.classList.add('mg-tooltip__mg-button-wrapper');\n mgButton.parentNode.insertBefore(div, mgButton);\n div.appendChild(mgButton);\n this.tooltipedElement = div;\n } else if (mgButton.parentElement.classList.contains('mg-tooltip__mg-button-wrapper')) {\n this.element.firstElementChild.replaceWith(mgButton);\n this.tooltipedElement = mgButton;\n }\n };\n\n /\n Init tooltip\n * @param slotElement - slotted element\n * @param interactiveElement - interactive element\n /\n private initTooltip = (slotElement: HTMLElement, interactiveElement: HTMLElement): void => {\n // Add tabindex to slotted element if we can't find any interactive element\n if (!this.disabled && !Boolean(interactiveElement)) {\n this.hasCustomTabIndex = true;\n slotElement.tabIndex = 0;\n // Add role on non-interactive element to work with \"aria-describedby\" for screen readers\n slotElement.setAttribute('role', 'button');\n }\n // Set aria-describedby\n const ariaDescribedby = slotElement.getAttribute('aria-describedby');\n\n if (ariaDescribedby === null) {\n this.tooltipedElement.setAttribute('aria-describedby', this.identifier);\n } else {\n // We ensure to have uniq ids\n slotElement.setAttribute('aria-describedby', `${[...new Set([...ariaDescribedby.split(' '), this.identifier])].join(' ')}`);\n }\n\n // Create popperjs tooltip\n this.popper = createPopper(this.tooltipedElement, this.mgTooltipContent, {\n placement: this.placement,\n strategy: 'fixed',\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['auto'],\n },\n },\n ],\n });\n\n // Manage tooltipedElement focus/blur events\n this.tooltipedElement.addEventListener('focus', () => {\n this.guard = Guard.FOCUS;\n this.setDisplay(true);\n });\n\n // as `click` event is the composition of `mousedown` and `mouseup` event,\n // and `click` event trigger `focus` event after a success `mousedown` wich set the `guard` to `Guard.FOCUS`\n // we reset the guard on `mouseup` event to unlock tooltip\n this.tooltipedElement.addEventListener('mouseup', () => {\n this.resetGuard();\n });\n\n this.tooltipedElement.addEventListener('blur', () => {\n this.resetGuard();\n this.setDisplay(false);\n });\n\n document.addEventListener('keydown', this.pressEscape);\n\n // manage tooltipElement & tooltipedElement mouseenter/mouseleave events\n ['mouseenter', 'mouseleave'].forEach(eventType => {\n const isMouseenter = eventType === 'mouseenter';\n [\n { element: this.mgTooltipContent, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIP_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIPED_ELEMENT) },\n { element: this.tooltipedElement, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIPED_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIP_ELEMENT) },\n ].forEach(({ element, action }) => {\n element.addEventListener(eventType, () => {\n action();\n });\n });\n });\n };\n\n /\n Render tooltip content element\n /\n private renderTooltipContent(): void {\n const mgTooltipContent = this.element.querySelector('mg-tooltip-content');\n if (mgTooltipContent === null) {\n const mgTooltipContent = document.createElement('mg-tooltip-content');\n mgTooltipContent.setAttribute('slot', 'content');\n mgTooltipContent.setAttribute('id', this.identifier);\n\n const arrow = document.createElement('div');\n arrow.setAttribute('slot', 'arrow');\n arrow.dataset.popperArrow = '';\n mgTooltipContent.appendChild(arrow);\n\n // append tooltip element to component\n this.element.appendChild(mgTooltipContent);\n } else {\n mgTooltipContent.setAttribute('id', this.identifier);\n }\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * set variables\n /\n componentWillLoad(): void {\n // Get windows to attach events\n this.windows = getWindows(window);\n\n // Get tooltip element\n this.renderTooltipContent();\n this.mgTooltipContent = this.element.querySelector(`#${this.identifier}`);\n\n //validate properties\n this.validateDisabled(this.disabled);\n this.validateMessage(this.message);\n this.validateIdentifier();\n }\n\n /\n Get slotted element\n * Check if it already contain an interactive element, if not we need to add a tabIndex attribute\n * We need to attach the focused element to the tooltip (aria-describedby)\n /\n componentDidLoad(): void {\n // get slotted element wich is not the tooltip\n const slotElement: HTMLElement = this.element.querySelector(`:not(#${this.identifier})`);\n\n // Get interactive element\n const interactiveElement: HTMLElement = slotElement.matches(focusableElements) ? slotElement : slotElement.shadowRoot?.querySelector(focusableElements);\n\n // define selected element to become tooltip selector\n this.tooltipedElement = interactiveElement \|\| slotElement;\n\n // Check if slotted element is a disabled mg-button\n // In this case we wrap the mg-button into a div to enable the tooltip\n if (isButton(slotElement)) {\n new MutationObserver(mutationList => {\n if (mutationList.some(mutation => ['aria-disabled', 'disabled'].includes(mutation.attributeName))) {\n this.setMgButtonWrapper(slotElement);\n // Since Firefox doesn't trigger a \"blur\" event when the \"disabled\" attribute is added or removed from a button\n // we have to manually unlock the guard because the \"blur\" handler of the tooltipedElement won't do it.\n this.resetGuard();\n this.initTooltip(slotElement, interactiveElement);\n }\n }).observe(slotElement, { attributes: true });\n this.setMgButtonWrapper(slotElement);\n }\n\n // Init Tooltip\n this.initTooltip(slotElement, interactiveElement);\n\n this.handleDisplay(this.display);\n }\n\n /*\n update popper position after props change on component did update hook to benefit from render ended\n /\n componentDidUpdate(): void {\n this.popper.update();\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host>\n <slot></slot>\n <slot name=\"content\"></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-tooltip.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tooltip/mg-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\nimport { createID, focusableElements, getWindows, isValidString } from '../../../utils/components.utils';\nimport { Instance as PopperInstance, createPopper, Placement } from '@popperjs/core';\nimport { Guard } from './mg-tooltip.conf';\n\n/*\n HTMLMgButtonElement type guard\n * @param element - element to check\n * @returns return true if type is HTMLMgButtonElement\n /\nconst isButton = (element: unknown): element is HTMLMgButtonElement => typeof element === 'object' && ['MG-BUTTON', 'BUTTON'].includes((element as Element).tagName);\n\n@Component({\n tag: 'mg-tooltip',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip.css',\n shadow: true,\n})\nexport class MgTooltip {\n /**********\n Internal \n *********/\n\n private popper: PopperInstance;\n private mgTooltipContent: HTMLMgTooltipContentElement;\n private tooltipedElement: HTMLElement;\n private windows: Window[];\n private hasCustomTabIndex: boolean;\n\n // tooltip actions guards\n private guard: Guard;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTooltipElement;\n\n /\n Sets an `id` attribute.\n * Needed by the input for accessibility `aria-decribedby`.\n /\n @Prop() identifier: string = createID('mg-tooltip');\n @Watch('identifier')\n validateIdentifier(): void {\n // use renderTooltipContent to update tooltip-content id\n this.renderTooltipContent();\n }\n\n /\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n @Watch('message')\n validateMessage(newValue: MgTooltip['message']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-tooltip> prop \"message\" is required.');\n }\n this.mgTooltipContent.message = newValue;\n }\n\n /\n Tooltip placement\n /\n @Prop() placement: Placement = 'bottom';\n\n /\n Display tooltip\n /\n @Prop({ mutable: true }) display = false;\n @Watch('display')\n handleDisplay(newValue: MgTooltip['display']): void {\n if (newValue) {\n this.show();\n } else {\n this.hide();\n }\n }\n\n /\n Disable tooltip\n /\n @Prop() disabled = false;\n @Watch('disabled')\n validateDisabled(newValue: MgTooltip['disabled']): void {\n if (this.hasCustomTabIndex) {\n if (newValue) this.tooltipedElement.removeAttribute('tabindex');\n else if (this.tooltipedElement.getAttribute('tabindex') === null) this.tooltipedElement.setAttribute('tabindex', '0');\n }\n }\n\n /\n Show tooltip\n /\n private show = (): void => {\n // Make the tooltip visible\n this.mgTooltipContent.dataset.show = '';\n // Enable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: true }],\n }));\n // hide when click outside\n // setTimeout is used to prevent event to trigger after creation\n setTimeout(() => {\n this.windows.forEach((localWindow: Window) => {\n localWindow.addEventListener('click', this.clickOutside, false);\n localWindow.addEventListener('keydown', this.pressEscape, false);\n });\n }, 0);\n };\n\n /\n Hide tooltip\n /\n private hide = (): void => {\n // Hide the tooltip\n this.mgTooltipContent.removeAttribute('data-show');\n // Disable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: false }],\n }));\n // Remove event listener\n this.windows.forEach((localWindow: Window) => {\n localWindow.removeEventListener('click', this.clickOutside, false);\n localWindow.removeEventListener('keyboard', this.pressEscape, false);\n });\n };\n\n /\n Check if clicked outside of component and hidde tooltip\n * @param event - mouse event\n /\n private clickOutside = (event: MouseEvent & { target: HTMLElement }): void => {\n if (event.target.closest('mg-tooltip') !== this.element) this.setDisplay(false);\n };\n\n /\n Check if 'Escape' key is pressed of component and hidde tooltip\n * @param event - keyboard event\n /\n private pressEscape = (event: KeyboardEvent): void => {\n if (event.code === 'Escape') {\n this.setDisplay(false);\n this.resetGuard();\n }\n };\n\n /\n Method to set display prop\n * @param newValue - display prop new value\n * @param condition - additionnal condition to apply display prop newValue\n /\n private setDisplay = (newValue: MgTooltip['display'], condition = true): void => {\n if (!this.disabled && condition) this.display = newValue;\n };\n\n /\n Action for tooltip element and tooltiped element mouse listener\n * @param elementGuard - tooltip element guard\n * @param isMouseenter - mouseenter validation\n * @param conditionalGuard - guard condition\n /\n private tooltipMouseListenerAction = (elementGuard: Guard, isMouseenter: boolean, conditionalGuard: Guard): void => {\n // we mutate elementGuard\n if (this.guard !== Guard.FOCUS) {\n this.guard = elementGuard;\n if (!isMouseenter) {\n setTimeout(() => {\n this.setDisplay(isMouseenter, this.guard !== conditionalGuard);\n this.resetGuard();\n }, 100);\n } else if (this.guard === Guard.HOVER_TOOLTIPED_ELEMENT) {\n this.setDisplay(isMouseenter);\n }\n }\n };\n\n /\n Method to reset guard value\n /\n private resetGuard = (): void => {\n this.guard = undefined;\n };\n\n /\n Update slot content when it is a mg-button\n * @param mgButton - slotted mg-button\n /\n private setMgButtonWrapper = (mgButton: HTMLMgButtonElement): void => {\n if (mgButton.disabled) {\n const div = document.createElement('div');\n div.classList.add('mg-c-tooltip__mg-button-wrapper');\n mgButton.parentNode.insertBefore(div, mgButton);\n div.appendChild(mgButton);\n this.tooltipedElement = div;\n } else if (mgButton.parentElement.classList.contains('mg-c-tooltip__mg-button-wrapper')) {\n this.element.firstElementChild.replaceWith(mgButton);\n this.tooltipedElement = mgButton;\n }\n };\n\n /\n Init tooltip\n * @param slotElement - slotted element\n * @param interactiveElement - interactive element\n /\n private initTooltip = (slotElement: HTMLElement, interactiveElement: HTMLElement): void => {\n // Add tabindex to slotted element if we can't find any interactive element\n if (!this.disabled && !interactiveElement) {\n this.hasCustomTabIndex = true;\n slotElement.tabIndex = 0;\n // Add role on non-interactive element to work with \"aria-describedby\" for screen readers\n slotElement.setAttribute('role', 'button');\n }\n // Set aria-describedby\n const ariaDescribedby = slotElement.getAttribute('aria-describedby');\n\n if (ariaDescribedby === null) {\n this.tooltipedElement.setAttribute('aria-describedby', this.identifier);\n } else {\n // We ensure to have uniq ids\n slotElement.setAttribute('aria-describedby', `${[...new Set([...ariaDescribedby.split(' '), this.identifier])].join(' ')}`);\n }\n\n // Create popperjs tooltip\n this.popper = createPopper(this.tooltipedElement, this.mgTooltipContent, {\n placement: this.placement,\n strategy: 'fixed',\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['auto'],\n },\n },\n ],\n });\n\n // Manage tooltipedElement focus/blur events\n this.tooltipedElement.addEventListener('focus', () => {\n this.guard = Guard.FOCUS;\n this.setDisplay(true);\n });\n\n // as `click` event is the composition of `mousedown` and `mouseup` event,\n // and `click` event trigger `focus` event after a success `mousedown` wich set the `guard` to `Guard.FOCUS`\n // we reset the guard on `mouseup` event to unlock tooltip\n this.tooltipedElement.addEventListener('mouseup', () => {\n this.resetGuard();\n });\n\n this.tooltipedElement.addEventListener('blur', () => {\n this.resetGuard();\n this.setDisplay(false);\n });\n\n document.addEventListener('keydown', this.pressEscape);\n\n // manage tooltipElement & tooltipedElement mouseenter/mouseleave events\n ['mouseenter', 'mouseleave'].forEach(eventType => {\n const isMouseenter = eventType === 'mouseenter';\n [\n { element: this.mgTooltipContent, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIP_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIPED_ELEMENT) },\n { element: this.tooltipedElement, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIPED_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIP_ELEMENT) },\n ].forEach(({ element, action }) => {\n element.addEventListener(eventType, () => {\n action();\n });\n });\n });\n };\n\n /\n Render tooltip content element\n /\n private renderTooltipContent(): void {\n const mgTooltipContent = this.element.querySelector('mg-tooltip-content');\n if (mgTooltipContent === null) {\n const mgTooltipContent = document.createElement('mg-tooltip-content');\n mgTooltipContent.setAttribute('slot', 'content');\n mgTooltipContent.setAttribute('id', this.identifier);\n\n const arrow = document.createElement('div');\n arrow.setAttribute('slot', 'arrow');\n arrow.dataset.popperArrow = '';\n mgTooltipContent.appendChild(arrow);\n\n // append tooltip element to component\n this.element.appendChild(mgTooltipContent);\n } else {\n mgTooltipContent.setAttribute('id', this.identifier);\n }\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * set variables\n /\n componentWillLoad(): void {\n // Get windows to attach events\n this.windows = getWindows(window);\n\n // Get tooltip element\n this.renderTooltipContent();\n this.mgTooltipContent = this.element.querySelector(`#${this.identifier}`);\n\n //validate properties\n this.validateDisabled(this.disabled);\n this.validateMessage(this.message);\n this.validateIdentifier();\n }\n\n /\n Get slotted element\n * Check if it already contain an interactive element, if not we need to add a tabIndex attribute\n * We need to attach the focused element to the tooltip (aria-describedby)\n /\n componentDidLoad(): void {\n // get slotted element wich is not the tooltip\n const slotElement: HTMLElement = this.element.querySelector(`:not(#${this.identifier})`);\n\n // Get interactive element\n const interactiveElement: HTMLElement = slotElement.matches(focusableElements) ? slotElement : slotElement.shadowRoot?.querySelector(focusableElements);\n\n // define selected element to become tooltip selector\n this.tooltipedElement = interactiveElement \|\| slotElement;\n\n // Check if slotted element is a disabled mg-button\n // In this case we wrap the mg-button into a div to enable the tooltip\n if (isButton(slotElement)) {\n new MutationObserver(mutationList => {\n if (mutationList.some(mutation => ['aria-disabled', 'disabled'].includes(mutation.attributeName))) {\n this.setMgButtonWrapper(slotElement);\n // Since Firefox doesn't trigger a \"blur\" event when the \"disabled\" attribute is added or removed from a button\n // we have to manually unlock the guard because the \"blur\" handler of the tooltipedElement won't do it.\n this.resetGuard();\n this.initTooltip(slotElement, interactiveElement);\n }\n }).observe(slotElement, { attributes: true });\n this.setMgButtonWrapper(slotElement);\n }\n\n // Init Tooltip\n this.initTooltip(slotElement, interactiveElement);\n\n this.handleDisplay(this.display);\n }\n\n /*\n update popper position after props change on component did update hook to benefit from render ended\n /\n componentDidUpdate(): void {\n this.popper.update();\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host>\n <slot></slot>\n <slot name=\"content\"></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/atoms/mg-tooltip/test/mg-tooltip.e2e.js CHANGED Viewed

@@ -45,7 +45,7 @@ describe('mg-tooltip', () => {
     '<mg-tooltip message="my tooltip coucou"><span>coucou</span></mg-tooltip>',
     `<mg-tooltip message="this is a tooltip message"><mg-icon icon="info-circle"></mg-icon></mg-tooltip>`,
     '<mg-tooltip message="my tooltip mg-button"><mg-button>mg-button</mg-button></mg-tooltip>',
-    '<mg-tooltip message="my tooltip native button"><button class="mg-button mg-button--primary" aria-describedby="blu">native button</button></mg-tooltip>',
+    '<mg-tooltip message="my tooltip native button"><button class="mg-c-button mg-c-button--primary" aria-describedby="blu">native button</button></mg-tooltip>',
   ])('Keyboard navigation with template', template => {
     test.each(['Space', 'Enter'])('Should NOT navigate with keyboard, case key %s', async (key) => {
       const page = await createPage(template);

package/dist/collection/components/atoms/mg-tooltip/test/mg-tooltip.e2e.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tooltip.e2e.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tooltip/test/mg-tooltip.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,0CAA0C,CAAC;AAEtE,MAAM,KAAK,GAAG,wFAAwF,CAAC;AAEvG,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;EAC1B,QAAQ,CAAC,IAAI,CAAC;IACZ,MAAM;IACN,YAAY;IACZ,UAAU;IACV,KAAK;IACL,WAAW;IACX,SAAS;IACT,QAAQ;IACR,cAAc;IACd,YAAY;IACZ,OAAO;IACP,aAAa;IACb,WAAW;IACX,MAAM;IACN,YAAY;IACZ,UAAU;GACX,CAAC,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE;IAC7B,IAAI,CAAC,eAAe,EAAE,KAAK,IAAI,EAAE;MAC/B,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,GAAG,KAAK,8DAA8D,SAAS,uDAAuD,CAAC,CAAC;MAEtK,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;MAChD,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;MAC1C,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;MAEtD,MAAM,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;MAE1C,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;MAC7B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;MAEpD,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;MAC3C,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;MAE1C,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;MAC5B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAEjD,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;MAClC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;MAClC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IACnD,CAAC,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,QAAQ,CAAC,IAAI,CAAC;IACZ,0EAA0E;IAC1E,qGAAqG;IACrG,0FAA0F;IAC1F,wJAAwJ;GACzJ,CAAC,CAAC,mCAAmC,EAAE,QAAQ,CAAC,EAAE;IACjD,IAAI,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,gDAAgD,EAAE,KAAK,EAAC,GAAG,EAAC,EAAE;MAC1F,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,QAAQ,CAAC,CAAC;MAExC,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;MAChD,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;MAEtD,MAAM,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;MAE1C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MAChC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAY,CAAC,CAAC;MACvC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,kDAAkD,EAAE,KAAK,IAAI,EAAE;MAClE,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,QAAQ,CAAC,CAAC;MAExC,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;MAChD,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;MAEtD,MAAM,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;MAE1C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MAChC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;MACnC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IACnD,CAAC,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,uEAAuE,EAAE,KAAK,IAAI,EAAE;IACvF,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,2GAA2G,CAAC,CAAC;IAE3I,MAAM,gBAAgB,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACpD,MAAM,cAAc,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAE7D,wDAAwD;IACxD,gBAAgB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAEpD,+DAA+D;IAC/D,gBAAgB,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;IAC5C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAEpD,+DAA+D;IAC/D,gBAAgB,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;IAC5C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAEpD,0CAA0C;IAC1C,gBAAgB,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;IACtC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;EAC1D,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,+CAA+C,EAAE,KAAK,IAAI,EAAE;IAC/D,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,mFAAmF,CAAC,CAAC;IAEnH,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IAEpD,IAAI,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACzC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;IAE1C,MAAM,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,GAAG,CAAC,EAAE;MAClC,GAA4B,CAAC,OAAO,GAAG,eAAe,CAAC;IAC1D,CAAC,CAAC,CAAC;IACH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACrC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,oDAAoD,EAAE,KAAK,IAAI,EAAE;IACpE,MAAM,IAAI,GAAG,MAAM,UAAU,CAC3B;gGAC0F,EAC1F,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAC5B,CAAC;IAEF,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IAC3C,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;IAC5D,MAAM,IAAI,GAAG,MAAM,UAAU,CAC3B,yMAAyM,CAC1M,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAEpD,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IAEpD,gBAAgB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IAC3C,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,uDAAuD,EAAE,KAAK,IAAI,EAAE;IACvE,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,GAAG,KAAK,kHAAkH,CAAC,CAAC;IAE1J,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IAEpD,IAAI,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACzC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;IAE1C,MAAM,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,SAA+B,EAAE,EAAE;MACjE,SAAS,CAAC,OAAO,GAAG,8GAA8G,CAAC;IACrI,CAAC,CAAC,CAAC;IAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACrC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { createPage } from '../../../../utils/stencil.e2e.test.utils';\n\nconst style = '<style>mg-icon{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}</style>';\n\ndescribe('mg-tooltip', () => {\n describe.each([\n 'auto',\n 'auto-start',\n 'auto-end',\n 'top',\n 'top-start',\n 'top-end',\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'right',\n 'right-start',\n 'right-end',\n 'left',\n 'left-start',\n 'left-end',\n ])('placement %s', placement => {\n test('Should render', async () => {\n const page = await createPage(`${style}<mg-tooltip message=\"this is a tooltip message\" placement=\"${placement}\"><mg-icon icon=\"info-circle\"></mg-icon></mg-tooltip>`);\n\n const mgTooltip = await page.find('mg-tooltip');\n const mgIcon = await page.find('mg-icon');\n const tooltip = await page.find('mg-tooltip-content');\n\n expect(mgTooltip).toHaveClass('hydrated');\n\n mgIcon.triggerEvent('focus');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n await page.setViewport({ width: 400, height: 400 });\n\n const screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n\n mgIcon.triggerEvent('blur');\n await page.waitForChanges();\n\n expect(tooltip).not.toHaveAttribute('data-show');\n\n mgIcon.triggerEvent('mouseenter');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n mgIcon.triggerEvent('mouseleave');\n await page.waitForChanges();\n\n expect(tooltip).not.toHaveAttribute('data-show');\n });\n });\n\n describe.each([\n '<mg-tooltip message=\"my tooltip coucou\"><span>coucou</span></mg-tooltip>',\n `<mg-tooltip message=\"this is a tooltip message\"><mg-icon icon=\"info-circle\"></mg-icon></mg-tooltip>`,\n '<mg-tooltip message=\"my tooltip mg-button\"><mg-button>mg-button</mg-button></mg-tooltip>',\n '<mg-tooltip message=\"my tooltip native button\"><button class=\"mg-button mg-button--primary\" aria-describedby=\"blu\">native button</button></mg-tooltip>',\n ])('Keyboard navigation with template', template => {\n test.each(['Space', 'Enter'])('Should NOT navigate with keyboard, case key %s', async key => {\n const page = await createPage(template);\n\n const mgTooltip = await page.find('mg-tooltip');\n const tooltip = await page.find('mg-tooltip-content');\n\n expect(mgTooltip).toHaveClass('hydrated');\n\n await page.keyboard.down('Tab');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n await page.keyboard.down(key as never);\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n });\n\n test('Should navigate with keyboard, case key \"Escape\"', async () => {\n const page = await createPage(template);\n\n const mgTooltip = await page.find('mg-tooltip');\n const tooltip = await page.find('mg-tooltip-content');\n\n expect(mgTooltip).toHaveClass('hydrated');\n\n await page.keyboard.down('Tab');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n await page.keyboard.down('Escape');\n await page.waitForChanges();\n\n expect(tooltip).not.toHaveAttribute('data-show');\n });\n });\n\n test('Should keep tooltip displaied when hover with mouse after focus event', async () => {\n const page = await createPage('<mg-tooltip identifier=\"identifier\" message=\"Batman tooltip\"><mg-icon icon=\"user\"></mg-icon></mg-tooltip>');\n\n const tooltipedElement = await page.find('mg-icon');\n const tooltipElement = await page.find('mg-tooltip-content');\n\n // 1. take focus on tooltipedElement and display tooltip\n tooltipedElement.triggerEvent('focus');\n await page.waitForChanges();\n\n expect(tooltipElement).toHaveAttribute('data-show');\n\n // 2. mouseenter on tooltipedElement and tooltip stay displaied\n tooltipedElement.triggerEvent('mouseenter');\n await page.waitForChanges();\n\n expect(tooltipElement).toHaveAttribute('data-show');\n\n // 3. mouseleave on tooltipedElement and tooltip stay displaied\n tooltipedElement.triggerEvent('mouseleave');\n await page.waitForChanges();\n\n expect(tooltipElement).toHaveAttribute('data-show');\n\n // 4. presse tab key and tooltip is hidden\n tooltipedElement.triggerEvent('blur');\n await page.waitForChanges();\n\n expect(tooltipElement).not.toHaveAttribute('data-show');\n });\n\n test('Should keep tooltip arrow when update message', async () => {\n const page = await createPage('<mg-tooltip message=\"Batman tooltip\"><mg-icon icon=\"user\"></mg-icon></mg-tooltip>');\n\n await page.keyboard.down('Tab');\n await page.waitForChanges();\n\n await page.setViewport({ width: 400, height: 100 });\n\n let screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n\n await page.$eval('mg-tooltip', elm => {\n (elm as HTMLMgTooltipElement).message = 'Joker is here';\n });\n await page.waitForChanges();\n\n screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n\n test(`should position tooltip where it have enough place`, async () => {\n const page = await createPage(\n `<style>mg-icon{position:fixed;left:0;bottom:0}</style>\n <mg-tooltip message=\"Batman tooltip\" display><mg-icon icon=\"user\"></mg-icon></mg-tooltip>`,\n { width: 400, height: 100 },\n );\n\n const screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n\n test('Should display long tooltip with max width', async () => {\n const page = await createPage(\n '<mg-tooltip identifier=\"identifier\" message=\"my very long content should return to line because of the max-width set to 400px in the design specification\"><mg-icon icon=\"user\"></mg-icon></mg-tooltip>',\n );\n\n const tooltipedElement = await page.find('mg-icon');\n\n await page.setViewport({ width: 500, height: 100 });\n\n tooltipedElement.triggerEvent('focus');\n await page.waitForChanges();\n\n const screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n\n test('Should keep tooltip center when update \"message\" prop', async () => {\n const page = await createPage(`${style}<mg-tooltip identifier=\"identifier\" message=\"short tooltip\" display><mg-icon icon=\"user\"></mg-icon></mg-tooltip>`);\n\n await page.setViewport({ width: 400, height: 400 });\n\n let screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n\n await page.$eval('mg-tooltip', (mgTooltip: HTMLMgTooltipElement) => {\n mgTooltip.message = 'my very long content should return to line because of the max-width set to 400px in the design specification';\n });\n\n await page.waitForChanges();\n\n screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n});\n"]}
1	+ {"version":3,"file":"mg-tooltip.e2e.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tooltip/test/mg-tooltip.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,0CAA0C,CAAC;AAEtE,MAAM,KAAK,GAAG,wFAAwF,CAAC;AAEvG,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;EAC1B,QAAQ,CAAC,IAAI,CAAC;IACZ,MAAM;IACN,YAAY;IACZ,UAAU;IACV,KAAK;IACL,WAAW;IACX,SAAS;IACT,QAAQ;IACR,cAAc;IACd,YAAY;IACZ,OAAO;IACP,aAAa;IACb,WAAW;IACX,MAAM;IACN,YAAY;IACZ,UAAU;GACX,CAAC,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE;IAC7B,IAAI,CAAC,eAAe,EAAE,KAAK,IAAI,EAAE;MAC/B,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,GAAG,KAAK,8DAA8D,SAAS,uDAAuD,CAAC,CAAC;MAEtK,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;MAChD,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;MAC1C,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;MAEtD,MAAM,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;MAE1C,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;MAC7B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;MAEpD,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;MAC3C,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;MAE1C,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;MAC5B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAEjD,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;MAClC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;MAClC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IACnD,CAAC,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,QAAQ,CAAC,IAAI,CAAC;IACZ,0EAA0E;IAC1E,qGAAqG;IACrG,0FAA0F;IAC1F,4JAA4J;GAC7J,CAAC,CAAC,mCAAmC,EAAE,QAAQ,CAAC,EAAE;IACjD,IAAI,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,gDAAgD,EAAE,KAAK,EAAC,GAAG,EAAC,EAAE;MAC1F,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,QAAQ,CAAC,CAAC;MAExC,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;MAChD,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;MAEtD,MAAM,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;MAE1C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MAChC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAY,CAAC,CAAC;MACvC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,kDAAkD,EAAE,KAAK,IAAI,EAAE;MAClE,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,QAAQ,CAAC,CAAC;MAExC,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;MAChD,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;MAEtD,MAAM,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;MAE1C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MAChC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;MAE7C,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;MACnC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;MAE5B,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IACnD,CAAC,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,uEAAuE,EAAE,KAAK,IAAI,EAAE;IACvF,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,2GAA2G,CAAC,CAAC;IAE3I,MAAM,gBAAgB,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACpD,MAAM,cAAc,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAE7D,wDAAwD;IACxD,gBAAgB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAEpD,+DAA+D;IAC/D,gBAAgB,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;IAC5C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAEpD,+DAA+D;IAC/D,gBAAgB,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;IAC5C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAEpD,0CAA0C;IAC1C,gBAAgB,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;IACtC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;EAC1D,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,+CAA+C,EAAE,KAAK,IAAI,EAAE;IAC/D,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,mFAAmF,CAAC,CAAC;IAEnH,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IAEpD,IAAI,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACzC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;IAE1C,MAAM,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,GAAG,CAAC,EAAE;MAClC,GAA4B,CAAC,OAAO,GAAG,eAAe,CAAC;IAC1D,CAAC,CAAC,CAAC;IACH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACrC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,oDAAoD,EAAE,KAAK,IAAI,EAAE;IACpE,MAAM,IAAI,GAAG,MAAM,UAAU,CAC3B;gGAC0F,EAC1F,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAC5B,CAAC;IAEF,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IAC3C,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;IAC5D,MAAM,IAAI,GAAG,MAAM,UAAU,CAC3B,yMAAyM,CAC1M,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAEpD,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IAEpD,gBAAgB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IAC3C,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,uDAAuD,EAAE,KAAK,IAAI,EAAE;IACvE,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,GAAG,KAAK,kHAAkH,CAAC,CAAC;IAE1J,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IAEpD,IAAI,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACzC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;IAE1C,MAAM,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,SAA+B,EAAE,EAAE;MACjE,SAAS,CAAC,OAAO,GAAG,8GAA8G,CAAC;IACrI,CAAC,CAAC,CAAC;IAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,UAAU,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACrC,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { createPage } from '../../../../utils/stencil.e2e.test.utils';\n\nconst style = '<style>mg-icon{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}</style>';\n\ndescribe('mg-tooltip', () => {\n describe.each([\n 'auto',\n 'auto-start',\n 'auto-end',\n 'top',\n 'top-start',\n 'top-end',\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'right',\n 'right-start',\n 'right-end',\n 'left',\n 'left-start',\n 'left-end',\n ])('placement %s', placement => {\n test('Should render', async () => {\n const page = await createPage(`${style}<mg-tooltip message=\"this is a tooltip message\" placement=\"${placement}\"><mg-icon icon=\"info-circle\"></mg-icon></mg-tooltip>`);\n\n const mgTooltip = await page.find('mg-tooltip');\n const mgIcon = await page.find('mg-icon');\n const tooltip = await page.find('mg-tooltip-content');\n\n expect(mgTooltip).toHaveClass('hydrated');\n\n mgIcon.triggerEvent('focus');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n await page.setViewport({ width: 400, height: 400 });\n\n const screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n\n mgIcon.triggerEvent('blur');\n await page.waitForChanges();\n\n expect(tooltip).not.toHaveAttribute('data-show');\n\n mgIcon.triggerEvent('mouseenter');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n mgIcon.triggerEvent('mouseleave');\n await page.waitForChanges();\n\n expect(tooltip).not.toHaveAttribute('data-show');\n });\n });\n\n describe.each([\n '<mg-tooltip message=\"my tooltip coucou\"><span>coucou</span></mg-tooltip>',\n `<mg-tooltip message=\"this is a tooltip message\"><mg-icon icon=\"info-circle\"></mg-icon></mg-tooltip>`,\n '<mg-tooltip message=\"my tooltip mg-button\"><mg-button>mg-button</mg-button></mg-tooltip>',\n '<mg-tooltip message=\"my tooltip native button\"><button class=\"mg-c-button mg-c-button--primary\" aria-describedby=\"blu\">native button</button></mg-tooltip>',\n ])('Keyboard navigation with template', template => {\n test.each(['Space', 'Enter'])('Should NOT navigate with keyboard, case key %s', async key => {\n const page = await createPage(template);\n\n const mgTooltip = await page.find('mg-tooltip');\n const tooltip = await page.find('mg-tooltip-content');\n\n expect(mgTooltip).toHaveClass('hydrated');\n\n await page.keyboard.down('Tab');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n await page.keyboard.down(key as never);\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n });\n\n test('Should navigate with keyboard, case key \"Escape\"', async () => {\n const page = await createPage(template);\n\n const mgTooltip = await page.find('mg-tooltip');\n const tooltip = await page.find('mg-tooltip-content');\n\n expect(mgTooltip).toHaveClass('hydrated');\n\n await page.keyboard.down('Tab');\n await page.waitForChanges();\n\n expect(tooltip).toHaveAttribute('data-show');\n\n await page.keyboard.down('Escape');\n await page.waitForChanges();\n\n expect(tooltip).not.toHaveAttribute('data-show');\n });\n });\n\n test('Should keep tooltip displaied when hover with mouse after focus event', async () => {\n const page = await createPage('<mg-tooltip identifier=\"identifier\" message=\"Batman tooltip\"><mg-icon icon=\"user\"></mg-icon></mg-tooltip>');\n\n const tooltipedElement = await page.find('mg-icon');\n const tooltipElement = await page.find('mg-tooltip-content');\n\n // 1. take focus on tooltipedElement and display tooltip\n tooltipedElement.triggerEvent('focus');\n await page.waitForChanges();\n\n expect(tooltipElement).toHaveAttribute('data-show');\n\n // 2. mouseenter on tooltipedElement and tooltip stay displaied\n tooltipedElement.triggerEvent('mouseenter');\n await page.waitForChanges();\n\n expect(tooltipElement).toHaveAttribute('data-show');\n\n // 3. mouseleave on tooltipedElement and tooltip stay displaied\n tooltipedElement.triggerEvent('mouseleave');\n await page.waitForChanges();\n\n expect(tooltipElement).toHaveAttribute('data-show');\n\n // 4. presse tab key and tooltip is hidden\n tooltipedElement.triggerEvent('blur');\n await page.waitForChanges();\n\n expect(tooltipElement).not.toHaveAttribute('data-show');\n });\n\n test('Should keep tooltip arrow when update message', async () => {\n const page = await createPage('<mg-tooltip message=\"Batman tooltip\"><mg-icon icon=\"user\"></mg-icon></mg-tooltip>');\n\n await page.keyboard.down('Tab');\n await page.waitForChanges();\n\n await page.setViewport({ width: 400, height: 100 });\n\n let screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n\n await page.$eval('mg-tooltip', elm => {\n (elm as HTMLMgTooltipElement).message = 'Joker is here';\n });\n await page.waitForChanges();\n\n screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n\n test(`should position tooltip where it have enough place`, async () => {\n const page = await createPage(\n `<style>mg-icon{position:fixed;left:0;bottom:0}</style>\n <mg-tooltip message=\"Batman tooltip\" display><mg-icon icon=\"user\"></mg-icon></mg-tooltip>`,\n { width: 400, height: 100 },\n );\n\n const screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n\n test('Should display long tooltip with max width', async () => {\n const page = await createPage(\n '<mg-tooltip identifier=\"identifier\" message=\"my very long content should return to line because of the max-width set to 400px in the design specification\"><mg-icon icon=\"user\"></mg-icon></mg-tooltip>',\n );\n\n const tooltipedElement = await page.find('mg-icon');\n\n await page.setViewport({ width: 500, height: 100 });\n\n tooltipedElement.triggerEvent('focus');\n await page.waitForChanges();\n\n const screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n\n test('Should keep tooltip center when update \"message\" prop', async () => {\n const page = await createPage(`${style}<mg-tooltip identifier=\"identifier\" message=\"short tooltip\" display><mg-icon icon=\"user\"></mg-icon></mg-tooltip>`);\n\n await page.setViewport({ width: 400, height: 400 });\n\n let screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n\n await page.$eval('mg-tooltip', (mgTooltip: HTMLMgTooltipElement) => {\n mgTooltip.message = 'my very long content should return to line because of the max-width set to 400px in the design specification';\n });\n\n await page.waitForChanges();\n\n screenshot = await page.screenshot();\n expect(screenshot).toMatchImageSnapshot();\n });\n});\n"]}

package/dist/collection/components/atoms/mg-tooltip/test/mg-tooltip.spec.js CHANGED Viewed

@@ -134,7 +134,7 @@ describe('mg-tooltip', () => {
     await page.waitForChanges();
     expect(tooltip).not.toHaveAttribute('data-show');
   });
-  test.each([true, false])('Should toogle tooltip from prop display, case display %s', async (display) => {
+  test.each([true, false])('Should toggle tooltip from prop display, case display %s', async (display) => {
     const args = { identifier: 'identifier', message: 'batman', display };
     const page = await getPage(args, h("span", null, "batman"));
     const mgTooltip = page.doc.querySelector('mg-tooltip');