fix(binder): should bind on penetrate node whatevent plugin want to l…

…isten to event

related to #128

__tests__/situation/penetrate.js

@@ -0,0 +1,27 @@
+import Chimee from 'index';
+test('chimee penetrate event forward bug', () => {
+  const fn = jest.fn();
+  const plugin1 = {
+    name: 'plugin1',
+    penetrate: false,
+    inited() {
+      this.$on('click', fn);
+    },
+  };
+  const plugin2 = {
+    name: 'plugin2',
+    penetrate: true,
+  };
+  Chimee.install(plugin1);
+  Chimee.install(plugin2);
+  const player = new Chimee({
+    wrapper: document.createElement('div'),
+    plugins: [
+      plugin1.name,
+      plugin2.name,
+    ],
+  });
+  player.$plugins.plugin2.$dom.click();
+  expect(fn).toHaveBeenCalledTimes(1);
+  player.destroy();
+});

demo/chimee-plugin-controlbar/index.css

@@ -59,3 +59,12 @@ button:active {
   background-color: #36384A;
 }
 
+.my-plugin {
+  position: absolute;
+  width: 300px;
+  height: 300px;
+  top: 0;
+  right: 0;
+  background-color: #9D295A;
+}
+

demo/chimee-plugin-controlbar/index.js

@@ -1,21 +1,26 @@
 const Chimee = window.Chimee;
 const chimeePluginControlbar = window.chimeePluginControlbar;
+const myPlugin = {
+  name: 'my-plugin',
+  penetrate: true,
+  el: '<div class="my-plugin"></div>',
+  create() {},
+  events: {
+    // click(evt) {
+    //   console.warn(evt);
+    // },
+  },
+};
 Chimee.install(chimeePluginControlbar);
+Chimee.install(myPlugin);
 const player = new Chimee({
   // 播放地址
-  // src: 'http://cdn.toxicjohann.com/lostStar.mp4',
   src: 'http://cdn.toxicjohann.com/%E4%BA%8E%E6%98%AF.mp4',
-  // src: 'http://yunxianchang.live.ujne7.com/vod-system-bj/TL1ce1196bce348070bfeef2116efbdea6.flv',
-  // src: 'http://yunxianchang.live.ujne7.com/vod-system-bj/79_3041054cc65-ae8c-4b63-8937-5ccb05f79720.m3u8',
-  // dom容器
   wrapper: '#wrapper',
-  plugin: [ chimeePluginControlbar.name ],
-  // preset: {
-  //   flv: window.chimeeKernelFlv,
-  //   hls: window.chimeeKernelHls
-  // },
-  // width: 60,
-  // height: 90,
+  plugin: [
+    chimeePluginControlbar.name,
+    myPlugin.name,
+  ],
   autoplay: true,
   controls: true,
   muted: true,

package.json

@@ -74,7 +74,7 @@
     "core-js": "^2.5.7",
     "eslint": "^4.19.1",
     "eslint-config-egg": "^7.0.0",
-    "eslint-plugin-flowtype": "^2.47.1",
+    "eslint-plugin-flowtype": "^2.48.0",
     "eslint-plugin-jest": "^21.17.0",
     "flow-bin": "^0.73.0",
     "husky": "^0.14.3",

src/dispatcher/binder.js

@@ -356,16 +356,8 @@ export default class Binder {
       fn = (...args) => this.trigger({ target, name, id: target }, ...args);
       this._addEventOnDom(targetDom, name, fn);
     } else if (target === 'video-dom') {
-      if (!this.__dispatcher.plugins[id]) {
-        // The plugin has not been created
-        // We will be better to wait for it in order to check its penetrate
-        this.needToCheckPendingVideoDomEventPlugins[id] = true;
-        this.addPendingEvent(target, name, id);
-        return;
-      }
-      const { $penetrate = false } = this.__dispatcher.plugins[id] || {};
       fn = (...args) => this.triggerSync({ target, name, id: target }, ...args);
-      if ($penetrate) this.__dispatcher.dom.videoExtendedNodes.forEach(node => this._addEventOnDom(node, name, fn));
+      this.__dispatcher.dom.videoExtendedNodes.forEach(node => this._addEventOnDom(node, name, fn));
       this._addEventOnDom(targetDom, name, fn);
     }
     this.bindedEventNames[target].push(name);