@epa-wg/custom-element-dist 0.0.31 → 0.0.33

package/storybook-static/assets/{external-template.test.stories-VfKUQ8eu.js → external-template.test.stories-DZ-rjnfd.js}

@@ -1,9 +1,9 @@
-import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.js";function f(t){return new Promise(e=>setTimeout(e,t))}function h(t){const{title:e,body:n}=t;return`
+import{w as l,e as a}from"./index-Dr4PwNfd.js";import"./custom-element-CPnvJnn8.js";import{f as T}from"./frame.canvas-ClTqYyMN.js";function v(t){return new Promise(e=>setTimeout(e,t))}function h(t){const{title:e,body:n}=t;return`
         <fieldset>
             <legend>${e}</legend>
             ${n}
         </fieldset>
-  `}const B={title:"external-templates",render:h},s={args:{title:"Template in page DOM",body:`
+  `}const b={title:"external-templates",render:h},s={args:{title:"Template in page DOM",body:`
     <template id="template1">
     <slot>Hello</slot> World!
     </template>
@@ -13,24 +13,24 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
 
     <dce-internal data-testid="slot-override">👋</dce-internal>
     <dce-internal  data-testid="slot-default"></dce-internal>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(s.args.title);const n=T=>e.getByTestId(T).textContent.trim();a(n("slot-override")).toEqual("👋 World!"),a(n("slot-default")).toEqual("Hello World!")}},i={args:{title:"no tag, template in same DOM",body:`
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(s.args.title);const n=y=>e.getByTestId(y).textContent?.trim();a(n("slot-override")).toEqual("👋 World!"),a(n("slot-default")).toEqual("Hello World!")}},i={args:{title:"no tag, template in same DOM",body:`
 <template id="template2">
     🏗️ construction
 </template>
 
 <custom-element src="#template2"></custom-element>
-<custom-element src="#template2"></custom-element>`},play:async({canvasElement:t})=>{await l(t).findByText(i.args.title),a(t.querySelectorAll("custom-element")[0].textContent.trim()).toEqual("🏗️ construction"),a(t.querySelectorAll("custom-element")[1].textContent.trim()).toEqual("🏗️ construction")}},m={args:{title:"External SVG as template",body:`
+<custom-element src="#template2"></custom-element>`},play:async({canvasElement:t})=>{await l(t).findByText(i.args.title),a(t.querySelectorAll("custom-element")[0].textContent.trim()).toEqual("🏗️ construction"),a(t.querySelectorAll("custom-element")[1].textContent.trim()).toEqual("🏗️ construction")}},o={args:{title:"External SVG as template",body:`
     <custom-element tag="dce-external" src="/confused.svg">
         <template><i>loading from SVG ...</i></template>
     </custom-element>
     <dce-external></dce-external>
-    <custom-element src="confused.svg">
+    <custom-element src="/confused.svg">
         <i>inline DCE loading from SVG ...</i>
     </custom-element>
     <custom-element src="no.svg">
         <i>fallback for missing image</i>
     </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(m.args.title),await a(e.getByText("inline DCE loading from SVG ...")).toBeInTheDocument(),a(t.querySelector('[src="confused.svg"]').innerHTML).to.include("loading from SVG ..."),await a(await e.findByText("fallback for missing image")).toBeInTheDocument(),await a(await e.findByTitle("Confused")).toBeInTheDocument()}},o={args:{title:"External XSLT file",body:`
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(o.args.title),await a(e.getByText("inline DCE loading from SVG ...")).toBeInTheDocument(),a(t.querySelector('[src="/confused.svg"]').innerHTML).to.include("loading from SVG ..."),await a(await e.findByText("fallback for missing image")).toBeInTheDocument(),await a(await e.findByTitle("Confused")).toBeInTheDocument()}},m={args:{title:"External XSLT file",body:`
     <custom-element tag="dce-external-4" src="/tree.xsl">
         <template><i>loading from XSLT ...</i></template>
     </custom-element>
@@ -39,16 +39,16 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     <custom-element src="/tree.xsl" data-smile="👼" data-basket="🍒">
         <i>inline DCE loading from XSLT ...</i>
     </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(o.args.title),a(t.querySelector("dce-external-4").innerHTML).to.include("Hi"),a(t.querySelector('[data-smile="👼"]').innerHTML).to.include("loading from XSLT ..."),await a(await e.findByTestId("data-fruit")).toHaveTextContent("🍌"),await a(await e.findByTestId("data-smile")).toHaveTextContent("👼")}},c={args:{title:"external HTML template",body:`
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(m.args.title),a(t.querySelector("dce-external-4").innerHTML).to.include("Hi"),a(t.querySelector('[data-smile="👼"]').innerHTML).to.include("loading from XSLT ..."),await a(await e.findByTestId("data-fruit")).toHaveTextContent("🍌"),await a(await e.findByTestId("data-smile")).toHaveTextContent("👼")}},r={args:{title:"external HTML template",body:`
     <custom-element tag="dce-external-5" src="/html-template.html">
                 <template><i>loading from HTML file ...</i></template>
             </custom-element>
             <dce-external-5 title="DCE with external XSLT template" data-fruit="🍌">Hi</dce-external-5>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(c.args.title),await e.findByText("👋");const n=t.querySelector("dce-external-5").innerHTML;a(n).to.include("👋"),a(n).to.include("👌"),a(n).to.include("<svg"),a(n).to.include("<math")}},r={args:{title:"external HTML template",body:`
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(r.args.title),await e.findByText("👋");const n=t.querySelector("dce-external-5").innerHTML;a(n).to.include("👋"),a(n).to.include("👌"),a(n).to.include("<svg"),a(n).to.include("<math")}},c={args:{title:"external HTML template",body:`
             <custom-element src="/html-template.html" data-smile="👼" data-basket="🍒">
                 <i>inline DCE loading from HTML file ...</i>
             </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(r.args.title),await e.findByText("👋");const n=t.innerHTML;a(n).to.include("👋"),a(n).to.include("👌"),a(n).to.include("<svg"),a(n).to.include("<math")}},d={args:{title:"external HTML template - html by id",body:`
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(c.args.title),await e.findByText("👋");const n=t.innerHTML;a(n).to.include("👋"),a(n).to.include("👌"),a(n).to.include("<svg"),a(n).to.include("<math")}},d={args:{title:"external HTML template - html by id",body:`
         <custom-element src="/html-template.html#wave">
             <template><i>loading HTML from templates file ...</i></template>
         </custom-element>
@@ -56,23 +56,21 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
         <custom-element src="/html-template.html#dwc-logo">
             <template><i>loading  SVG from templates file ...</i></template>
         </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(p.args.title),a(await e.findByTestId("svg-test")).toBeInTheDocument()}},u={args:{title:"external HTML template - MathML by id",body:`
-        <custom-element src="/html-template.html#sophomores-dream">
-            <template><i>loading MathML from HTML file ...</i></template>
-        </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(u.args.title);const n=await e.findByTestId("ml-test");a(n.firstElementChild.localName).toEqual("mrow")}},g={args:{title:"external XHTML template - xsl by id",body:`
-        <custom-element src="/html-template.xhtml#embedded-xsl">
-            <template>whole XSLT is  embedded into HTML body</template>
-        </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(g.args.title);const n=await e.findByTestId("src");a(n.textContent).to.include("/html-template.xhtml#embedded-xsl")}},x={args:{title:"external HTML template - missing id",body:`
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(p.args.title),a(await e.findByTestId("svg-test")).toBeInTheDocument()}},u={args:{title:"6. external HTML template - MathML by id",body:`
+                <iframe src="/demo/external-templates-sb-6.html" data-testid="fr"></iframe>
+
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(u.args.title);const y=await(await T("fr",e)).findByTestId("ml-test");a(y.firstElementChild.localName).toEqual("mrow")}},g={args:{title:"7. external XHTML template - xsl by id",body:`
+        <iframe src="/demo/external-templates-sb-7.html" data-testid="fr"></iframe>
+
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(g.args.title);const n=await T("fr",e);await a(await n.findByText("whole XSLT is embedded into HTML body")).toBeInTheDocument(),await a(await n.findByText("./html-template.xhtml#embedded-xsl")).toBeInTheDocument()}},x={args:{title:"external HTML template - missing id",body:`
     <custom-element src="/html-template.html#none">
         <template><i data-testid="no-id">element with id=none is missing in template</i></template>
     </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(x.args.title),await f(100);const n=await e.findByTestId("no-id");a(n.textContent).to.include("element with id=none is missing in template")}},y={args:{title:"external file with embedding of another external DCE",body:`
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(x.args.title),await v(100);const n=await e.findByTestId("no-id");a(n.textContent).to.include("element with id=none is missing in template")}},f={args:{title:"external file with embedding of another external DCE",body:`
     <custom-element src="/embed-1.html">
         loading from embed-1.html ...
     </custom-element>
-`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(y.args.title),await f(1),a(await e.findByText("embed-1.html")).toBeInTheDocument(),a(await e.findByText("🖖")).toBeInTheDocument()}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
+`},play:async({canvasElement:t})=>{const e=l(t);await e.findByText(f.args.title),await v(1),a(await e.findByText("embed-1.html")).toBeInTheDocument(),a(await e.findByText("🖖")).toBeInTheDocument()}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
   args: {
     title: 'Template in page DOM',
     body: \`
@@ -92,7 +90,7 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
   }) => {
     const canvas = within(canvasElement);
     await canvas.findByText(TemplateInPage.args!.title as string);
-    const val = prop => canvas.getByTestId(prop).textContent.trim();
+    const val = (prop: string) => canvas.getByTestId(prop).textContent?.trim();
     expect(val('slot-override')).toEqual('👋 World!');
     expect(val('slot-default')).toEqual('Hello World!');
   }
@@ -115,7 +113,7 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     expect(canvasElement.querySelectorAll('custom-element')[0].textContent.trim()).toEqual('🏗️ construction');
     expect(canvasElement.querySelectorAll('custom-element')[1].textContent.trim()).toEqual('🏗️ construction');
   }
-}`,...i.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
+}`,...i.parameters?.docs?.source}}};o.parameters={...o.parameters,docs:{...o.parameters?.docs,source:{originalSource:`{
   args: {
     title: 'External SVG as template',
     body: \`
@@ -123,7 +121,7 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
         <template><i>loading from SVG ...</i></template>
     </custom-element>
     <dce-external></dce-external>
-    <custom-element src="confused.svg">
+    <custom-element src="/confused.svg">
         <i>inline DCE loading from SVG ...</i>
     </custom-element>
     <custom-element src="no.svg">
@@ -141,11 +139,11 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     // needs separate test
     // await expect( await canvas.findByText('loading from SVG ...')).toBeInTheDocument();
 
-    expect(canvasElement.querySelector('[src="confused.svg"]').innerHTML).to.include('loading from SVG ...');
+    expect(canvasElement.querySelector('[src="/confused.svg"]').innerHTML).to.include('loading from SVG ...');
     await expect(await canvas.findByText('fallback for missing image')).toBeInTheDocument();
     await expect(await canvas.findByTitle('Confused')).toBeInTheDocument();
   }
-}`,...m.parameters?.docs?.source}}};o.parameters={...o.parameters,docs:{...o.parameters?.docs,source:{originalSource:`{
+}`,...o.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
   args: {
     title: 'External XSLT file',
     body: \`
@@ -169,7 +167,7 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     await expect(await canvas.findByTestId('data-fruit')).toHaveTextContent('🍌');
     await expect(await canvas.findByTestId('data-smile')).toHaveTextContent('👼');
   }
-}`,...o.parameters?.docs?.source}}};c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`{
+}`,...m.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
   args: {
     title: 'external HTML template',
     body: \`
@@ -191,7 +189,7 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     expect(t5).to.include('<svg');
     expect(t5).to.include('<math');
   }
-}`,...c.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
+}`,...r.parameters?.docs?.source}}};c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`{
   args: {
     title: 'external HTML template',
     body: \`
@@ -212,7 +210,7 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     expect(t5).to.include('<svg');
     expect(t5).to.include('<math');
   }
-}`,...r.parameters?.docs?.source}}};d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
+}`,...c.parameters?.docs?.source}}};d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
   args: {
     title: 'external HTML template - html by id',
     body: \`
@@ -246,11 +244,10 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
   }
 }`,...p.parameters?.docs?.source}}};u.parameters={...u.parameters,docs:{...u.parameters?.docs,source:{originalSource:`{
   args: {
-    title: 'external HTML template - MathML by id',
+    title: '6. external HTML template - MathML by id',
     body: \`
-        <custom-element src="/html-template.html#sophomores-dream">
-            <template><i>loading MathML from HTML file ...</i></template>
-        </custom-element>
+                <iframe src="/demo/external-templates-sb-6.html" data-testid="fr"></iframe>
+
 \`
   },
   play: async ({
@@ -258,16 +255,16 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
   }) => {
     const canvas = within(canvasElement);
     await canvas.findByText(MathMLWithinHtmlFile.args!.title as string);
-    const ml = await canvas.findByTestId('ml-test');
+    const frCanvas = await frameCanvas('fr', canvas);
+    const ml = await frCanvas.findByTestId('ml-test');
     expect(ml.firstElementChild.localName).toEqual('mrow');
   }
 }`,...u.parameters?.docs?.source}}};g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
   args: {
-    title: 'external XHTML template - xsl by id',
+    title: '7. external XHTML template - xsl by id',
     body: \`
-        <custom-element src="/html-template.xhtml#embedded-xsl">
-            <template>whole XSLT is  embedded into HTML body</template>
-        </custom-element>
+        <iframe src="/demo/external-templates-sb-7.html" data-testid="fr"></iframe>
+
 \`
   },
   play: async ({
@@ -275,8 +272,9 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
   }) => {
     const canvas = within(canvasElement);
     await canvas.findByText(ByIdWithinXsltFile.args!.title as string);
-    const ml = await canvas.findByTestId('src');
-    expect(ml.textContent).to.include('/html-template.xhtml#embedded-xsl');
+    const frCanvas = await frameCanvas('fr', canvas);
+    await expect(await frCanvas.findByText('whole XSLT is embedded into HTML body')).toBeInTheDocument();
+    await expect(await frCanvas.findByText('./html-template.xhtml#embedded-xsl')).toBeInTheDocument();
   }
 }`,...g.parameters?.docs?.source}}};x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
   args: {
@@ -296,7 +294,7 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     const ml = await canvas.findByTestId('no-id');
     expect(ml.textContent).to.include('element with id=none is missing in template');
   }
-}`,...x.parameters?.docs?.source}}};y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
+}`,...x.parameters?.docs?.source}}};f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`{
   args: {
     title: 'external file with embedding of another external DCE',
     body: \`
@@ -314,4 +312,4 @@ import{w as l,e as a}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.
     expect(await canvas.findByText('embed-1.html')).toBeInTheDocument();
     expect(await canvas.findByText('🖖')).toBeInTheDocument();
   }
-}`,...y.parameters?.docs?.source}}};const E=["TemplateInPage","NoTag","ExternalSvg","ExternalXsltFile","ExternalHtmlFile","ExternalHtmlFileInline","HtmlWithinHtmlFile","SvgWithinHtmlFile","MathMLWithinHtmlFile","ByIdWithinXsltFile","MissingIdWithinXsltFile","EmbeddingInAnotherFile"];export{g as ByIdWithinXsltFile,y as EmbeddingInAnotherFile,c as ExternalHtmlFile,r as ExternalHtmlFileInline,m as ExternalSvg,o as ExternalXsltFile,d as HtmlWithinHtmlFile,u as MathMLWithinHtmlFile,x as MissingIdWithinXsltFile,i as NoTag,p as SvgWithinHtmlFile,s as TemplateInPage,E as __namedExportsOrder,B as default};
+}`,...f.parameters?.docs?.source}}};const H=["TemplateInPage","NoTag","ExternalSvg","ExternalXsltFile","ExternalHtmlFile","ExternalHtmlFileInline","HtmlWithinHtmlFile","SvgWithinHtmlFile","MathMLWithinHtmlFile","ByIdWithinXsltFile","MissingIdWithinXsltFile","EmbeddingInAnotherFile"];export{g as ByIdWithinXsltFile,f as EmbeddingInAnotherFile,r as ExternalHtmlFile,c as ExternalHtmlFileInline,o as ExternalSvg,m as ExternalXsltFile,d as HtmlWithinHtmlFile,u as MathMLWithinHtmlFile,x as MissingIdWithinXsltFile,i as NoTag,p as SvgWithinHtmlFile,s as TemplateInPage,H as __namedExportsOrder,b as default};

package/storybook-static/assets/{form.test.stories-CnuGN7Zw.js → form.test.stories-DQhPYtMj.js}

@@ -1,4 +1,4 @@
-import{w as i,e as n,u as e}from"./index-CxRwF5Or.js";import"./custom-element-D59Fok1f.js";function l(a){const{title:t,body:s}=a;return`
+import{w as i,e as n,u as e}from"./index-Dr4PwNfd.js";import"./custom-element-CPnvJnn8.js";function l(a){const{title:t,body:s}=a;return`
         <fieldset>
             <legend>${t}</legend>
             ${s}

package/storybook-static/assets/frame.canvas-ClTqYyMN.js

@@ -0,0 +1 @@
+import{w as a}from"./index-Dr4PwNfd.js";async function r(t,e){const n=await e.findByTestId(t);return new Promise(o=>n.addEventListener("load",()=>{o(a(n.contentWindow?.document.documentElement))}))}export{r as f};