NoticeBar: improve test coverage

packages/notice-bar/index.vue

@@ -70,7 +70,7 @@ export default {
     const wrapWidth = this.$refs.contentWrap.getBoundingClientRect().width;
     if (this.scrollable && offsetWidth > wrapWidth) {
       this.offsetWidth = offsetWidth;
-      this.duration = Math.ceil((offsetWidth + wrapWidth) / this.speed);
+      this.duration = (offsetWidth + wrapWidth) / this.speed;
     }
   },
 

test/unit/components/notice-bar.vue

@@ -0,0 +1,16 @@
+<template>
+  <div class="notice-bar-container" style="width: 100px;">
+    <van-notice-bar :speed="speed" :text="text" :mode="mode" :delay="delay" />
+  </div>
+</template>
+
+<script>
+import NoticeBar from 'packages/notice-bar';
+export default {
+  components: {
+    [NoticeBar.name]: NoticeBar
+  },
+  props: ['speed', 'text', 'mode', 'delay']
+};
+</script>
+

test/unit/index.js

@@ -13,4 +13,4 @@ if (process.env.TEST_FILE) {
   });
 } else {
   testsReq.keys().forEach(testsReq);
-}
+}

test/unit/specs/notice-bar.spec.js

@@ -1,4 +1,4 @@
-import NoticeBar from 'packages/notice-bar';
+import NoticeBar from '../components/notice-bar';
 import { mount } from 'avoriaz';
 
 describe('NoticeBar', () => {
@@ -13,7 +13,7 @@ describe('NoticeBar', () => {
       attachToDocument: true
     });
 
-    expect(wrapper.hasClass('van-notice-bar')).to.be.true;
+    expect(wrapper.find('.van-notice-bar').length).to.equal(1);
   });
 
   it('mode closeable', () => {
@@ -45,18 +45,17 @@ describe('NoticeBar', () => {
   it('notice-bar transitionend', (done) => {
     wrapper = mount(NoticeBar, {
       propsData: {
-        text: '足协杯战线连续第2年上演广州德比战，上赛季半决赛上恒大以两回合5-3的总比分淘汰富力。足协杯战线连续第2年上演广州德比战，上赛季半决赛上恒大以两回合5-3的总比分淘汰富力。足协杯战线连续第2年上演广州德比战，上赛季半决赛上恒大以两回合5-3的总比分淘汰富力。',
+        text: '足协杯战线连续第2年上演广州德比战',
-        speed: 10000,
+        speed: 1000,
         delay: 0
       },
       attachToDocument: true
     });
 
     const content = wrapper.find('.van-notice-bar__content')[0];
-
     setTimeout(() => {
       expect(content.hasStyle('transition-delay', '0s')).to.be.true;
       done();
-    }, 1500);
+    }, 500);
   });
 });