diff --git a/src/react-autolink.js b/src/react-autolink.js
index 5cf8ca2..68b46fe 100644
--- a/src/react-autolink.js
+++ b/src/react-autolink.js
@@ -12,7 +12,7 @@ let ReactAutolink = () => {
autolink(text, options = {}) {
if (!text) return [];
- return text.split(delimiter).map(word => {
+ return text.split(delimiter).map((word, index) => {
let match = word.match(delimiter);
if (match) {
let url = match[0];
@@ -25,11 +25,15 @@ let ReactAutolink = () => {
return React.createElement(
'a',
- assign({href: strStartsWith(url, 'http') ? url : `http://${url}`}, options),
+ assign({href: strStartsWith(url, 'http') ? url : `http://${url}`, key: index}, options),
url
);
} else {
- return word;
+ return React.createElement(
+ 'span',
+ { key: index },
+ word
+ );
}
});
}
diff --git a/test/react-autolink-test.js b/test/react-autolink-test.js
index 72ffa8c..e382a1f 100644
--- a/test/react-autolink-test.js
+++ b/test/react-autolink-test.js
@@ -44,10 +44,10 @@ describe("ReactAutolinkMixin", () => {
it("render", () => {
ReactDOM.render(, div);
- let span = ReactDOM.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(sampleComponent, "span"));
+ let span = ReactDOM.findDOMNode(TestUtils.scryRenderedDOMComponentsWithTag(sampleComponent, "span")[0]);
assert.equal(
span.innerHTML,
- 'foo http://example.org'
+ 'foo http://example.org'
);
});
@@ -156,6 +156,14 @@ describe("ReactAutolinkMixin", () => {
assert.ok(links.length === 2);
});
+ it("provides keys to links", () => {
+ const shallowRenderer = TestUtils.createRenderer();
+ shallowRenderer.render();
+ component = shallowRenderer.getRenderOutput();
+
+ assert(component.props.children.props.children.every((child) => child.key))
+ });
+
it("has attributes when options are given", () => {
ReactDOM.render(, div);
let link = ReactDOM.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(sampleComponent, "a"));