Merge pull request #244 from stefanotorresi/patch-218

Allow empty parentSelector
chieffancypants · Mar 16, 2016 · 6b4c469 · 6b4c469
2 parents 2eb411c + 94fe2cd
commit 6b4c469
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 3 deletions.
diff --git a/src/loading-bar.js b/src/loading-bar.js
@@ -194,23 +194,35 @@ angular.module('cfp.loadingBar', [])
           $animate = $injector.get('$animate');
         }
 
-        var $parent = $document.find($parentSelector).eq(0);
         $timeout.cancel(completeTimeout);
 
         // do not continually broadcast the started event:
         if (started) {
           return;
         }
 
+        var document = $document[0];
+        var parent = document.querySelector ?
+          document.querySelector($parentSelector)
+          : $document.find($parentSelector)[0]
+        ;
+
+        if (! parent) {
+          parent = document.getElementsByTagName('body')[0];
+        }
+
+        var $parent = angular.element(parent);
+        var $after = parent.lastChild && angular.element(parent.lastChild);
+
         $rootScope.$broadcast('cfpLoadingBar:started');
         started = true;
 
         if (includeBar) {
-          $animate.enter(loadingBarContainer, $parent, angular.element($parent[0].lastChild));
+          $animate.enter(loadingBarContainer, $parent, $after);
         }
 
         if (includeSpinner) {
-          $animate.enter(spinner, $parent, angular.element($parent[0].lastChild));
+          $animate.enter(spinner, $parent, loadingBarContainer);
         }
 
         _set(startSize);

diff --git a/test/loading-bar-interceptor-config.coffee b/test/loading-bar-interceptor-config.coffee
@@ -79,3 +79,36 @@ describe 'loadingBarInterceptor Service - config options', ->
       expect(cfpLoadingBar.status()).toBeGreaterThan .5
       cfpLoadingBar.complete()
       $timeout.flush()
+
+  it 'should append the loadingbar as the first child of the parent container if empty', ->
+    emptyEl = angular.element '<div id="empty"></div>'
+    angular.element(document).find('body').eq(0).append emptyEl
+
+    module 'chieffancypants.loadingBar', (cfpLoadingBarProvider) ->
+      cfpLoadingBarProvider.parentSelector = '#empty'
+      return
+    inject ($timeout, $document, cfpLoadingBar) ->
+      cfpLoadingBar.start()
+      parent = $document[0].querySelector(cfpLoadingBar.parentSelector)
+      children = parent.childNodes
+      expect(children.length).toBe 2
+      expect(children[0].id).toBe 'loading-bar'
+      expect(children[1].id).toBe 'loading-bar-spinner'
+      cfpLoadingBar.complete()
+      $timeout.flush()
+
+  it 'should append the loading bar to the body if parentSelector is empty', ->
+    module 'chieffancypants.loadingBar', (cfpLoadingBarProvider) ->
+      cfpLoadingBarProvider.parentSelector = '#doesnotexist'
+      return
+    inject ($timeout, $document, cfpLoadingBar) ->
+      parent = $document[0].querySelector(cfpLoadingBar.parentSelector)
+      expect(parent).toBeFalsy;
+      body = $document[0].querySelector 'body'
+      cfpLoadingBar.start()
+      bar = angular.element(body.querySelector '#loading-bar');
+      spinner = angular.element(body.querySelector '#loading-bar-spinner');
+      expect(bar.length).toBe 1
+      expect(spinner.length).toBe 1
+      cfpLoadingBar.complete()
+      $timeout.flush()