mucho mejor: can run the app test from any URL

html/index.mustache.html

@@ -137,10 +137,6 @@
 <script src="/js/vendor/jquery-3.2.1.min.js" ></script>
 <script src="/js/vendor/jquery-resizable.min.js" ></script>
 <script src="/js/vendor/jquery.color.js" ></script>
-{{#testMode}}
-<script src="/js/vendor/qunit-2.4.1.js"></script>
-<script src="/js/test/ws.test.js"></script>
-{{/testMode}}
 <script src="/js/vendor/mustache.min.js" ></script>
 <script src="/js/vendor/lodash.min.js" ></script>
 <script src="/js/vendor/loadJS.js" ></script>
@@ -158,5 +154,13 @@ window._ws = {
 <script src="/js/ws-menu.js"></script>
 <script src="/js/editor-local-storage.js"></script>
 <script src="/js/ws-editor.js"></script>
+{{#testMode}}
+<script>
+window._ws._path = "{{{appPath}}}";
+</script>
+<script src="/js/vendor/qunit-2.4.1.js"></script>
+<script src="/js/test/ws.test.js"></script>
+{{/testMode}}
+
 </body>
 </html>

js/test/ws.test.js

@@ -10,30 +10,53 @@ function timeoutAsync(cb, delay) {
 (function($) {
   $(document).ready(function() {
 
-    var $mainMenu = $('#nav-menus');
-    var $menuBtn = $('#menu-btn');
+    var $mainMenu    = $('#nav-menus');
+    var $menuRepo    = $('#menu-repo');
+    var $linkToRepo1 = $menuRepo.find('a:first');
+    var $menuExample = $('#menu-example');
+    var $menuBtn     = $('#menu-btn');
+    var $homeLink    = $('#nav-back-home');
 
     QUnit.test( "hello test", function( assert ) {
       assert.ok( 1 == "1", "Passed!" );
     });
 
+    QUnit.test( "initial state", function( assert ) {
+      assert.equal( 0, _ws.files.length, "_ws.files should hold 0 file when app started from root" );
+      assert.ok( $menuRepo.is(':visible'), "menu repo visible (though menu is hidden)" );
+      assert.equal( 2, ($menuRepo.find('a')).length, "menu repo should contain 2 links" );
+      assert.ok( $menuExample.is(':visible'), "menu example visible (though menu is hidden AND menu empty)" );
+      assert.equal( 0, ($menuExample.find('a')).length, "menu example should contain 0 links" );
+    });
+
     QUnit.test( "test menu toggle", function( assert ) {
       var done = assert.async();
-      assert.equal( $mainMenu.width(), 0 );
+      assert.equal( $mainMenu.width(), 0, "0. INIT width should be 0" );
+      assert.ok( $mainMenu.is(':visible'), "0. INIT menu should NOT have class 'in'" );
       $menuBtn.trigger('click');
-      assert.ok( $mainMenu.hasClass('in') );
-      assert.ok( $mainMenu.is(':visible') );
+      assert.ok( $mainMenu.hasClass('in'), "1.AFTER CLICK menu should have class 'in'" );
+      assert.ok( $mainMenu.is(':visible'), "1.AFTER CLICK menu should be visible" );
       timeoutAsync(() => {
-        assert.notEqual( $mainMenu.width(), 0 );
+        assert.notEqual( $mainMenu.width(), 0, "1.AFTER CLICK menu should have width > 0" );
         $menuBtn.trigger('click');
-        assert.ok( ! $mainMenu.hasClass('in') );
+        assert.ok( ! $mainMenu.hasClass('in'), "2.AFTER 2ND CLICK menu should NOT have class 'in'" );
       }, 100)
       .then(() => timeoutAsync(() => {
-        assert.equal( $mainMenu.width(), 0 );
+        assert.equal( $mainMenu.width(), 0, "2.AFTER 2ND CLICK width should be 0" );
         done();
       }, 160));
     });
 
+    QUnit.test( "test nav to repo", function( assert ) {
+      assert.equal( window.location.pathname, '/', "location should be / at first" );
+      $linkToRepo1.trigger('click');
+      assert.equal( window.location.pathname, '/example-repo1' );
+    });
+
+    QUnit.test( "test nav back to home", function( assert ) {
+      $homeLink.trigger('click');
+      assert.ok( window.location.pathname, '/', "location should be / when clicking app title" );
+    });
 
   });
 })(jQuery);

lib/indexHandlers.js

@@ -23,7 +23,7 @@ chokidar.watch('./html', {ignored: /(^|[\/\\])\../}).on('all', (event, path) =>
 });
 
 
-module.exports = function(exStore, exDir) {
+module.exports = function(exStore, exDir, testMode) {
 
   function readExampleFiles(repoSlug, exampleSlug, config) {
     const exampleDir = exDir + '/' + repoSlug + '/' + exampleSlug;
@@ -35,7 +35,7 @@ module.exports = function(exStore, exDir) {
     return readFilesAsync(exampleDir, files);
   }
 
-  function renderIndex(req, withRepo, withExample, testMode) {
+  function renderIndex(req, withRepo, withExample) {
 
     // Extract repoSlug and exampleSlug from req.params
     const { locale, params: { repoSlug, exampleSlug } } = req;
@@ -47,6 +47,7 @@ module.exports = function(exStore, exDir) {
     let data = {
       menuRepo: exStore.getRepoMenu(),
       testMode,
+      appPath: req.path,
       _: translator.getAll(locale)
     };
 
@@ -123,7 +124,7 @@ module.exports = function(exStore, exDir) {
      * for running tests with QUnit
      */
     getIndexTest: function(req, res) {
-      renderIndex(req, false, false, true)
+      renderIndex(req, false, false)
       .then(({ html, code }) => res.send(html));
     },
 

sandboxApp.js

@@ -12,10 +12,11 @@ var app           = express();
 var fs            = require('fs');
 var Promise       = require('bluebird'); Promise.promisifyAll(fs);
 var sandboxTpml   = fs.readFileSync(__dirname + '/html/template.mustache.html').toString();
-var exampleTmpl  = require('./lib/exampleTmpl.json');
+var exampleTmpl   = require('./lib/exampleTmpl.json');
 var ExampleStore  = require('./lib/ExampleStore');
-var examplesDir   = __dirname + '/exemples';
-// var examplesDir   = __dirname + '/test/integration/test-examples';
+var isTesting     = process.env.NODE_ENV === 'testing';
+var examplesDir   = ! isTesting ? __dirname + '/exemples' :
+  __dirname + '/test/integration/test-examples';
 
 var exStore       = new ExampleStore(examplesDir);
 var {
@@ -25,10 +26,10 @@ var {
 var {
   getAcceptLanguage,
   getIndexBare,
-  getIndexTest,
+  // getIndexTest,
   getIndexRepo,
   getIndexExample
-}                 = require('./lib/indexHandlers')(exStore, examplesDir);
+}                 = require('./lib/indexHandlers')(exStore, examplesDir, isTesting);
 var {
   // getIndexBare,
   getPartsRepo,
@@ -93,9 +94,9 @@ app.get('/', getIndexBare);
 /**
  * Index page: render for tests
  */
-if(process.env.NODE_ENV === 'testing') {
-  app.get('/test', getIndexTest);
-}
+// if(isTesting) {
+//   app.get('/test', getIndexTest);
+// }
 
 /**
  * Repo page: render with repo list and selected repo's example list in menu