Merge pull request #6 from synacor/getWrappedComponent

add getWrappedComponent method to provide and mergingProvide decorators

README.md

@@ -145,6 +145,8 @@ const Demo = (props, context) => {
 };
 const ProvidedDemo = provide({a: "b"})(Demo);
 
+ProvidedDemo.getWrappedComponent() === Demo; // true
+
 render( <ProvidedDemo /> );
 ```
 
@@ -167,6 +169,8 @@ const Demo = (props, context) => {
 };
 const ProvidedDemo = mergingProvide({a: "b"})(Demo);
 
+ProvidedDemo.getWrappedComponent() === Demo; // true
+
 render( <ProvidedDemo /> ); // "b"
 ```
 

package.json

@@ -10,7 +10,7 @@
   "source": "src/index.js",
   "scripts": {
     "lint": "eslint src test",
-    "test": "npm-run-all -p lint test:unit test:prod",
+    "test": "npm-run-all -p lint test:unit build -s test:prod",
     "test:unit": "karma start karma.conf.js --single-run",
     "test:prod": "TEST_PRODUCTION=true npm run test:unit",
     "test:watch": "npm run test:unit -- --no-single-run",

src/index.js

@@ -146,9 +146,15 @@ export class MergingProvider {
  * };
  * const ProvidedDemo = provide({a: "b"})(Demo);
  *
+ * ProvidedDemo.getWrappedComponent() === Demo; // true
+ *
  * render( <ProvidedDemo /> );
  */
-export const provide = ctx => Child => props => h(Provider, ctx, h(Child, props));
+export const provide = ctx => Child => {
+	const ProviderWrapper = props => h(Provider, ctx, h(Child, props));
+	ProviderWrapper.getWrappedComponent = Child && Child.getWrappedComponent || (() => Child);
+	return ProviderWrapper;
+};
 
 Provider.provide = provide;
 
@@ -166,6 +172,12 @@ Provider.provide = provide;
  * };
  * const ProvidedDemo = mergingProvide({a: "b"})(Demo);
  *
+ * ProvidedDemo.getWrappedComponent() === Demo; // true
+ *
  * render( <ProvidedDemo /> ); // "b"
  */
-export const mergingProvide = ctx => Child => props => h(MergingProvider, ctx, h(Child, props));
+export const mergingProvide = ctx => Child => {
+	const MergingProviderWrapper = props => h(MergingProvider, ctx, h(Child, props));
+	MergingProviderWrapper.getWrappedComponent = Child && Child.getWrappedComponent || (() => Child);
+	return MergingProviderWrapper;
+};

test/index.js

@@ -93,6 +93,26 @@ describe('preact-context-provider', () => {
 			let ProvidedSpy = provide(context)(Spy);
 			expect(<ProvidedSpy foo="bar" />).to.equal(<Provider a={{ name: 'a' }} b="b"><Spy foo="bar" /></Provider>);
 		});
+
+		describe('getWrappedComponent()', () => {
+
+			it('should be a function', () => {
+				let Wrapped = provide(context)(Spy);
+				expect(Wrapped.getWrappedComponent).to.be.a('function');
+			});
+
+			it('should return the Child component that it is wrapping', () => {
+				let Wrapped = provide(context)(Spy);
+				expect(Wrapped.getWrappedComponent()).to.equal(Spy);
+			});
+
+			it('should recursively call getWrappedComponent() on Child components to return the first non-decorator Child', () => {
+				let Wrapped = provide(context)(provide(context)(Spy));
+				expect(Wrapped.getWrappedComponent()).to.equal(Spy);
+			});
+
+		});
+
 	});
 
 	describe('mergingProvide()', () => {
@@ -104,5 +124,25 @@ describe('preact-context-provider', () => {
 			let MergingProvidedSpy = mergingProvide({ ...context, mergeProps: true })(Spy);
 			expect(<MergingProvidedSpy foo="bar" />).to.equal(<MergingProvider a={{ name: 'a' }} b="b" mergeProps><Spy foo="bar" /></MergingProvider>);
 		});
+
+		describe('getWrappedComponent()', () => {
+
+			it('should be a function', () => {
+				let MergingProvidedSpy = mergingProvide({ ...context, mergeProps: true })(Spy);
+				expect(MergingProvidedSpy.getWrappedComponent).to.be.a('function');
+			});
+
+			it('should return the Child component that it is wrapping', () => {
+				let MergingProvidedSpy = mergingProvide({ ...context, mergeProps: true })(Spy);
+				expect(MergingProvidedSpy.getWrappedComponent()).to.equal(Spy);
+			});
+
+			it('should recursively call getWrappedComponent() on Child components to return the first non-decorator Child', () => {
+				let MergingProvidedSpy = mergingProvide({ ...context, mergeProps: true })(mergingProvide({ ...context, mergeProps: true })(Spy));
+				expect(MergingProvidedSpy.getWrappedComponent()).to.equal(Spy);
+			});
+
+		});
+
 	});
 });