glass-easel-miniprogram-adapter 0.1.1 → 0.2.0

package/tests/space.test.ts

@@ -21,11 +21,15 @@ describe('define', () => {
     codeSpace.addStyleSheet('app', 'app.css')
     codeSpace.addStyleSheet('path/to/comp', 'path/to/comp.css')
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div class="ab">{{a}}-{{b}}</div>
-    `))
+    `),
+    )
 
-    const beh = codeSpace.behavior()
+    const beh = codeSpace
+      .behavior()
       .definition({
         data: {
           a: 123,
@@ -33,7 +37,8 @@ describe('define', () => {
       })
       .register()
 
-    codeSpace.component('path/to/comp')
+    codeSpace
+      .component('path/to/comp')
       .definition({
         behaviors: [beh],
         properties: {
@@ -56,11 +61,14 @@ describe('define', () => {
 
     codeSpace.addComponentStaticConfig('path/to/comp', {})
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div>{{a}}-{{b}}-{{c}}</div>
-    `))
+    `),
+    )
 
-    const g = {} as { Behavior: BehaviorConstructor, Component: ComponentConstructor }
+    const g = {} as { Behavior: BehaviorConstructor; Component: ComponentConstructor }
     codeSpace.globalComponentEnv(g, 'path/to/comp', () => {
       const Behavior = g.Behavior
       const Component = g.Component
@@ -76,6 +84,8 @@ describe('define', () => {
         },
       })
 
+      const traitBeh = Behavior.trait<{ a: () => void }>()
+
       Component({
         options: {
           propertyEarlyInit: true,
@@ -87,12 +97,14 @@ describe('define', () => {
         data: () => ({
           c: 789,
         }),
-        observers: [{
-          fields: 'b',
-          observer() {
-            callOrder.push(2)
+        observers: [
+          {
+            fields: 'b',
+            observer() {
+              callOrder.push(2)
+            },
           },
-        }],
+        ],
         created() {
           callOrder.push(3)
         },
@@ -113,14 +125,20 @@ describe('define', () => {
           callOrder.push(7)
         },
         lifetimes: {
-          invalid() { /* empty */ },
+          invalid() {
+            /* empty */
+          },
         },
         pageLifetimes: {
-          invalid() { /* empty */ },
+          invalid() {
+            /* empty */
+          },
         },
         relations: {
           invalid: {
             type: 'parent',
+            // FIXME the target should accept wrapped behaviors
+            target: traitBeh._$,
           },
         },
         externalClasses: [],
@@ -143,9 +161,12 @@ describe('define', () => {
     const codeSpace = env.createCodeSpace('', true)
     const callOrder = [] as number[]
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div>{{a}}-{{b}}</div>
-    `))
+    `),
+    )
 
     codeSpace.componentEnv('path/to/comp', ({ Behavior, Page }) => {
       const beh = Behavior()
@@ -153,8 +174,8 @@ describe('define', () => {
         .lifetime('attached', function () {
           expect(this.hasBehavior(beh)).toBe(true)
           const self = this as unknown as {
-            myMethod: () => number,
-            myData: any,
+            myMethod: () => number
+            myData: any
           }
           expect(self.myMethod()).toBe(123)
           expect(self.myData).toStrictEqual({ myField: 456 })
@@ -189,13 +210,16 @@ describe('define', () => {
 
     codeSpace.addComponentStaticConfig('comp/a', {
       component: true,
-      generics: {
+      componentGenerics: {
         c: true,
       },
     })
-    codeSpace.addCompiledTemplate('comp/a', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'comp/a',
+      tmpl(`
       <c />
-    `))
+    `),
+    )
     codeSpace.componentEnv('comp/a', ({ Component }) => {
       Component().register()
     })
@@ -203,9 +227,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('comp/b', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('comp/b', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'comp/b',
+      tmpl(`
       <span>B</span>
-    `))
+    `),
+    )
     codeSpace.componentEnv('comp/b', ({ Component }) => {
       Component().register()
     })
@@ -216,9 +243,12 @@ describe('define', () => {
         b: '/comp/b',
       },
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <a generic:c="b" />
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })
@@ -235,9 +265,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('comp/a', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('comp/a', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'comp/a',
+      tmpl(`
       <div>A</div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('comp/a', ({ Component }) => {
       Component().register()
     })
@@ -245,14 +278,18 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('path/to/comp', {
       usingComponents: {
         a: '/comp/b',
+        ph: '/comp/a',
       },
-      placeholder: {
-        a: '/comp/a',
+      componentPlaceholder: {
+        a: 'ph',
       },
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <a />
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })
@@ -264,9 +301,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('comp/b', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('comp/b', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'comp/b',
+      tmpl(`
       <span>B</span>
-    `))
+    `),
+    )
     codeSpace.componentEnv('comp/b', ({ Component }) => {
       Component().register()
     })
@@ -278,9 +318,12 @@ describe('define', () => {
     const env = new MiniProgramEnv()
     const codeSpace = env.createCodeSpace('', true)
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div>{{_a}}-{{b}}</div>
-    `))
+    `),
+    )
 
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component()
@@ -307,9 +350,12 @@ describe('define', () => {
       pureDataPattern: '^_',
     })
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div>{{_a}}-{{b}}</div>
-    `))
+    `),
+    )
 
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component()
@@ -337,9 +383,12 @@ describe('define', () => {
       component: true,
       addGlobalClass: true,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <div class="def"></div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('child/comp', ({ Component }) => {
       Component()
         .options({
@@ -354,11 +403,14 @@ describe('define', () => {
       },
       addGlobalClass: true,
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div class="abc">
         <child />
       </div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })
@@ -366,7 +418,9 @@ describe('define', () => {
     const ab = env.associateBackend()
     ab.registerStyleSheetContent('empty-style-sheet', '')
     const root = ab.createRoot('body', codeSpace, 'path/to/comp')
-    expect(domHtml(root.getComponent())).toBe('<div class="abc"><div class="def child-comp--def"></div></div>')
+    expect(domHtml(root.getComponent())).toBe(
+      '<div class="abc"><div class="def child-comp--def"></div></div>',
+    )
   })
 
   test('options styleIsolation shared', () => {
@@ -378,9 +432,12 @@ describe('define', () => {
       component: true,
       styleIsolation: StyleIsolation.Shared,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <div class="def"></div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('child/comp', ({ Component }) => {
       Component()
         .options({
@@ -396,11 +453,14 @@ describe('define', () => {
       },
       styleIsolation: StyleIsolation.PageShared,
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div class="abc">
         <child />
       </div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })
@@ -420,9 +480,12 @@ describe('define', () => {
       component: true,
       styleIsolation: StyleIsolation.ApplyShared,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <div class="def"></div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('child/comp', ({ Component }) => {
       Component()
         .options({
@@ -438,11 +501,14 @@ describe('define', () => {
       },
       styleIsolation: StyleIsolation.PageApplyShared,
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div class="abc">
         <child />
       </div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })
@@ -450,7 +516,9 @@ describe('define', () => {
     const ab = env.associateBackend()
     ab.registerStyleSheetContent('empty-style-sheet', '')
     const root = ab.createRoot('body', codeSpace, 'path/to/comp')
-    expect(domHtml(root.getComponent())).toBe('<div class="abc comp--abc"><div class="def child-comp--def"></div></div>')
+    expect(domHtml(root.getComponent())).toBe(
+      '<div class="abc comp--abc"><div class="def child-comp--def"></div></div>',
+    )
   })
 
   test('options styleIsolation isolated', () => {
@@ -462,9 +530,12 @@ describe('define', () => {
       component: true,
       styleIsolation: StyleIsolation.Isolated,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <div class="def"></div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('child/comp', ({ Component }) => {
       Component()
         .options({
@@ -480,11 +551,14 @@ describe('define', () => {
       },
       styleIsolation: StyleIsolation.PageIsolated,
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div class="abc">
         <child />
       </div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })
@@ -492,7 +566,9 @@ describe('define', () => {
     const ab = env.associateBackend()
     ab.registerStyleSheetContent('empty-style-sheet', '')
     const root = ab.createRoot('body', codeSpace, 'path/to/comp')
-    expect(domHtml(root.getComponent())).toBe('<div class="comp--abc"><div class="child-comp--def"></div></div>')
+    expect(domHtml(root.getComponent())).toBe(
+      '<div class="comp--abc"><div class="child-comp--def"></div></div>',
+    )
   })
 
   test('options dataDeepCopy', () => {
@@ -529,9 +605,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('child/comp', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <div class="def"></div>
-    `))
+    `),
+    )
     // eslint-disable-next-line arrow-body-style
     const childDef = codeSpace.componentEnv('child/comp', ({ Component }) => {
       return Component()
@@ -550,9 +629,12 @@ describe('define', () => {
       },
       styleIsolation: StyleIsolation.PageIsolated,
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <child id="c" p="{{a}}" />
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component()
         .options({
@@ -584,17 +666,22 @@ describe('define', () => {
     const env = new MiniProgramEnv()
     const codeSpace = env.createCodeSpace('', true)
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div>{{a}}-{{b}}</div>
-    `))
+    `),
+    )
 
-    const beh = codeSpace.behavior()
+    const beh = codeSpace
+      .behavior()
       .data(() => ({
         a: 123,
       }))
       .register()
 
-    const filterBeh = codeSpace.behavior()
+    const filterBeh = codeSpace
+      .behavior()
       .behavior(beh)
       .definition({
         definitionFilter: (def: types.GeneralComponentDefinition) => {
@@ -604,7 +691,8 @@ describe('define', () => {
       })
       .register()
 
-    codeSpace.component('path/to/comp')
+    codeSpace
+      .component('path/to/comp')
       .definition({
         behaviors: [filterBeh],
       })
@@ -619,17 +707,22 @@ describe('define', () => {
     const env = new MiniProgramEnv()
     const codeSpace = env.createCodeSpace('', true)
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div>{{a}}-{{b}}</div>
-    `))
+    `),
+    )
 
-    const beh = codeSpace.behavior()
+    const beh = codeSpace
+      .behavior()
       .data(() => ({
         a: 123,
       }))
       .register()
 
-    codeSpace.component('path/to/comp')
+    codeSpace
+      .component('path/to/comp')
       .behavior(beh)
       .data(() => ({
         b: 456,
@@ -645,13 +738,17 @@ describe('define', () => {
     const env = new MiniProgramEnv()
     const codeSpace = env.createCodeSpace('', true)
 
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div>{{a}}-{{b}}</div>
-    `))
+    `),
+    )
 
     type TAdd = { data: <T>(this: T) => T }
     type TRemove = 'data' | 'property'
-    const beh = codeSpace.behavior()
+    const beh = codeSpace
+      .behavior()
       .chainingFilter<TAdd, TRemove>((chain) => {
         const oldData = chain.data.bind(chain)
         const newData = function () {
@@ -666,7 +763,8 @@ describe('define', () => {
       })
       .register()
 
-    codeSpace.component('path/to/comp')
+    codeSpace
+      .component('path/to/comp')
       .data(() => ({
         b: 456,
       }))
@@ -686,9 +784,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('child/comp', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <div class="a-class"></div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('child/comp', ({ Component }) => {
       Component()
         .options({
@@ -703,11 +804,14 @@ describe('define', () => {
         child: '/child/comp',
       },
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <div class="abc">
         <child a-class="def" />
       </div>
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })
@@ -746,9 +850,12 @@ describe('define', () => {
         child: '/child/comp',
       },
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <child id="c" />
-    `))
+    `),
+    )
     // eslint-disable-next-line arrow-body-style
     const parentType = codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       return Component()
@@ -777,9 +884,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('child/comp', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <span>{{aa}}</span>
-    `))
+    `),
+    )
     codeSpace.componentEnv('child/comp', ({ Component }) => {
       Component()
         .options({
@@ -802,9 +912,12 @@ describe('define', () => {
         child: '/child/comp',
       },
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <child a="{{bb}}" />
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component()
         .data(() => ({
@@ -836,9 +949,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('child/comp', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('child/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/comp',
+      tmpl(`
       <span>{{a}}-{{b}}</span>
-    `))
+    `),
+    )
     codeSpace.componentEnv('child/comp', ({ Component }) => {
       Component()
         .options({
@@ -861,9 +977,12 @@ describe('define', () => {
         child: '/child/comp',
       },
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <child a="{{a}}" />
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component()
         .data(() => ({
@@ -889,9 +1008,12 @@ describe('define', () => {
     codeSpace.addComponentStaticConfig('child/list', {
       component: true,
     })
-    codeSpace.addCompiledTemplate('child/list', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'child/list',
+      tmpl(`
       <div>{{count}}</div><slot />
-    `))
+    `),
+    )
     // eslint-disable-next-line arrow-body-style
     const listDef = codeSpace.componentEnv('child/list', ({ Component }) => {
       return Component()
@@ -935,12 +1057,15 @@ describe('define', () => {
         item: '/child/item',
       },
     })
-    codeSpace.addCompiledTemplate('path/to/comp', tmpl(`
+    codeSpace.addCompiledTemplate(
+      'path/to/comp',
+      tmpl(`
       <list>
         <item />
         <item />
       </list>
-    `))
+    `),
+    )
     codeSpace.componentEnv('path/to/comp', ({ Component }) => {
       Component().register()
     })