]> git.ipfire.org Git - thirdparty/vuejs/core.git/commitdiff
Merge branch 'main' into edison/feat/ce_attachInternals
authoredison <daiwei521@126.com>
Thu, 17 Oct 2024 03:46:11 +0000 (11:46 +0800)
committerGitHub <noreply@github.com>
Thu, 17 Oct 2024 03:46:11 +0000 (11:46 +0800)
1  2 
packages/runtime-dom/__tests__/customElement.spec.ts

index cdfcd602152e30baeb2599613c421f74cc522411,6b9f7d1391e3a3c10f604e7134f89b5a00c7e63d..6f19ce08e82fe83f34ec6894a79bf7da46366b74
@@@ -1403,17 -1387,38 +1403,52 @@@ describe('defineCustomElement', () => 
      expect(e.shadowRoot!.innerHTML).toBe(`false,boolean`)
    })
  
 +  test('support attachInternals method', () => {
 +    const E = defineCustomElement({
 +      formAssociated: true,
 +      render() {
 +        return h('div', 'hello')
 +      },
 +    })
 +    customElements.define('my-el-attach-internals', E)
 +    container.innerHTML = `<my-el-attach-internals></my-el-attach-internals>`
 +    const e = container.childNodes[0] as VueElement
 +    expect(e.shadowRoot!.innerHTML).toBe(`<div>hello</div>`)
 +    expect(e._internals).toBeTruthy()
 +  })
++  
+   test('hyphenated attr removal', async () => {
+     const E = defineCustomElement({
+       props: {
+         fooBar: {
+           type: Boolean,
+         },
+       },
+       render() {
+         return this.fooBar
+       },
+     })
+     customElements.define('el-hyphenated-attr-removal', E)
+     const toggle = ref(true)
+     const Comp = {
+       render() {
+         return h('el-hyphenated-attr-removal', {
+           'foo-bar': toggle.value ? '' : null,
+         })
+       },
+     }
+     render(h(Comp), container)
+     const el = container.children[0]
+     expect(el.hasAttribute('foo-bar')).toBe(true)
+     expect((el as any).outerHTML).toBe(
+       `<el-hyphenated-attr-removal foo-bar=""></el-hyphenated-attr-removal>`,
+     )
+     toggle.value = false
+     await nextTick()
+     expect(el.hasAttribute('foo-bar')).toBe(false)
+     expect((el as any).outerHTML).toBe(
+       `<el-hyphenated-attr-removal></el-hyphenated-attr-removal>`,
+     )
+   })
  })