forwardRef UT

appannie · Mar 20, 2019 · 80a96b2 · 80a96b2
1 parent 1620db5
commit 80a96b2
Show file tree

Hide file tree

Showing 3 changed files with 80 additions and 66 deletions.
diff --git a/__test__/__snapshots__/test.js.snap b/__test__/__snapshots__/test.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<I18nProvider> children get i18n from I18nProvider 1`] = `
-<TestElement
+<UNDEFINED
   i18n={
     Object {
       "gettext": [Function],
@@ -27,31 +27,36 @@ exports[`<I18nProvider> children get i18n from I18nProvider 2`] = `
     }
   }
 >
-  <Translate
+  <Translate(TestElement)
     testProp="required"
   >
-    <TestElement
-      i18n={
-        Object {
-          "gettext": [Function],
-          "lang": "en-US",
-          "ngettext": [Function],
-          "npgettext": [Function],
-          "pgettext": [Function],
-        }
-      }
+    <Translate
+      forwardedRef={null}
       testProp="required"
     >
-      <div>
-        Test
-      </div>
-    </TestElement>
-  </Translate>
+      <TestElement
+        i18n={
+          Object {
+            "gettext": [Function],
+            "lang": "en-US",
+            "ngettext": [Function],
+            "npgettext": [Function],
+            "pgettext": [Function],
+          }
+        }
+        testProp="required"
+      >
+        <div>
+          Test
+        </div>
+      </TestElement>
+    </Translate>
+  </Translate(TestElement)>
 </I18nProvider>
 `;
 
 exports[`translate Component render anonymous component 1`] = `
-<Translate
+<Translate(Component)
   i18n={
     Object {
       "gettext": [Function],
@@ -63,7 +68,8 @@ exports[`translate Component render anonymous component 1`] = `
   }
   testProp="required"
 >
-  <Component
+  <Translate
+    forwardedRef={null}
     i18n={
       Object {
         "gettext": [Function],
@@ -75,48 +81,35 @@ exports[`translate Component render anonymous component 1`] = `
     }
     testProp="required"
   >
-    <div>
-      My
-      required
-    </div>
-  </Component>
-</Translate>
+    <Component
+      i18n={
+        Object {
+          "gettext": [Function],
+          "lang": "en-US",
+          "ngettext": [Function],
+          "npgettext": [Function],
+          "pgettext": [Function],
+        }
+      }
+      testProp="required"
+    >
+      <div>
+        My
+        required
+      </div>
+    </Component>
+  </Translate>
+</Translate(Component)>
 `;
 
 exports[`translate Component render translated component 1`] = `
-<Translate
-  i18n={
-    Object {
-      "gettext": [Function],
-      "lang": "en-US",
-      "ngettext": [Function],
-      "npgettext": [Function],
-      "pgettext": [Function],
-    }
-  }
-  testProp="required"
->
-  <TestElement
-    i18n={
-      Object {
-        "gettext": [Function],
-        "lang": "en-US",
-        "ngettext": [Function],
-        "npgettext": [Function],
-        "pgettext": [Function],
-      }
-    }
-    testProp="required"
-  >
-    <div>
-      Test
-    </div>
-  </TestElement>
-</Translate>
+<ContextConsumer>
+  <Component />
+</ContextConsumer>
 `;
 
 exports[`translate Component render translated stateless component 1`] = `
-<Translate
+<Translate(StatelessTest)
   i18n={
     Object {
       "gettext": [Function],
@@ -128,7 +121,8 @@ exports[`translate Component render translated stateless component 1`] = `
   }
   testProp="required"
 >
-  <StatelessTest
+  <Translate
+    forwardedRef={null}
     i18n={
       Object {
         "gettext": [Function],
@@ -140,10 +134,23 @@ exports[`translate Component render translated stateless component 1`] = `
     }
     testProp="required"
   >
-    <div>
-      My
-      required
-    </div>
-  </StatelessTest>
-</Translate>
+    <StatelessTest
+      i18n={
+        Object {
+          "gettext": [Function],
+          "lang": "en-US",
+          "ngettext": [Function],
+          "npgettext": [Function],
+          "pgettext": [Function],
+        }
+      }
+      testProp="required"
+    >
+      <div>
+        My
+        required
+      </div>
+    </StatelessTest>
+  </Translate>
+</Translate(StatelessTest)>
 `;
diff --git a/__test__/test.js b/__test__/test.js
@@ -1,6 +1,6 @@
 // @flow strict
 import React from 'react';
-import { mount } from 'enzyme';
+import { mount, shallow } from 'enzyme';
 import { Jed, translate, useI18n, I18nProvider, type I18nType } from '../src';
 import I18nContext from '../src/I18nContext';
 import mockI18n from '../src/mockI18n';
@@ -88,7 +88,9 @@ describe('<I18nProvider>', () => {
 describe('translate Component', () => {
     it('render translated component', () => {
         const LocalizedEle = translate(TestElement);
-        const localizedEle = mount(<LocalizedEle i18n={mockI18n} testProp="required" />);
+        const localizedEle = shallow(
+            <LocalizedEle i18n={mockI18n} testProp="required" />
+        ).dive();
         const instEle = localizedEle.instance();
         // $FlowFixMe
         expect(instEle.props.i18n).toEqual(mockI18n);
@@ -143,10 +145,15 @@ describe('translate Component', () => {
 
             test = () => {
                 const { current } = this.ref;
-                return current ? current.getName() : '';
+                // $FlowFixMe
+                if (current && typeof current.getName === 'function') {
+                    return current.getName();
+                }
+                return '';
             };
 
             render() {
+                // $FlowFixMe
                 return <B ref={this.ref} />;
             }
         }

diff --git a/src/translate.js b/src/translate.js
@@ -44,7 +44,7 @@ function translate<Com: React$ComponentType<*>>(
 
     ForwardedComponent.displayName = `Translate(${name})`;
 
-    return (hoistStatics(Translate, WrappedComponent): any);
+    return (hoistStatics(ForwardedComponent, WrappedComponent): any);
 }
 
 export default translate;