diff --git a/react-cropper/react-cropper-tests.tsx b/react-cropper/react-cropper-tests.tsx
new file mode 100644
index 0000000000..05a11202c0
--- /dev/null
+++ b/react-cropper/react-cropper-tests.tsx
@@ -0,0 +1,25 @@
+
+import * as React from 'react';
+import Cropper from 'react-cropper';
+// If you choose not to use import, you need to assign Cropper to default
+// var Cropper = require('react-cropper').default
+
+class Demo extends React.Component<{}, {}> {
+    crop() {
+        // image in dataUrl
+        console.log((this.refs['cropper'] as any).getCroppedCanvas().toDataURL());
+    }
+
+    render() {
+        return (
+            <Cropper
+                ref='cropper'
+                src='http://fengyuanchen.github.io/cropper/img/picture.jpg'
+                style={{ height: 400, width: '100%' }}
+                // Cropper.js options
+                aspectRatio={16 / 9}
+                guides={false}
+                crop={this.crop.bind(this) } />
+        );
+    }
+}