fix(stateless comps): add No Display Name as default component name

fixes #11

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'))`, () => {

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);