[bugfix] popup scrollable element (#429)

packages/mixins/popup/index.js

@@ -1,5 +1,6 @@
 import manager from './popup-manager';
 import context from './popup-context';
+import scrollUtils from '../../utils/scroll';
 
 export default {
   props: {
@@ -58,7 +59,7 @@ export default {
       const dx = e.touches[0].clientX - pos.x;
       const dy = e.touches[0].clientY - pos.y;
       const direction = dy > 0 ? '10' : '01';
-      const el = this.$el.querySelector('.scroller') || this.$el;
+      const el = scrollUtils.getScrollEventTarget(e.target, this.$el);
       const scrollTop = el.scrollTop;
       const scrollHeight = el.scrollHeight;
       const offsetHeight = el.offsetHeight;

packages/utils/scroll.js

@@ -23,18 +23,22 @@ export default {
     };
   },
 
-  // 找到最近的触发滚动事件的元素
-  getScrollEventTarget(element) {
+  /* 找到最近的触发滚动事件的元素
+   * @param {Element} element
+	 * @param {Element} rootElement
+	 * @return {Element | window}
+   */
+  getScrollEventTarget(element, rootParent = window) {
     let currentNode = element;
     // bugfix, see http://w3help.org/zh-cn/causes/SD9013 and http://stackoverflow.com/questions/17016740/onscroll-function-is-not-working-for-chrome
-    while (currentNode && currentNode.tagName !== 'HTML' && currentNode.tagName !== 'BODY' && currentNode.nodeType === 1) {
+    while (currentNode && currentNode.tagName !== 'HTML' && currentNode.tagName !== 'BODY' && currentNode.nodeType === 1 && currentNode !== rootParent) {
       const overflowY = this.getComputedStyle(currentNode).overflowY;
       if (overflowY === 'scroll' || overflowY === 'auto') {
         return currentNode;
       }
       currentNode = currentNode.parentNode;
     }
-    return window;
+    return rootParent;
   },
 
   // 判断元素是否被加入到页面节点内