Merge pull request react-component#101 from react-component/fix-attr-…

…accept

make attr-accept inline

package.json

@@ -51,7 +51,6 @@
     "lint"
   ],
   "dependencies": {
-    "attr-accept": "^1.1.0",
     "babel-runtime": "6.x",
     "classnames": "^2.2.5",
     "warning": "2.x",

src/AjaxUploader.jsx

@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import defaultRequest from './request';
 import getUid from './uid';
-import attrAccept from 'attr-accept';
+import attrAccept from './attr-accept';
 
 class AjaxUploader extends Component {
   static propTypes = {

src/attr-accept.js

@@ -0,0 +1,26 @@
+function endsWith(str, suffix) {
+  return str.indexOf(suffix, str.length - suffix.length) !== -1;
+}
+
+export default (file, acceptedFiles) => {
+  if (file && acceptedFiles) {
+    const acceptedFilesArray = Array.isArray(acceptedFiles)
+      ? acceptedFiles
+      : acceptedFiles.split(',');
+    const fileName = file.name || '';
+    const mimeType = file.type || '';
+    const baseMimeType = mimeType.replace(/\/.*$/, '');
+
+    return acceptedFilesArray.some(type => {
+      const validType = type.trim();
+      if (validType.charAt(0) === '.') {
+        return endsWith(fileName.toLowerCase(), validType.toLowerCase());
+      } else if (/\/\*$/.test(validType)) {
+        // This is something like a image/* mime type
+        return baseMimeType === validType.replace(/\/.*$/, '');
+      }
+      return mimeType === validType;
+    });
+  }
+  return true;
+};

tests/uploader.spec.js

@@ -35,6 +35,7 @@ describe('uploader', () => {
       action: '/test',
       data: { a: 1, b: 2 },
       multiple: true,
+      accept: '.png',
       onStart(file) {
         console.log('onStart', file, file.name);
         if (handlers.onStart) {
@@ -127,5 +128,51 @@ describe('uploader', () => {
         requests[0].respond(400, {}, `error 400`);
       }, 100);
     });
+
+    it('drag to upload', (done) => {
+      const input = TestUtils.findRenderedDOMComponentWithTag(uploader, 'input');
+
+      const files = [{
+        name: 'success.png',
+        toString() {
+          return this.name;
+        },
+      }];
+      files.item = (i) => files[i];
+
+      handlers.onSuccess = (ret, file) => {
+        expect(ret[1]).to.eql(file.name);
+        expect(file).to.have.property('uid');
+        done();
+      };
+
+      handlers.onError = (err) => {
+        done(err);
+      };
+
+      Simulate.drop(input, { dataTransfer: { files } });
+
+      setTimeout(() => {
+        requests[0].respond(200, {}, `["","${files[0].name}"]`);
+      }, 100);
+    });
+
+    it('drag unaccepted type files to upload will not trigger onStart', (done) => {
+      const input = TestUtils.findRenderedDOMComponentWithTag(uploader, 'input');
+      const files = [{
+        name: 'success.jpg',
+        toString() {
+          return this.name;
+        },
+      }];
+      files.item = (i) => files[i];
+      Simulate.drop(input, { dataTransfer: { files } });
+      const mockStart = jest.fn();
+      handlers.onStart = mockStart;
+      setTimeout(() => {
+        expect(mockStart.mock.calls.length).to.be(0);
+        done();
+      }, 100);
+    });
   });
 });