Removing the loading... indicator when we have an error

src/components/oc-client/src/oc-client.js

@@ -336,6 +336,7 @@ var oc = oc || {};
 
         oc.renderByHref($component.attr('href'), function(err, data){
           if(err || !data){
+            $component.html('');
             logger.error(err);
             return callback();
           }

test/front-end/build-href.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var nav = window.navigator.userAgent,
-    isIe8 = !!(nav.match(/MSIE 8/));
+describe('oc-client : build', function(){
 
-var execute = function(parameters){
-  return oc.build(parameters);
-};
+  var nav = window.navigator.userAgent,
+      isIe8 = !!(nav.match(/MSIE 8/));
 
-describe('oc-client : build', function(){
+  var execute = function(parameters){
+    return oc.build(parameters);
+  };
 
   describe('when not providing the mandatory parameters', function(){
 

test/front-end/render-nested-component.js

@@ -0,0 +1,81 @@
+'use strict';
+
+describe('oc-client : renderNestedComponent', function(){
+
+  var originalConsoleLog = console.log,
+      originalRenderByHref = oc.renderByHref,
+      htmlBeforeRendering,
+      nav = window.navigator.userAgent,
+      isIe8 = !!(nav.match(/MSIE 8/)),
+      componentHref = '//oc-registry.com/my-component/';
+
+  var componentContainer = isIe8 ? 
+    '<div data-oc-component="true" href="' + componentHref + '"></div>' :
+    '<oc-component href="' + componentHref + '"></oc-component>';
+
+  var initialise = function($component, fail){
+    htmlBeforeRendering = '';
+
+    console.log = function(){};
+
+    oc.renderByHref = function(href, cb){
+      htmlBeforeRendering = $component.html();
+      cb(fail, {
+        html: '<div>this is the component content</div>',
+        version: '1.0.0',
+        name: 'my-component',
+        key: '12345678901234567890'
+      });
+    };
+  };
+
+  var cleanup = function(){
+    oc.renderByHref = originalRenderByHref;
+    console.log = originalConsoleLog;
+    delete oc.components;
+    oc.renderedComponents = {};
+    oc.events.reset();
+  };
+
+  describe('when rendering component successfully', function(){
+
+    var $component;
+
+    beforeEach(function(done){
+      $component = $(componentContainer);
+      initialise($component);
+      oc.renderNestedComponent($component, done);
+    });
+
+    afterEach(cleanup);
+
+    it('should show loading message first', function(){
+      expect(htmlBeforeRendering).toContain('Loading...');
+    });
+
+    it('should inject component html when rendering is done', function(){
+      expect($component.html()).toContain('this is the component content');
+    });
+  });
+
+  describe('when rendering component does not succeed', function(){
+
+    var $component;
+
+    beforeEach(function(done){
+      $component = $(componentContainer);
+      initialise($component, 'An error!');
+      oc.renderNestedComponent($component, done);
+    });
+
+    afterEach(cleanup);
+
+    it('should show loading message first', function(){
+      expect(htmlBeforeRendering).toContain('Loading...');
+    });
+
+    it('should remove loading message then', function(){
+      expect($component.html()).toEqual('');
+    });
+  });
+});

test/front-end/render.js

@@ -106,17 +106,22 @@ describe('oc-client : render', function(){
 
   describe('when handlebars runtime loaded and rendering a handlebars3 component', function(){
 
-    var callback;
+    var callback, originalConsolelog = console.log;
     beforeEach(function(){
+      console.log = function(){};
       callback = sinon.spy();
-      eval(handlebars3CompiledView);            
+      eval(handlebars3CompiledView);
       oc.render({
         src: 'https://my-cdn.com/components/a-component/1.2.123/template.js', 
         type: 'handlebars', 
         key: '46ee85c314b371cac60471cef5b2e2e6c443dccf'
       }, {}, callback);
     });
 
+    afterEach(function(){
+      console.log = originalConsolelog;
+    });
+
     it('should return the error', function(){ console.log(callback.args);
       expect(callback.called).toBe(true);
       expect(callback.args[0][0]).toContain('Template was precompiled with an older version of Handlebars than the current runtime');