Add tests for track-list-item.vue

resources/assets/js/components/shared/track-list-item.vue

@@ -1,10 +1,10 @@
 <template>
-  <li :class="{ available: correspondingSong }" :title="tooltip" @click="play">
+  <li :class="{ available: song }" :title="tooltip" @click="play">
     <span class="no">{{ index + 1 }}</span>
     <span class="title">{{ track.title }}</span>
     <a
       :href="iTunesUrl"
-      v-if="useiTunes && !correspondingSong"
+      v-if="useiTunes && !song"
       target="_blank"
       class="view-on-itunes"
       title="View on iTunes"
@@ -43,12 +43,12 @@ export default {
   },
 
   computed: {
-    correspondingSong () {
+    song () {
       return songStore.guess(this.track.title, this.album)
     },
 
     tooltip () {
-      return this.correspondingSong ? 'Click to play' : ''
+      return this.song ? 'Click to play' : ''
     },
 
     iTunesUrl () {
@@ -58,9 +58,9 @@ export default {
 
   methods: {
     play () {
-      if (this.correspondingSong) {
-        queueStore.contains(this.correspondingSong) || queueStore.queueAfterCurrent(this.correspondingSong)
-        playback.play(this.correspondingSong)
+      if (this.song) {
+        queueStore.contains(this.song) || queueStore.queueAfterCurrent(this.song)
+        playback.play(this.song)
       }
     }
   }

resources/assets/js/tests/components/shared/track-list-item.spec.js

@@ -0,0 +1,65 @@
+import Component from '@/components/shared/track-list-item.vue'
+import { sharedStore, songStore, queueStore } from '@/stores'
+import { playback, ls } from '@/services'
+import factory from '@/tests/factory'
+
+describe('componnents/shared/track-list-item', () => {
+  let song, guessStub, lsGetStub
+  const track = {
+    title: 'Foo and bar',
+    fmtLenth: '00:42'
+  }
+  const album = factory('album', { id: 42 })
+  window.BASE_URL = 'http://koel.local/'
+
+  beforeEach(() => {
+    sharedStore.state.useiTunes = true
+    song = factory('song')
+    guessStub = sinon.stub(songStore, 'guess').callsFake(() => song)
+    lsGetStub = sinon.stub(ls, 'get').callsFake(() => 'abcdef')
+  })
+
+  afterEach(() => {
+    guessStub.restore()
+    lsGetStub.restore()
+  })
+
+  it('renders', () => {
+    const wrapper = shallow(Component, { propsData: {
+      track,
+      album,
+      index: 1
+    }})
+    wrapper.find('li.available').should.be.ok
+    wrapper.html().should.contain('Foo and bar')
+  })
+
+  it('has an iTunes link if there is no such local song', () => {
+    guessStub.callsFake(() => false)
+    shallow(Component, { propsData: {
+      track,
+      album,
+      index: 1
+    }}).html().should.contain('http://koel.local/api/itunes/song/42?q=Foo%20and%20bar&jwt-token=abcdef')
+  })
+
+  it('plays', () => {
+    const containsStub = sinon.stub(queueStore, 'contains').callsFake(() => false)
+    const queueStub = sinon.stub(queueStore, 'queueAfterCurrent')
+    const playStub = sinon.stub(playback, 'play')
+
+    shallow(Component, { propsData: {
+      track,
+      album,
+      index: 1
+    }}).find('li').trigger('click')
+
+    containsStub.calledWith(song).should.be.true
+    queueStub.calledWith(song).should.be.true
+    playStub.calledWith(song).should.be.true
+
+    containsStub.restore()
+    queueStub.restore()
+    playStub.restore()
+  })
+})