diff --git a/packages/runtime-core/src/renderer.ts b/packages/runtime-core/src/renderer.ts
index 929ea38f..1fc36b4d 100644
--- a/packages/runtime-core/src/renderer.ts
+++ b/packages/runtime-core/src/renderer.ts
@@ -102,7 +102,11 @@ export interface RendererOptions<
): void
insert(el: HostNode, parent: HostElement, anchor?: HostNode | null): void
remove(el: HostNode): void
- createElement(type: string, isSVG?: boolean): HostElement
+ createElement(
+ type: string,
+ isSVG?: boolean,
+ isCustomizedBuiltIn?: string
+ ): HostElement
createText(text: string): HostNode
createComment(text: string): HostNode
setText(node: HostNode, text: string): void
@@ -549,7 +553,11 @@ function baseCreateRenderer(
// exactly the same, and we can simply do a clone here.
el = vnode.el = hostCloneNode(vnode.el)
} else {
- el = vnode.el = hostCreateElement(vnode.type as string, isSVG)
+ el = vnode.el = hostCreateElement(
+ vnode.type as string,
+ isSVG,
+ props && props.is
+ )
// props
if (props) {
for (const key in props) {
diff --git a/packages/runtime-dom/__tests__/customizedBuiltIn.spec.ts b/packages/runtime-dom/__tests__/customizedBuiltIn.spec.ts
new file mode 100644
index 00000000..4d957aff
--- /dev/null
+++ b/packages/runtime-dom/__tests__/customizedBuiltIn.spec.ts
@@ -0,0 +1,20 @@
+import { render, h } from '@vue/runtime-dom'
+
+describe('customimized built-in elements support', () => {
+ let createElement: jest.SpyInstance
+ afterEach(() => {
+ createElement.mockRestore()
+ })
+
+ test('should created element with is option', () => {
+ const root = document.createElement('div')
+ createElement = jest.spyOn(document, 'createElement')
+ render(h('button', { is: 'plastic-button' }), root)
+ expect(createElement.mock.calls[0]).toMatchObject([
+ 'button',
+ { is: 'plastic-button' }
+ ])
+ // should also render the attribute
+ expect(root.innerHTML).toBe(``)
+ })
+})
diff --git a/packages/runtime-dom/src/nodeOps.ts b/packages/runtime-dom/src/nodeOps.ts
index e19815ab..38b494eb 100644
--- a/packages/runtime-dom/src/nodeOps.ts
+++ b/packages/runtime-dom/src/nodeOps.ts
@@ -22,8 +22,10 @@ export const nodeOps: Omit, 'patchProp'> = {
}
},
- createElement: (tag, isSVG): Element =>
- isSVG ? doc.createElementNS(svgNS, tag) : doc.createElement(tag),
+ createElement: (tag, isSVG, is): Element =>
+ isSVG
+ ? doc.createElementNS(svgNS, tag)
+ : doc.createElement(tag, is ? { is } : undefined),
createText: text => doc.createTextNode(text),