All files / src/__tests__/components StopWatch.vue

58.33% Statements 7/12
50% Branches 1/2
60% Functions 3/5
58.33% Lines 7/12

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47                              1x                       1x 1x     1x   1x         1x       1x        
<template>
  <div>
    <span>{{ lapse }}ms</span>
    <button @click="handleRunClick" data-testid="start-stop-button">
      {{ running ? 'Stop' : 'Start' }}
    </button>
    <button @click="handleClearClick" data-testid="clear-button">
      Clear
    </button>
  </div>
</template>
 
<script>
export default {
  data () {
    return {
      running: false,
      lapse: 0,
      timer: null
    }
  },
  methods: {
    handleClearClick () {
      clearInterval(this.timer)
      this.lapse = 0
      this.running = false
    },
    handleRunClick () {
I      if (this.running) {
        clearInterval(this.timer)
      } else {
        const startTime = Date.now() - this.lapse
 
        this.timer = setInterval(() => {
          this.lapse = Date.now() - startTime
        })
      }
 
      this.running = !this.running      
    }
  },
  beforeDestroy () {
    clearInterval(this.timer)
  }
}
</script>