@whitesev/domutils 1.9.9 → 1.9.10

package/dist/index.umd.js

@@ -4,7 +4,7 @@
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.DOMUtils = factory());
 })(this, (function () { 'use strict';
 
-  const version = "1.9.9";
+  const version = "1.9.10";
 
   class WindowApi {
       /** 默认的配置 */
@@ -1384,7 +1384,7 @@
            * @param startIndex
            * @param option
            */
-          function getOption(args, startIndex, option) {
+          const getOption = function (args, startIndex, option) {
               const currentParam = args[startIndex];
               if (typeof currentParam === "boolean") {
                   option.capture = currentParam;
@@ -1406,7 +1406,7 @@
                   option.isComposedPath = currentParam.isComposedPath;
               }
               return option;
-          }
+          };
           const that = this;
           // eslint-disable-next-line prefer-rest-params
           const args = arguments;
@@ -1464,39 +1464,52 @@
           /**
            * 如果是once，那么删除该监听和元素上的事件和监听
            */
-          const checkOptionOnceToRemoveEventListener = () => {
+          const checkOptionOnceToRemoveEventListener = ($el) => {
               if (listenerOption.once) {
-                  that.off(element, eventType, selector, callback, option);
+                  this.off($el, eventTypeList, selector, callback, option);
               }
           };
-          $elList.forEach((elementItem) => {
+          $elList.forEach(($elItem) => {
               /**
                * 事件回调
                * @param event
                */
               const handlerCallBack = function (event) {
+                  let call_this = void 0;
+                  let call_event = void 0;
+                  let call_$selector = void 0;
+                  let execCallback = false;
                   if (selectorList.length) {
-                      /* 存在子元素选择器 */
+                      // 存在子元素选择器
                       // 这时候的this和target都是子元素选择器的元素
-                      let eventTarget = listenerOption.isComposedPath
-                          ? event.composedPath()[0]
-                          : event.target;
-                      let totalParent = elementItem;
-                      if (CommonUtils.isWin(totalParent)) {
-                          if (totalParent === that.windowApi.document) {
-                              totalParent = that.windowApi.document.documentElement;
+                      let $target;
+                      if (listenerOption.isComposedPath) {
+                          // 可能为空
+                          const composedPath = event.composedPath();
+                          if (!composedPath.length && event.target) {
+                              composedPath.push(event.target);
                           }
+                          $target = composedPath[0];
+                      }
+                      else {
+                          $target = event.target;
+                      }
+                      let $parent = $elItem;
+                      if (CommonUtils.isWin($parent)) {
+                          // window和document共用一个对象
+                          // 这样就能处理子元素选择器无法匹配的问题
+                          $parent = that.windowApi.document.documentElement;
                       }
-                      const findValue = selectorList.find((selectorItem) => {
+                      const findValue = selectorList.find((selectors) => {
                           // 判断目标元素是否匹配选择器
-                          if (that.matches(eventTarget, selectorItem)) {
-                              /* 当前目标可以被selector所匹配到 */
+                          if (that.matches($target, selectors)) {
+                              // 当前目标可以被selector所匹配到
                               return true;
                           }
-                          /* 在上层与主元素之间寻找可以被selector所匹配到的 */
-                          const $closestMatches = that.closest(eventTarget, selectorItem);
-                          if ($closestMatches && totalParent?.contains?.($closestMatches)) {
-                              eventTarget = $closestMatches;
+                          // 在上层与主元素之间寻找可以被selector所匹配到的
+                          const $closestMatches = that.closest($target, selectors);
+                          if ($closestMatches && $parent?.contains?.($closestMatches)) {
+                              $target = $closestMatches;
                               return true;
                           }
                           return false;
@@ -1506,29 +1519,38 @@
                           try {
                               OriginPrototype.Object.defineProperty(event, "target", {
                                   get() {
-                                      return eventTarget;
+                                      return $target;
                                   },
                               });
+                              // oxlint-disable-next-line no-empty
                           }
-                          catch {
-                              // TODO
-                          }
-                          listenerCallBack.call(eventTarget, event, eventTarget);
-                          checkOptionOnceToRemoveEventListener();
+                          catch { }
+                          execCallback = true;
+                          call_this = $target;
+                          call_event = event;
+                          call_$selector = $target;
                       }
                   }
                   else {
-                      // 这时候的this指向监听的元素
-                      listenerCallBack.call(elementItem, event);
-                      checkOptionOnceToRemoveEventListener();
+                      execCallback = true;
+                      call_this = $elItem;
+                      call_event = event;
+                  }
+                  if (execCallback) {
+                      const result = listenerCallBack.call(call_this, call_event, call_$selector);
+                      checkOptionOnceToRemoveEventListener($elItem);
+                      if (typeof result === "boolean" && !result) {
+                          return false;
+                      }
                   }
               };
-              /* 遍历事件名设置元素事件 */
+              // 遍历事件名设置元素事件
               eventTypeList.forEach((eventName) => {
-                  elementItem.addEventListener(eventName, handlerCallBack, listenerOption);
-                  /* 获取对象上的事件 */
-                  const elementEvents = Reflect.get(elementItem, GlobalData.domEventSymbol) || {};
-                  /* 初始化对象上的xx事件 */
+                  // add listener
+                  $elItem.addEventListener(eventName, handlerCallBack, listenerOption);
+                  // 获取对象上的事件
+                  const elementEvents = Reflect.get($elItem, GlobalData.domEventSymbol) || {};
+                  // 初始化对象上的xx事件
                   elementEvents[eventName] = elementEvents[eventName] || [];
                   elementEvents[eventName].push({
                       selector: selectorList,
@@ -1536,8 +1558,8 @@
                       handlerCallBack: handlerCallBack,
                       callback: listenerCallBack,
                   });
-                  /* 覆盖事件 */
-                  Reflect.set(elementItem, GlobalData.domEventSymbol, elementEvents);
+                  // 覆盖事件
+                  Reflect.set($elItem, GlobalData.domEventSymbol, elementEvents);
               });
           });
           return {
@@ -1551,7 +1573,7 @@
               /**
                * 主动触发事件
                * @param extraDetails 赋予触发的Event的额外属性，如果是Event类型，那么将自动代替默认new的Event对象
-               * @param useDispatchToTriggerEvent 是否使用dispatchEvent来触发事件，默认true，如果为false，则直接调用callback，但是这种会让使用了$selector的没有值
+               * @param useDispatchToTriggerEvent 是否使用dispatchEvent来触发事件，默认true，如果为false，则直接调用callback，但是这种会让使用了`$selector`的没有值
                */
               emit: (extraDetails, useDispatchToTriggerEvent) => {
                   that.emit($elList, eventTypeList, extraDetails, useDispatchToTriggerEvent);
@@ -1565,7 +1587,7 @@
            * @param startIndex
            * @param option
            */
-          function getOption(args1, startIndex, option) {
+          const getOption = function (args1, startIndex, option) {
               const currentParam = args1[startIndex];
               if (typeof currentParam === "boolean") {
                   option.capture = currentParam;
@@ -1574,7 +1596,7 @@
                   option.capture = currentParam.capture;
               }
               return option;
-          }
+          };
           const that = this;
           // eslint-disable-next-line prefer-rest-params
           const args = arguments;
@@ -1632,7 +1654,7 @@
               filter = option;
           }
           $elList.forEach(($elItem) => {
-              /* 获取对象上的事件 */
+              // 获取对象上的事件
               const elementEvents = Reflect.get($elItem, GlobalData.domEventSymbol) || {};
               eventTypeList.forEach((eventName) => {
                   const handlers = elementEvents[eventName] || [];
@@ -1665,7 +1687,7 @@
                       }
                   }
                   if (handlers.length === 0) {
-                      /* 如果没有任意的handler，那么删除该属性 */
+                      // 如果没有任意的handler，那么删除该属性
                       CommonUtils.delete(elementEvents, eventType);
                   }
               });
@@ -2426,11 +2448,11 @@
            * 阻止事件的默认行为发生，并阻止事件传播
            */
           const stopEvent = (event, onlyStopPropagation) => {
+              // 停止事件的传播，阻止它继续向更上层的元素冒泡，事件将不会再传播给其他的元素
+              event?.stopPropagation();
+              // 阻止事件传播，并且还能阻止元素上的其他事件处理程序被触发
+              event?.stopImmediatePropagation();
               if (typeof onlyStopPropagation === "boolean" && onlyStopPropagation) {
-                  // 停止事件的传播，阻止它继续向更上层的元素冒泡，事件将不会再传播给其他的元素
-                  event?.stopPropagation();
-                  // 阻止事件传播，并且还能阻止元素上的其他事件处理程序被触发
-                  event?.stopImmediatePropagation();
                   return;
               }
               // 阻止事件的默认行为发生。例如，当点击一个链接时，浏览器会默认打开链接的URL，或者在输入框内输入文字