diff --git a/src/index.js b/src/index.js
index 4409bd7..d30bb50 100644
--- a/src/index.js
+++ b/src/index.js
@@ -9,7 +9,11 @@ import {
convertAttributeValue
} from './utils.js'
-export default function wrap (Vue, Component) {
+const defaults = {
+ shadowMode: 'open'
+}
+
+export default function wrap (Vue, Component, { shadowMode } = defaults) {
const isAsync = typeof Component === 'function' && !Component.cid
let isInitialized = false
let hyphenatedPropsList
@@ -81,7 +85,7 @@ export default function wrap (Vue, Component) {
class CustomElement extends HTMLElement {
constructor () {
const self = super()
- self.attachShadow({ mode: 'open' })
+ self.attachShadow({ mode: shadowMode })
const wrapper = self._wrapper = new Vue({
name: 'shadow-root',
diff --git a/test/fixtures/options.html b/test/fixtures/options.html
new file mode 100644
index 0000000..f577b9f
--- /dev/null
+++ b/test/fixtures/options.html
@@ -0,0 +1,10 @@
+
+
+
+
diff --git a/test/test.js b/test/test.js
index 9f60f7f..4cca6c8 100644
--- a/test/test.js
+++ b/test/test.js
@@ -107,6 +107,14 @@ test('lifecycle', async () => {
expect(logs).toContain('activated')
})
+test('options', async () => {
+ const { page } = await launchPage(`options`)
+
+ expect(await page.evaluate(() => {
+ return document.querySelector('my-element').shadowRoot
+ })).toBeNull()
+})
+
test('async', async () => {
const { page } = await launchPage(`async`)
diff --git a/types/index.d.ts b/types/index.d.ts
index 8b67b7b..09a31e9 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -2,7 +2,8 @@ import _Vue, { Component, AsyncComponent } from 'vue'
declare function wrap(
Vue: typeof _Vue,
- Component: Component | AsyncComponent
+ Component: Component | AsyncComponent,
+ options: { shadowMode?: 'closed' | 'open' }
): HTMLElement
-export default wrap
+export default wrap
\ No newline at end of file