Add Support for "Blank" Link components. (#3803)

* adds test for rendering Links that do not specify "to" prop

* Modifies Link to return an empty <a> tag when no "to" prop is given.

* Adds example of empty links

* Adds spec for passing down of additional props

* Updates documentation for Link.

* Adds a word to a sentence in Link documentation, cleans up whitespace.

* Removes unecessary example page.

* Removes default "to" prop on Link component.

* Compares "to" to null

* Fixes typo in Link-test

* Whitespace nit

Author: Anna Rankin

docs/API.md

@@ -113,6 +113,7 @@ A [location descriptor](https://github.com/reactjs/react-router/blob/master/docs
   * `query`: An object of key:value pairs to be stringified.
   * `hash`: A hash to put in the URL, e.g. `#a-hash`.
   * `state`: State to persist to the `location`.
+* If it is not specified, an anchor tag without an `href` attribute will be rendered.
 
 _Note: React Router currently does not manage scroll position, and will not scroll to the element corresponding to `hash`._
 

modules/Link.js

@@ -55,7 +55,7 @@ const Link = React.createClass({
   },
 
   propTypes: {
-    to: oneOfType([ string, object ]).isRequired,
+    to: oneOfType([ string, object ]),
     query: object,
     hash: string,
     state: object,
@@ -112,6 +112,9 @@ const Link = React.createClass({
     const { router } = this.context
 
     if (router) {
+      // If user does not specify a `to` prop, return an empty anchor tag.
+      if (to == null) { return <a {...props} /> }
+
       const location = createLocationDescriptor(to, { query, hash, state })
       props.href = router.createHref(location)
 

modules/__tests__/Link-test.js

@@ -455,4 +455,45 @@ describe('A <Link>', function () {
     })
   })
 
+  describe('when the "to" prop is unspecified', function () {
+    class App extends Component {
+      render() {
+        return (
+          <div>
+            <Link>Blank Link</Link>
+            <Link/>
+            <Link className="kitten-link">Kittens</Link>
+          </div>
+        )
+      }
+    }
+
+    it('returns an anchor tag without an href', function (done) {
+      render((
+        <Router history={createHistory('/')}>
+          <Route path="/" component={App} />
+        </Router>
+      ), node, function () {
+        const link1 = node.querySelectorAll('a')[0]
+        const link2 = node.querySelectorAll('a')[1]
+        const link3 = node.querySelectorAll('a')[2]
+        expect(link1.href).toEqual('')
+        expect(link2.href).toEqual('')
+        expect(link3.href).toEqual('')
+        done()
+      })
+    })
+
+    it('passes down other props', function (done) {
+      render((
+        <Router history={createHistory('/')}>
+          <Route path="/" component={App} />
+        </Router>
+      ), node, function () {
+        const link3 = node.querySelectorAll('a')[2]
+        expect(link3.className).toEqual('kitten-link')
+        done()
+      })
+    })
+  })
 })