Make ctx.update pass state and query down to nested routers

Profiscience · Jul 7, 2016 · 2db7a29 · 2db7a29
1 parent 402b389
commit 2db7a29
Show file tree

Hide file tree

Showing 7 changed files with 26 additions and 11 deletions.
diff --git a/dist/ko-component-router.js b/dist/ko-component-router.js
@@ -444,12 +444,14 @@ return /******/ (function(modules) { // webpackBootstrap
 	              _this.isNavigating(false);
 	              _knockout2.default.tasks.runEarly();
 	              resolve(true);
-
 	              if (animate) {
 	                _knockout2.default.tasks.schedule(function () {
 	                  return _this.config.inTransition(el, fromCtx, toCtx);
 	                });
 	              }
+	              if (_this.$child) {
+	                _this.$child.update(childPath || '/', state, false, query);
+	              }
 	            });
 	          };
 

diff --git a/dist/ko-component-router.min.js b/dist/ko-component-router.min.js
diff --git a/example/dist/bundle.js b/example/dist/bundle.js
diff --git a/example/dist/bundle.js.map b/example/dist/bundle.js.map
diff --git a/lib/context.js b/lib/context.js
@@ -177,12 +177,14 @@ var Context = function () {
               _this.isNavigating(false);
               _knockout2.default.tasks.runEarly();
               resolve(true);
-
               if (animate) {
                 _knockout2.default.tasks.schedule(function () {
                   return _this.config.inTransition(el, fromCtx, toCtx);
                 });
               }
+              if (_this.$child) {
+                _this.$child.update(childPath || '/', state, false, query);
+              }
             });
           };
 

diff --git a/src/context.js b/src/context.js
@@ -145,10 +145,11 @@ export default class Context {
               this.isNavigating(false)
               ko.tasks.runEarly()
               resolve(true)
-
               if (animate) {
-                ko.tasks.schedule(() =>
-                  this.config.inTransition(el, fromCtx, toCtx))
+                ko.tasks.schedule(() => this.config.inTransition(el, fromCtx, toCtx))
+              }
+              if (this.$child) {
+                this.$child.update(childPath || '/', state, false, query)
               }
             })
         }

diff --git a/test.js b/test.js
@@ -21,7 +21,7 @@ import './src'
 ko.options.deferUpdates = true
 
 test('ko-component-router', async (t) => { // eslint-disable-line
-  const NUM_TESTS_PER_SUITE = 70
+  const NUM_TESTS_PER_SUITE = 72
   const NUM_CONFIGS = 4
   const NUM_TESTS = NUM_TESTS_PER_SUITE * NUM_CONFIGS + 4
   t.plan(NUM_TESTS)
@@ -62,6 +62,7 @@ async function runTests(t, config) {
 
           // route w/ nested router
           '/nested/!': 'nested',
+          '/another-nested/!': 'nested',
 
           // various test components
           '/bindings': 'bindings',
@@ -174,10 +175,18 @@ async function runTests(t, config) {
   await step((done) => window.requestAnimationFrame(done))
   await step(() => {
     const nestedRouter = ko.contextFor($('ko-component-router', $dom).get(0)).$router
-    const link = $('#parent-about', $dom).get(0)
+    const link = $('#another-nested-foo', $dom).get(0)
     t.equal(nestedRouter.route().component, 'nested-bar', 'path binding works in nested router within same context')
     link.click()
   })
+  await step((done) => ko.tasks.schedule(done))
+  await step(() => {
+    const nestedRouter = ko.contextFor($('ko-component-router', $dom).get(0)).$router
+    const link = $('#parent-about', $dom).get(0)
+    t.deepEquals(nestedRouter.query.getAll(), { fromBar: true }, 'query binding passes query down nested routers')
+    t.deepEquals(nestedRouter.state(), { fromBar: true }, 'state binding passes state down nested routers')
+    link.click()
+  })
   await step(() => {
     t.equal(router.route().component, 'about', 'path binding traverses routers if not found')
   })
@@ -619,12 +628,13 @@ ko.components.register('nested-foo', {
   synchronous: true,
   template: `
     <a id="nested-bar" data-bind="path: \'/bar\'"></a>
+    <a id="parent-about" data-bind="path: \'/about\'"></a>
   `
 })
 ko.components.register('nested-bar', {
   synchronous: true,
   template: `
-    <a id="parent-about" data-bind="path: \'/about\'"></a>
+    <a id="another-nested-foo" data-bind="path: \'/another-nested/foo\', query: { fromBar: true }, state: { fromBar: true }"></a>
   `
 })
 ko.components.register('nested',  {