Decode and encode URLs (#442)

* Decode and encode URLs

* Tests for encode/decode

modules/PathUtils.js

@@ -15,6 +15,7 @@ export const parsePath = (path) => {
   let search = ''
   let hash = ''
 
+  pathname = decodeURI(pathname)
   const hashIndex = pathname.indexOf('#')
   if (hashIndex !== -1) {
     hash = pathname.substr(hashIndex)
@@ -45,5 +46,5 @@ export const createPath = (location) => {
   if (hash && hash !== '#')
     path += (hash.charAt(0) === '#' ? hash : `#${hash}`)
 
-  return path
+  return encodeURI(path)
 }

modules/__tests__/BrowserHistory-test.js

@@ -58,6 +58,18 @@ describeHistory('a browser history', () => {
       })
     })
 
+    describe('push with a unicode path string', () => {
+      it('creates a location with decoded properties', (done) => {
+        TestSequences.PushUnicodeLocation(history, done)
+      })
+    })
+
+    describe('push with an encoded path string', () => {
+      it('creates a location object with decoded properties', (done) => {
+        TestSequences.PushEncodedLocation(history, done)
+      })
+    })
+
     describe('replace a new path', () => {
       it('calls change listeners with the new location', (done) => {
         TestSequences.ReplaceNewLocation(history, done)

modules/__tests__/HashHistory-test.js

@@ -61,6 +61,18 @@ describeHistory('a hash history', () => {
       })
     })
 
+    describe('push with a unicode path string', () => {
+      it('creates a location with decoded properties', (done) => {
+        TestSequences.PushUnicodeLocation(history, done)
+      })
+    })
+
+    describe('push with an encoded path string', () => {
+      it('creates a location object with decoded properties', (done) => {
+        TestSequences.PushEncodedLocation(history, done)
+      })
+    })
+
     describe('replace a new path', () => {
       it('calls change listeners with the new location', (done) => {
         TestSequences.ReplaceNewLocation(history, done)

modules/__tests__/MemoryHistory-test.js

@@ -50,6 +50,18 @@ describe('a memory history', () => {
       })
     })
 
+    describe('push with a unicode path string', () => {
+      it('creates a location with decoded properties', (done) => {
+        TestSequences.PushUnicodeLocation(history, done)
+      })
+    })
+
+    describe('push with an encoded path string', () => {
+      it('creates a location object with decoded properties', (done) => {
+        TestSequences.PushEncodedLocation(history, done)
+      })
+    })
+
     describe('replace a new path', () => {
       it('calls change listeners with the new location', (done) => {
         TestSequences.ReplaceNewLocation(history, done)

modules/__tests__/TestSequences/PushEncodedLocation.js

@@ -0,0 +1,27 @@
+import expect from 'expect'
+import execSteps from './execSteps'
+
+export default (history, done) => {
+  const steps = [
+    (location) => {
+      expect(location).toMatch({
+        pathname: '/'
+      })
+
+      const pathname = '/%E6%AD%B4%E5%8F%B2'
+      const search = '?%E3%82%AD%E3%83%BC=%E5%80%A4'
+      const hash = '#%E3%83%8F%E3%83%83%E3%82%B7%E3%83%A5'
+      history.push(pathname + search + hash)
+    },
+    (location, action) => {
+      expect(action).toBe('PUSH')
+      expect(location).toMatch({
+        pathname: '/歴史',
+        search: '?キー=値',
+        hash: '#ハッシュ'
+      })
+    }
+  ]
+
+  execSteps(steps, history, done)
+}

modules/__tests__/TestSequences/PushUnicodeLocation.js

@@ -0,0 +1,27 @@
+import expect from 'expect'
+import execSteps from './execSteps'
+
+export default (history, done) => {
+  const steps = [
+    (location) => {
+      expect(location).toMatch({
+        pathname: '/'
+      })
+
+      const pathname = '/歴史'
+      const search = '?キー=値'
+      const hash = '#ハッシュ'
+      history.push(pathname + search + hash)
+    },
+    (location, action) => {
+      expect(action).toBe('PUSH')
+      expect(location).toMatch({
+        pathname: '/歴史',
+        search: '?キー=値',
+        hash: '#ハッシュ'
+      })
+    }
+  ]
+
+  execSteps(steps, history, done)
+}

modules/__tests__/TestSequences/index.js

@@ -12,13 +12,15 @@ export InitialLocationNoKey from './InitialLocationNoKey'
 export InitialLocationHasKey from './InitialLocationHasKey'
 export Listen from './Listen'
 export NoslashHashPathCoding from './NoslashHashPathCoding'
+export PushEncodedLocation from './PushEncodedLocation'
 export PushNewLocation from './PushNewLocation'
 export PushMissingPathname from './PushMissingPathname'
 export PushSamePath from './PushSamePath'
 export PushSamePathWarning from './PushSamePathWarning'
 export PushState from './PushState'
 export PushStateWarning from './PushStateWarning'
 export PushRelativePathname from './PushRelativePathname'
+export PushUnicodeLocation from './PushUnicodeLocation'
 export ReplaceNewLocation from './ReplaceNewLocation'
 export ReplaceSamePath from './ReplaceSamePath'
 export ReplaceState from './ReplaceState'

modules/__tests__/createHref-test.js

@@ -71,6 +71,26 @@ describe('a browser history', () => {
       expect(href).toEqual('/the/path?the=query#the-hash')
     })
   })
+
+  describe('with a unicode location', () => {
+    let history
+    beforeEach(() => {
+      history = createBrowserHistory({ basename: '/' })
+    })
+
+    it('knows how to create hrefs', () => {
+      const href = history.createHref({
+        pathname: '/歴史',
+        search: '?キー=値',
+        hash: '#ハッシュ'
+      })
+
+      const pathname = '/%E6%AD%B4%E5%8F%B2'
+      const search = '?%E3%82%AD%E3%83%BC=%E5%80%A4'
+      const hash = '#%E3%83%8F%E3%83%83%E3%82%B7%E3%83%A5'
+      expect(href).toEqual(pathname + search + hash)
+    })
+  })
 })
 
 describe('a hash history', () => {
@@ -172,6 +192,24 @@ describe('a hash history', () => {
       expect(href).toEqual('#/the/path?the=query')
     })
   })
+
+  describe('with a unicode location', () => {
+    let history
+    beforeEach(() => {
+      history = createHashHistory({ basename: '/' })
+    })
+
+    it('knows how to create hrefs', () => {
+      const href = history.createHref({
+        pathname: '/歴史',
+        search: '?キー=値'
+      })
+
+      const pathname = '#/%E6%AD%B4%E5%8F%B2'
+      const search = '?%E3%82%AD%E3%83%BC=%E5%80%A4'
+      expect(href).toEqual(pathname + search)
+    })
+  })
 })
 
 describe('a memory history', () => {
@@ -189,4 +227,19 @@ describe('a memory history', () => {
 
     expect(href).toEqual('/the/path?the=query#the-hash')
   })
+
+  describe('with a unicode location', () => {
+    it('encodes unicode pathnames', () => {
+      const href = history.createHref({
+        pathname: '/歴史',
+        search: '?キー=値',
+        hash: '#ハッシュ'
+      })
+
+      const pathname = '/%E6%AD%B4%E5%8F%B2'
+      const search = '?%E3%82%AD%E3%83%BC=%E5%80%A4'
+      const hash = '#%E3%83%8F%E3%83%83%E3%82%B7%E3%83%A5'
+      expect(href).toEqual(pathname + search + hash)
+    })
+  })
 })