feat: Make lib work with shadow dom - use composedPath

Pomax / react-onclickoutside

An onClickOutside wrapper for React components

MIT License

1.83k stars 187 forks source link

feat: Make lib work with shadow dom - use composedPath #324

Closed newying61 closed 3 years ago

newying61 commented 5 years ago

@Pomax , @cameronbraid Hi, this is a possible solution for making lib work inside shadowDOM.

I added tests.js which renders react app inside a shadow DOM.

Got an error when build the project. Will look into it later.

mbIkola commented 5 years ago

Got an error when build the project. Will look into it later.

warnings option added to a wrong place.

Following patch should fix your build:

diff --git a/rollup.config.js b/rollup.config.js
index 9f59da4..dcc9e01 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -39,9 +39,9 @@ const prodUmdConfig = mergeAll([
         compress: {
           pure_getters: true,
           unsafe: true,
-          unsafe_comps: true,
-          warnings: false,
+          unsafe_comps: true
         },
+        warnings: true
       })
     ),
   },

Details: UglifyJS compress options and minify options

newying61 commented 5 years ago

@mbIkola Thanks for the advice. Will update next week.

newying61 commented 5 years ago

@mbIkola Thanks. Build succeeded. Tests all passed.

By the way, any reason using closed mode shadow DOM? Like avoid abusing .shadowRoot? There is really little benefit we can get from { mode: 'closed' }.