Example #1
0
const diffPatchVariants = async (variants: string[]) => {
  const fakeDocument = new FakeDocument();
  const body = fakeDocument.createElement("body");
  let map: any;
  let currentDocument: SlimParentNode;
  for (const variant of variants) {
    const newDocument = await runPCComponent({
      "entry.pc": variant
    });
    if (!currentDocument) {
      currentDocument = setVMObjectIds(newDocument, "item");
      map = renderDOM2(currentDocument, body as any);
    } else {
      const result = patchNodeAndDOM(currentDocument, newDocument, body as any, map);
      currentDocument = result.node;
      map = result.map;

      const expBody = fakeDocument.createElement("body");
      renderDOM2(newDocument, expBody as any);
      expect(body.toString()).to.eql(expBody.toString());
    }
  }
}
Example #2
0
 it(`can render a component with named slots`, async () => {
   const document = new FakeDocument();
   const body = document.createElement("body");
   const slimDoc = await runPCComponent({
     "entry.pc": `
       <component id="test">
         <template>
           <span><slot></slot><slot name="a"></slot><slot name="b"></slot></span>
         </template>
         <preview name="main">
           <test>a <span slot="a">b</span><span slot="b">c</span><span slot="b">d</span>e</test>
         </preview>
       </component>
     `
   });
   renderDOM2(slimDoc, body as any);
   expect(body.toString()).to.eql(`<body><test class="__test_scope_host"><span class="__test_scope"><!--section-start-->ae<!--section-end--><!--section-start--><span slot="a">b</span><!--section-end--><!--section-start--><span slot="b">c</span><span slot="b">d</span><!--section-end--></span></test></body>`);
 });
Example #3
0
 it(`can render a component with a template`, async () => {
   const document = new FakeDocument();
   const body = document.createElement("body");
   const slimDoc = await runPCComponent({
     "entry.pc": `
       <component id="test">
         <template>
           <span>hello</span>
         </template>
         <preview name="main">
           <test />
         </preview>
       </component>
     `
   });
   renderDOM2(slimDoc, body as any);
   expect(body.toString()).to.eql(`<body><test class="__test_scope_host"><span class="__test_scope">hello</span></test></body>`);
 });
Example #4
0
 mount.addEventListener("load", () => {
   emit(renderDOM2(doc, mount.contentDocument.body));
 });