Fix and optimize closeOnBlur behavior

jsor · Sep 7, 2018 · ab73220 · ab73220
1 parent 3527abd
commit ab73220
Show file tree

Hide file tree

Showing 8 changed files with 12 additions and 11 deletions.
diff --git a/README.md b/README.md
@@ -339,6 +339,9 @@ This can be combined with the [context](#context) option to only allow multiple
 open targets inside a context element. 
 See the [accordion example](examples/accordion/) for a use-case.
 
+> To allow multiple open targets, [`closeOnBlur`](#closeonblur) must be set to
+  `false`.
+
 #### Example
 
 ```js

diff --git a/dist/ctrly-es2015.js b/dist/ctrly-es2015.js
@@ -146,9 +146,8 @@ function ctrly(opts = {}) {
             removeFuncs.push(
                 on(target, 'focusout', e => {
                     if (
-                        e.relatedTarget &&
-                        !target.contains(e.relatedTarget) &&
-                        !closest(e.relatedTarget, controlSelector)
+                        !e.relatedTarget ||
+                        !target.contains(e.relatedTarget)
                     ) {
                         close(target, false);
                     }

diff --git a/dist/ctrly-module.js b/dist/ctrly-module.js
@@ -414,7 +414,7 @@ function ctrly() {
     }
     if (options.closeOnBlur && !options.trapFocus) {
       removeFuncs.push(on(target, 'focusout', function (e) {
-        if (e.relatedTarget && !target.contains(e.relatedTarget) && !closest(e.relatedTarget, controlSelector)) {
+        if (!e.relatedTarget || !target.contains(e.relatedTarget)) {
           close(target, false);
         }
       }, {

diff --git a/dist/ctrly.js b/dist/ctrly.js
@@ -420,7 +420,7 @@
         }
         if (options.closeOnBlur && !options.trapFocus) {
           removeFuncs.push(on(target, 'focusout', function (e) {
-            if (e.relatedTarget && !target.contains(e.relatedTarget) && !closest(e.relatedTarget, controlSelector)) {
+            if (!e.relatedTarget || !target.contains(e.relatedTarget)) {
               close(target, false);
             }
           }, {

diff --git a/dist/ctrly.min.js b/dist/ctrly.min.js
diff --git a/src/ctrly.js b/src/ctrly.js
@@ -192,9 +192,8 @@ export default function ctrly(opts = {}) {
             removeFuncs.push(
                 on(target, 'focusout', e => {
                     if (
-                        e.relatedTarget &&
-                        !target.contains(e.relatedTarget) &&
-                        !closest(e.relatedTarget, controlSelector)
+                        !e.relatedTarget ||
+                        !target.contains(e.relatedTarget)
                     ) {
                         close(target, false);
                     }

diff --git a/test/test.allow-multiple.js b/test/test.allow-multiple.js
@@ -27,7 +27,7 @@ describe('ctrly(allowMultiple)', () => {
     it('allows multiple when configured', done => {
         const {control, target, control2, target2} = fixture.refs;
 
-        ctrlyInstance = ctrly({allowMultiple: true});
+        ctrlyInstance = ctrly({allowMultiple: true, closeOnBlur: false});
 
         ready(() => {
             assertClosed(control, target);

diff --git a/test/test.context.js b/test/test.context.js
@@ -27,7 +27,7 @@ describe('ctrly(context)', () => {
     it('handles target inside context', done => {
         const {control, target, control2, target2} = fixture.refs;
 
-        ctrlyInstance = ctrly({context: '.context'});
+        ctrlyInstance = ctrly({context: '.context', closeOnBlur: false});
 
         ready(() => {
             assertClosed(control, target);