Popover: add show/hide event

examples/docs/en-US/popover.md

@@ -225,3 +225,8 @@ Of course, you can nest other operations. It's more light-weight than using a di
 | — | text content of popover |
 | reference | HTML element that triggers popover |
 
+### Events
+| Event Name | Description | 回调参数 |
+|---------|--------|---------|
+| show | triggers when popover shows | - |
+| hide | triggers when popover hides | - |

examples/docs/zh-CN/popover.md

@@ -251,3 +251,9 @@ Popover 的属性与 Tooltip 很类似，它们都是基于`Vue-popper`开发的
 |--- | ---|
 | — | Popover 内嵌 HTML 文本 |
 | reference | 触发 Popover 显示的 HTML 元素 |
+
+### Events
+| 事件名称 | 说明 | 回调参数 |
+|---------|--------|---------|
+| show | 显示时触发 | — |
+| hide | 隐藏时触发 | — |

packages/popover/src/main.vue

@@ -44,6 +44,12 @@ export default {
     }
   },
 
+  watch: {
+    showPopper(newVal, oldVal) {
+      newVal ? this.$emit('show') : this.$emit('hide');
+    }
+  },
+
   mounted() {
     let reference = this.reference || this.$refs.reference;
     const popper = this.popper || this.$refs.popper;

test/unit/specs/popover.spec.js

@@ -205,6 +205,59 @@ describe('Popover', () => {
     });
   });
 
+  describe('event', (done) => {
+    const createVM = (trigger) => {
+      return createVue({
+        template: `
+          <div>
+            <el-popover
+              ref="popover"
+              trigger="${trigger}"
+              @show="handleShow"
+              @hide="handleHide"
+              content="content">
+              <button slot="reference">trigger ${trigger}</button>
+            </el-popover>
+          </div>
+        `,
+
+        methods: {
+          handleShow() {
+            this.trigger = true;
+          },
+          handleHide() {
+            this.trigger = false;
+          }
+        },
+
+        data() {
+          return {
+            trigger: false
+          };
+        }
+      }, true);
+    };
+
+    it('show/hide', () => {
+      vm = createVM('click');
+      const compo = vm.$refs.popover;
+
+      vm.$el.querySelector('button').click();
+      expect(compo.showPopper).to.true;
+      expect(vm.trigger).to.false;
+      document.body.click();
+      expect(compo.showPopper).to.false;
+      setTimeout(_ => {
+        expect(vm.trigger).to.true;
+        document.body.click();
+        setTimeout(_ => {
+          expect(vm.trigger).to.false;
+        }, 50);
+        done();
+      }, 50);
+    });
+  });
+
   it('destroy event', () => {
     vm = createTest(Popover, {
       reference: document.createElement('div'),