Fix waterfall hide bug (#166)

* fix: waterfall: prevent loadMore after hide

* feat: add waterfall hidden test && remove waterfall auto install

* delete useless code

test/unit/components/waterfall/waterfall-hide.vue

@@ -0,0 +1,45 @@
+<script>
+  import Waterfall from 'packages/waterfall';
+
+  export default {
+    props: {
+      disabled: Boolean,
+      list: Array,
+      onWaterfallLower: {
+        type: Function,
+        default() {
+          return function() {};
+        }
+      }
+    },
+    directives: {
+      WaterfallLower: Waterfall('lower')
+    },
+    methods: {
+      triggerWaterfallLower() {
+        this.onWaterfallLower();
+      }
+    }
+  };
+</script>
+
+<template>
+  <div
+    v-waterfall-lower="triggerWaterfallLower"
+    waterfall-disabled="disabled"
+    class="waterfall--hidden"
+  >
+    <div
+      v-for="item in list"
+      class="waterfall-item"
+    >{{ item.id }}</div>
+  </div>
+</template>
+
+<style>
+.waterfall--hidden {
+  overflow: scroll;
+  height: 100px;
+  display: none;
+}
+</style>

test/unit/get-webpack-conf.js

@@ -58,7 +58,10 @@ function getWebpackConfig(testFileName) {
         },
         {
           test: /\.(css|pcss)$/,
-          use: ['style-loader', 'css-loader', 'postcss-loader']
+          use: ['style-loader', 'css-loader', {
+            loader: 'postcss-loader',
+            options: { sourceMap: true }
+          }]
         },
         {
           test: /\.(gif|png|jpe?g)(\?\S*)?$/,
@@ -75,13 +78,16 @@ function getWebpackConfig(testFileName) {
           ]
         },
         {
-          test: /test\/unit\/components\/.*\.vue$|packages\/swipe\/.*\.vue$/,
+          test: /test\/unit\/components\/.*\.vue$|packages\/swipe.*\.vue$/,
           use: [
             {
               loader: 'vue-loader',
               options: {
                 loaders: {
-                  css: ['style-loader', 'css-loader', 'postcss-loader']
+                  css: ['style-loader', 'css-loader', {
+                    loader: 'postcss-loader',
+                    options: { sourceMap: true }
+                  }]
                 }
               }
             }
@@ -89,13 +95,16 @@ function getWebpackConfig(testFileName) {
         },
         {
           test: /packages\/.*\.vue$/,
-          exclude: /packages\/swipe\/.*\.vue$/,
+          exclude: /packages\/swipe.*\.vue$/,
           use: [
             {
               loader: 'vue-loader',
               options: {
                 loaders: {
-                  css: ['style-loader', 'css-loader', 'postcss-loader'],
+                  css: ['style-loader', 'css-loader', {
+                    loader: 'postcss-loader',
+                    options: { sourceMap: true }
+                  }],
                   js: ['isparta-loader']
                 }
               }

test/unit/specs/waterfall.spec.js

@@ -1,4 +1,5 @@
 import Waterfall from '../components/waterfall/waterfall';
+import HiddenWaterfall from '../components/waterfall/waterfall-hide';
 import { mount } from 'avoriaz';
 
 describe('Waterfall', () => {
@@ -69,4 +70,22 @@ describe('Waterfall', () => {
       done();
     }, 500);
   });
+
+  it('test waterfall function after hide', (done) => {
+    const waterfallLowerSpy = sinon.spy();
+    wrapper = mount(HiddenWaterfall, {
+      attachToDocument: true,
+      propsData: {
+        show: false,
+        disabled: false,
+        list: [{ id: 10 }],
+        onWaterfallLower: waterfallLowerSpy
+      }
+    });
+
+    setTimeout(() => {
+      expect(waterfallLowerSpy.called).to.be.false;
+      done();
+    }, 500);
+  });
 });