Rendering Downshift in a ShadowRoot
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// this check is borrowed from react | |
const isProxySupported = | |
typeof Proxy === 'function' && | |
// https://github.com/facebook/react/issues/12011 | |
!Object.isSealed(new Proxy({}, {})); | |
function createProxyEnvironment(shadowRoot) { | |
const doc = shadowRoot.ownerDocument; | |
const properties = { | |
document: doc, | |
addEventListener: doc.addEventListener.bind(shadowRoot), | |
removeEventListener: doc.removeEventListener.bind(shadowRoot), | |
}; | |
// check if Proxy is supported because of IE and older Safari versions | |
if (isProxySupported) { | |
return new Proxy(shadowRoot, { | |
get: (_, prop) => properties[prop], | |
}) | |
} | |
// fallback for es5-compatible environments (can be removed if it's unnecessary) | |
return Object.create(shadowRoot, Object.keys(properties).reduce((res, key) => { | |
res[key] = { | |
get: () => properties[key], | |
}; | |
return res; | |
}, {})); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment