Add unit tests for renderRoutes

packages/react-router-config/modules/__tests__/integration-test.js

@@ -111,32 +111,17 @@ describe('integration', () => {
     )
 
     const routes = [
+      // should skip
       {
-        path: '/pepper',
+        path: '/pepper/habanero',
         component: Comp,
-        exact: true,
-        routes: [
-          {
-            path: '/pepper/child',
-            component: Comp
-          }
-        ]
+        exact: true
       },
+      // should match
       {
         path: '/pepper',
         component: Comp,
-        routes: [
-          {
-            path: '/pepper/:type',
-            component: Comp,
-            routes: [
-              {
-                path: '/pepper/:type/scoville',
-                component: Comp
-              }
-            ]
-          }
-        ]
+        exact: true
       }
     ]
 
@@ -154,24 +139,28 @@ describe('integration', () => {
 
 
 
-  it('generates the same matches in renderRoutes and matchRoutes with routes using strict', () => {
-    let rendered = []
+  it('generates the same matches in renderRoutes and matchRoutes with routes using exact + strict', () => {
+    const rendered = []
 
     const Comp = ({ match, route: { routes } }) => (
       rendered.push(match),
       renderRoutes(routes)
     )
 
     const routes = [
+      // should match
       {
         path: '/pepper/',
         component: Comp,
         strict: true,
+        exact: true,
         routes: [
+          // should skip
           {
             path: '/pepper',
             component: Comp,
-            strict: true
+            strict: true,
+            exact: true
           }
         ]
       }
@@ -189,17 +178,15 @@ describe('integration', () => {
 
     pathname = '/pepper/'
     branch = matchRoutes(routes, pathname)
-    rendered = [];
     renderToString(
       <StaticRouter location={pathname} context={{}}>
         {renderRoutes(routes)}
       </StaticRouter>
     )
 
-    expect(branch.length).toEqual(2)
-    expect(rendered.length).toEqual(2)
+    expect(branch.length).toEqual(1)
+    expect(rendered.length).toEqual(1)
     expect(branch[0].match).toEqual(rendered[0])
-    expect(branch[1].match).toEqual(rendered[1])
   })
 })
 

packages/react-router-config/modules/__tests__/renderRoutes-test.js

@@ -0,0 +1,263 @@
+import renderRoutes from '../renderRoutes'
+import expect from 'expect'
+import React from 'react'
+import { renderToString } from 'react-dom/server'
+import StaticRouter from 'react-router/StaticRouter'
+
+describe('renderRoutes', () => {
+  let rendered
+  const Comp = ({ match, route, route: { routes } }) => (
+    rendered.push(route),
+    renderRoutes(routes)
+  )
+
+  beforeEach(() => {
+    rendered = []
+  })
+
+  it('renders pathless routes', () => {
+    const routeToMatch = {
+      component: Comp
+    }
+    const routes = [routeToMatch]
+
+    renderToString(
+      <StaticRouter location='/path' context={{}}>
+        {renderRoutes(routes)}
+      </StaticRouter>
+    )
+    expect(rendered.length).toEqual(1)
+    expect(rendered[0]).toMatch(routeToMatch)
+  })
+
+  describe('Switch usage', () => {
+    it('renders the first matched route', () => {
+      const routeToMatch = {
+        component: Comp,
+        path: '/'
+      }
+      const routes = [routeToMatch, {
+        component: Comp,
+      }]
+
+      renderToString(
+        <StaticRouter location='/' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(1)
+      expect(rendered[0]).toMatch(routeToMatch)
+    })
+
+    it('renders the first matched route in nested routes', () => {
+      const childRouteToMatch = {
+        component: Comp,
+        path: '/',
+      }
+      const routeToMatch = {
+        component: Comp,
+        path: '/',
+        routes: [childRouteToMatch, {
+          component: Comp
+        }]
+      }
+      const routes = [routeToMatch, {
+        component: Comp,
+      }]
+
+      renderToString(
+        <StaticRouter location='/' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(2)
+      expect(rendered[0]).toMatch(routeToMatch)
+      expect(rendered[1]).toMatch(childRouteToMatch)
+    })
+  })
+
+  describe('routes with exact', () => {
+    it('renders the exact route', () => {
+      const routeToMatch = {
+        component: Comp,
+        path: '/path/child',
+        exact: true,
+        routes: [{
+          component: Comp
+        }]
+      }
+      const routes = [{
+        component: Comp,
+        path: '/path',
+        exact: true
+      }, routeToMatch]
+
+      renderToString(
+        <StaticRouter location='/path/child' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(2)
+      expect(rendered[0]).toEqual(routeToMatch)
+      expect(rendered[1]).toEqual({ component: Comp })
+    })
+
+    it('skips exact route and does not render it and any of its child routes', () => {
+      const routes = [{
+        component: Comp,
+        path: '/path',
+        exact: true,
+        routes: [{
+          component: Comp
+        }, {
+          component: Comp
+        }]
+      }]
+
+      renderToString(
+        <StaticRouter location='/path/child' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      renderToString(
+        <StaticRouter location='/' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(0)
+    })
+
+    it('renders the matched exact route but not its child routes if they do not match', () => {
+      const routes = [{
+        // should render
+        component: Comp,
+        path: '/path',
+        exact: true,
+        routes: [{
+          // should skip
+          component: Comp,
+          path: '/path/child',
+          exact: true
+        }, {
+          // should render
+          component: Comp
+        }]
+      }]
+
+      renderToString(
+        <StaticRouter location='/path/child/grandchild' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      renderToString(
+        <StaticRouter location='/path' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(2)
+      expect(rendered[0]).toEqual(routes[0])
+      expect(rendered[1]).toEqual(routes[0].routes[1])
+    })
+  })
+
+  describe('routes with exact + strict', () => {
+    it('renders the exact strict route', () => {
+      const routeToMatch = {
+        component: Comp,
+        path: '/path/',
+        exact: true,
+        strict: true
+      }
+      const routes = [{
+        // should skip
+        component: Comp,
+        path: '/path',
+        exact: true,
+        strict: true
+        // should render
+      }, routeToMatch]
+
+      renderToString(
+        <StaticRouter location='/path/' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(1)
+      expect(rendered[0]).toEqual(routeToMatch)
+    })
+
+    it('skips exact strict route and does not render it and any of its child routes', () => {
+      const routes = [{
+        component: Comp,
+        path: '/path/',
+        exact: true,
+        strict: true,
+        routes: [{
+          component: Comp
+        }, {
+          component: Comp
+        }]
+      }]
+
+      renderToString(
+        <StaticRouter location='/path/child' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      renderToString(
+        <StaticRouter location='/' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      renderToString(
+        <StaticRouter location='/path' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(0)
+    })
+
+    it('renders the matched exact strict route but not its child routes if they do not match', () => {
+      const routes = [{
+        // should skip
+        component: Comp,
+        path: '/path',
+        exact: true,
+        strict: true
+      }, {
+        // should render
+        component: Comp,
+        path: '/path/',
+        exact: true,
+        strict: true,
+        routes: [{
+          // should skip
+          component: Comp,
+          exact: true,
+          strict: true,
+          path: '/path'
+        }, {
+          // should render
+          component: Comp,
+          exact: true,
+          strict: true,
+          path: '/path/'
+        }]
+      }]
+
+      renderToString(
+        <StaticRouter location='/path/child/grandchild' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      renderToString(
+        <StaticRouter location='/path/' context={{}}>
+          {renderRoutes(routes)}
+        </StaticRouter>
+      )
+      expect(rendered.length).toEqual(2)
+      expect(rendered[0]).toEqual(routes[1])
+      expect(rendered[1]).toEqual(routes[1].routes[1])
+    })
+  })
+})