test(app-render.spec.js): improve render tests by using await and reo…

…rdering the event emit/on
GIScience · Nov 22, 2021 · bba2b9d · bba2b9d
1 parent 6a425b2
commit bba2b9d
Showing 1 changed file with 47 additions and 55 deletions.
diff --git a/tests/integration/specs/app-render.spec.js b/tests/integration/specs/app-render.spec.js
@@ -5,78 +5,70 @@ import AppRootComponent from '@/App'
 // https://stackoverflow.com/questions/28976748/regeneratorruntime-is-not-defined
 import '@babel/polyfill'
 
-describe('App rendering', () => {
-  it('should render app', (done) => {
+describe('App render', () => {
+  it('should render app', async (done) => {
     let appLoader = new AppLoader()
-    appLoader.loadApp(AppRootComponent, '#app', '<App/>').then(vueInstance => {
-      vueInstance.appHooks.loadRegisteredHooks()
-      vueInstance.appHooks.run('appLoaded', vueInstance)
+    let vueInstance = await appLoader.loadApp(AppRootComponent, '#app', '<App/>')
+    vueInstance.appHooks.loadRegisteredHooks()
+    vueInstance.appHooks.run('appLoaded', vueInstance)
 
-      vueInstance.$nextTick(() => { 
-        let appContent = vueInstance.$el.querySelector('.app-content')
-        expect(appContent).toBeDefined()
-        expect(appContent).not.toBeNull()
+    vueInstance.$nextTick(() => { 
+      let appContent = vueInstance.$el.querySelector('.app-content')
+      expect(appContent).toBeDefined()
+      expect(appContent).not.toBeNull()
 
-        let mapView = vueInstance.$el.querySelector('#map-view')
-        expect(mapView).toBeDefined()
-        expect(mapView).not.toBeNull()
+      let mapView = vueInstance.$el.querySelector('#map-view')
+      expect(mapView).toBeDefined()
+      expect(mapView).not.toBeNull()
 
-        appContent.__vue__.$nextTick(() => { 
-          setTimeout(() => {
-            let simplePlaceSearch = appContent.querySelector('.simple-place-search')
-            expect(simplePlaceSearch).toBeDefined()
-            expect(simplePlaceSearch).not.toBeNull()  
-            done()            
-          }, 200)
-        })
-      })      
-    }).catch ( err => {
-      done.fail(err)
+      appContent.__vue__.$nextTick(() => { 
+        setTimeout(() => {
+          let simplePlaceSearch = appContent.querySelector('.simple-place-search')
+          expect(simplePlaceSearch).toBeDefined()
+          expect(simplePlaceSearch).not.toBeNull()  
+          done()            
+        }, 200)
+      })
     })
   })
-  it('should show progress linear on showLoading (true) event', (done) => {
+  it('should show progress linear on showLoading (true) event', async (done) => {
     let appLoader = new AppLoader()
-    appLoader.loadApp(AppRootComponent, '#app', '<App/>').then(vueInstance => {
-      vueInstance.appHooks.loadRegisteredHooks()
-      vueInstance.appHooks.run('appLoaded', vueInstance)
-
-      vueInstance.$nextTick(() => { 
-        vueInstance.eventBus.$emit('showLoading', true)
+    let vueInstance = await appLoader.loadApp(AppRootComponent, '#app', '<App/>')
+    vueInstance.appHooks.loadRegisteredHooks()
+    vueInstance.appHooks.run('appLoaded', vueInstance)
 
-        vueInstance.eventBus.$on('showLoading', () => {
-          setTimeout(() => {
-            let progress = vueInstance.$el.querySelector('.progress-linear')
-            expect(progress).toBeDefined()
-            expect(progress).not.toBeNull()
-            done() 
-          }, 200)
-        })
-      })      
-    }).catch ( err => {
-      done.fail(err)
+    vueInstance.$nextTick(() => { 
+      vueInstance.eventBus.$on('showLoading', () => {
+        setTimeout(() => {
+          let progress = vueInstance.$el.querySelector('.progress-linear')
+          expect(progress).toBeDefined()
+          expect(progress).not.toBeNull()
+          done() 
+        }, 200)
+      })
+      vueInstance.eventBus.$emit('showLoading', true)
     })
   })
-  it('should hide progress linear on showLoading (false) event', (done) => {
+  it('should hide progress linear on showLoading (false) event', async (done) => {
     let appLoader = new AppLoader()
-    appLoader.loadApp(AppRootComponent, '#app', '<App/>').then(vueInstance => {
-      vueInstance.appHooks.loadRegisteredHooks()
-      vueInstance.appHooks.run('appLoaded', vueInstance)
-
-      vueInstance.$nextTick(() => { 
-        vueInstance.eventBus.$emit('showLoading', true)
-        vueInstance.eventBus.$emit('showLoading', false)        
+    let vueInstance = await appLoader.loadApp(AppRootComponent, '#app', '<App/>')
+    vueInstance.appHooks.loadRegisteredHooks()
+    vueInstance.appHooks.run('appLoaded', vueInstance)
 
-        vueInstance.eventBus.$on('showLoading', () => {
+    vueInstance.$nextTick(() => { 
+
+      vueInstance.eventBus.$on('showLoading', (state) => {
+        if (state === false) {
           setTimeout(() => {
             let progress = vueInstance.$el.querySelector('.progress-linear')
             expect(progress).toBeDefined()
             expect(progress).not.toBeNull()
             done() 
-          }, 200)
-        })
-      })      
-    }).catch ( err => {
-      done.fail(err)
+          }, 1000)
+        }
+      })
+      vueInstance.eventBus.$emit('showLoading', true)
+      vueInstance.eventBus.$emit('showLoading', false)        
     })
   })
 })