Fix artists/albums tests

resources/assets/js/components/main-wrapper/main-content/albums.vue

@@ -24,19 +24,13 @@ export default {
   mixins: [infiniteScroll],
   components: { albumItem, viewModeSwitch },
 
-  props: {
-    albums: {
-      type: Array,
-      required: true
-    }
-  },
-
   data () {
     return {
       perPage: 9,
       numOfItems: 9,
       q: '',
-      viewMode: null
+      viewMode: null,
+      albums: []
     }
   },
 
@@ -56,6 +50,10 @@ export default {
   },
 
   created () {
+    event.on('koel:ready', () => {
+      this.albums = albumStore.all
+    })
+
     event.on('filter:changed', q => {
         this.q = q
     })

resources/assets/js/components/main-wrapper/main-content/artists.vue

@@ -25,19 +25,13 @@ export default {
   mixins: [infiniteScroll],
   components: { artistItem, viewModeSwitch },
 
-  props: {
-    artists: {
-      type: Array,
-      required: true
-    }
-  },
-
   data () {
     return {
       perPage: 9,
       numOfItems: 9,
       q: '',
-      viewMode: null
+      viewMode: null,
+      artists: []
     }
   },
 
@@ -57,6 +51,10 @@ export default {
   },
 
   created () {
+    event.on('koel:ready', () => {
+      this.artists = artistStore.all
+    })
+
     event.on({
       'filter:changed': q => {
         this.q = q

resources/assets/js/components/main-wrapper/main-content/index.vue

@@ -4,9 +4,9 @@
     <home v-show="view === 'home'"/>
     <queue v-show="view === 'queue'"/>
     <songs v-show="view === 'songs'"/>
-    <albums :albums="albums" v-show="view === 'albums'"/>
+    <albums v-show="view === 'albums'"/>
     <album v-show="view === 'album'"/>
-    <artists :artists="artists" v-show="view === 'artists'"/>
+    <artists v-show="view === 'artists'"/>
     <artist v-show="view === 'artist'"/>
     <users v-show="view === 'users'"/>
     <settings v-show="view === 'settings'"/>
@@ -19,7 +19,7 @@
 
 <script>
 import { event } from '@/utils'
-import { albumStore, sharedStore, artistStore } from '@/stores'
+import { albumStore, sharedStore } from '@/stores'
 
 import albums from './albums.vue'
 import album from './album.vue'
@@ -64,11 +64,6 @@ export default {
        */
       'song:played': song => {
         this.albumCover = song.album.cover === albumStore.stub.cover ? null : song.album.cover
-      },
-
-      'koel:ready': () => {
-        this.albums = albumStore.all
-        this.artists = artistStore.all
       }
     })
   }

resources/assets/js/tests/components/main-wrapper/main-content/albums.spec.js

@@ -4,10 +4,9 @@ import factory from '@/tests/factory'
 
 describe('components/main-wrapper/main-content/albums', () => {
   it('displays a list of albums', () => {
-    const wrapper = shallow(Albums, {
-      propsData: {
-        albums: factory('album', 5)
-      }
+    const wrapper = shallow(Albums)
+    wrapper.setData({
+      albums: factory('album', 5)
     })
     wrapper.findAll(AlbumItem).should.have.lengthOf(5)
   })

resources/assets/js/tests/components/main-wrapper/main-content/artists.spec.js

@@ -4,10 +4,9 @@ import factory from '@/tests/factory'
 
 describe('components/main-wrapper/main-content/artists', () => {
   it('displays a list of artists', () => {
-    const wrapper = shallow(Artists, {
-      propsData: {
-        artists: factory('artist', 5)
-      }
+    const wrapper = shallow(Artists)
+    wrapper.setData({
+      artists: factory('artist', 5)
     })
     wrapper.findAll(ArtistItem).should.have.lengthOf(5)
   })