From dc0f65ccddf9499771dca887f285edafd60edee7 Mon Sep 17 00:00:00 2001
From: vvo <vincent.voyer@algolia.com>
Date: Thu, 10 Dec 2015 13:31:30 +0100
Subject: [PATCH] fix(stateless comps): add No Display Name as default
 component name

fixes #11
---
 index-test.js | 15 ++++++++++++---
 index.js      | 15 +++++----------
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/index-test.js b/index-test.js
index 3730ac11c..4c7947216 100644
--- a/index-test.js
+++ b/index-test.js
@@ -28,11 +28,20 @@ describe(`reactElementToJSXString(ReactElement)`, () => {
       ).toEqual(`<NamedStatelessComponent />`);
   });
 
-  // cannot be done, see https://github.com/algolia/react-element-to-jsx-string/issues/11
-  it.skip(`reactElementToJSXString(<AnonymousStatelessComponent/>)`, () => {
+  it(`reactElementToJSXString(<AnonymousStatelessComponent/>)`, () => {
     expect(
       reactElementToJSXString(<AnonymousStatelessComponent/>)
-      ).toEqual(`<AnonymousStatelessComponent />`);
+      ).toEqual(`<No Display Name />`);
+  });
+
+  it(`reactElementToJSXString(<AnonymousStatelessComponent/>) with a displayName`, () => {
+    AnonymousStatelessComponent.displayName = 'I have a name!';
+
+    expect(
+      reactElementToJSXString(<AnonymousStatelessComponent/>)
+      ).toEqual(`<I have a name! />`);
+
+    delete AnonymousStatelessComponent.displayName;
   });
 
   it(`reactElementToJSXString(React.createElement('div'))`, () => {
diff --git a/index.js b/index.js
index 6c6476818..75851eaf3 100644
--- a/index.js
+++ b/index.js
@@ -19,16 +19,11 @@ function toJSXString({ReactElement = null, lvl = 0, inline = false}) {
       'got `' + (typeof ReactElement) + '`');
   }
 
-  let tagName;
-
-  if (ReactElement.type === undefined) {
-    tagName = 'UnknownElement';
-  } else {
-    tagName = ReactElement.type.name ||
-      ReactElement.type.displayName ||
-      ReactElement.type.type ||
-      ReactElement.type;
-  }
+  let tagName = ReactElement.type.name || // function name
+    ReactElement.type.displayName ||
+    (typeof ReactElement.type === 'function' ? // function without a name, you should provide one
+      'No Display Name' :
+      ReactElement.type);
 
   let out = `<${tagName}`;
   let props = formatProps(ReactElement.props);