fix(core): make properties private

README.md

@@ -19,6 +19,7 @@ Features:
 - Reset your custom file input to its initial state
 - Handle form reset
 - Allow custom selectors for input, and form
+- Allow to drag and drop files
 - Small, only **2kb** and less if you gzip it
 
 ## Table of contents

karma.conf.js

@@ -15,7 +15,8 @@ module.exports = function(config) {
     files: [
       'tests/coverage/bs-custom-file-input.js',
       'tests/polyfill.js',
-      'tests/main.spec.js',
+      'tests/index.spec.js',
+      'tests/util.spec.js',
     ],
     exclude: [
       'tests/*.html',

rollup.config.js

@@ -16,7 +16,7 @@ const conf = {
   output: {
     banner:
 `/*!
- * BsCustomFileInput v${pkg.version} (${pkg.homepage})
+ * bsCustomFileInput v${pkg.version} (${pkg.homepage})
  * Copyright ${year} ${pkg.author}
  * Licensed under MIT (https://github.com/Johann-S/bs-custom-file-input/blob/master/LICENSE)
  */`,

src/index.js

@@ -6,24 +6,24 @@ import {
 import Selector from './selector'
 
 const Event = {
+  FORMRESET     : 'reset',
   INPUTCHANGE   : 'change',
   INPUTFOCUSIN  : 'focusin',
   INPUTFOCUSOUT : 'focusout',
-  FORMRESET     : 'reset',
 }
 
 const customProperty = 'bsCustomFileInput'
 
-const bsCustomFileInput = {
-  customInputSelector: null,
-  customFormSelector: null,
+let customFormSelector = null
+let customInputSelector = null
 
+const bsCustomFileInput = {
   init(inputSelector = Selector.CUSTOMFILE, formSelector = Selector.FORM) {
-    this.customInputSelector = inputSelector
-    this.customFormSelector = formSelector
+    customInputSelector = inputSelector
+    customFormSelector = formSelector
 
-    const customFileInputList = [].slice.call(document.querySelectorAll(this.customInputSelector))
-    const formList = [].slice.call(document.querySelectorAll(this.customFormSelector))
+    const customFileInputList = [].slice.call(document.querySelectorAll(customInputSelector))
+    const formList = [].slice.call(document.querySelectorAll(customFormSelector))
 
     for (let i = 0, len = customFileInputList.length; i < len; i++) {
       const input = customFileInputList[i]
@@ -44,8 +44,8 @@ const bsCustomFileInput = {
   },
 
   destroy() {
-    const formList = [].slice.call(document.querySelectorAll(this.customFormSelector))
-    const customFileInputList = [].slice.call(document.querySelectorAll(this.customInputSelector))
+    const formList = [].slice.call(document.querySelectorAll(customFormSelector))
+    const customFileInputList = [].slice.call(document.querySelectorAll(customInputSelector))
       .filter((input) => !!input.bsCustomFileInput)
 
     for (let i = 0, len = customFileInputList.length; i < len; i++) {

tests/index.spec.js

@@ -0,0 +1,103 @@
+var customInputFile = [
+  '<div class="custom-file">',
+  '  <input type="file" class="custom-file-input">',
+  '  <label class="custom-file-label">Choose file</label>',
+  '</div>',
+].join('')
+
+describe('index.js', function () {
+  var input
+  var mochaFixtureDiv
+
+  before(function () {
+    mochaFixtureDiv = document.getElementById('mocha-fixture')
+  })
+
+  beforeEach(function() {
+    mochaFixtureDiv.innerHTML = customInputFile
+    input = document.querySelector('input')
+  })
+
+  afterEach(function () {
+    mochaFixtureDiv.innerHTML = ''
+  })
+
+  describe('init', function () {
+    it('should add bsCustomFileInput property', function () {
+      bsCustomFileInput.init()
+
+      expect(input.bsCustomFileInput).not.undefined
+    })
+
+    it('should store default text', function () {
+      bsCustomFileInput.init()
+
+      var label = document.querySelector('.custom-file-label')
+
+      expect(input.bsCustomFileInput.defaultText).equal(label.innerHTML)
+    })
+
+    it('should add listener to the given input', function () {
+      var spy = sinon.spy(input, 'addEventListener')
+
+      bsCustomFileInput.init()
+
+      expect(spy.called).equal(true)
+    })
+
+    it('should add an event listener on forms', function () {
+      var form = document.createElement('form')
+      form.innerHTML = customInputFile
+
+      mochaFixtureDiv.appendChild(form)
+
+      var spy = sinon.spy(form, 'addEventListener')
+
+      bsCustomFileInput.init()
+
+      expect(spy.called).to.be.true
+    })
+
+    it('should select only my custom input selector', function () {
+      mochaFixtureDiv.innerHTML = [
+        '<input type="file" id="test" />',
+        customInputFile,
+      ].join('')
+
+      bsCustomFileInput.init('#test')
+
+      var testInput = document.getElementById('test')
+      var otherInput = document.querySelector('.custom-file input[type="file"]')
+
+      expect(testInput.bsCustomFileInput).not.undefined
+      expect(otherInput.bsCustomFileInput).undefined
+    })
+  })
+
+  describe('destroy', function () {
+    it('should remove bsCustomFileInput property', function () {
+      bsCustomFileInput.init()
+      bsCustomFileInput.destroy()
+
+      expect(input.bsCustomFileInput).to.undefined
+    })
+
+    it('should remove event listener on forms', function () {
+      var form = document.createElement('form')
+      form.innerHTML = [
+        '<div class="custom-file">',
+        '  <input type="file" class="custom-file-input">',
+        '</div>',
+      ].join('')
+
+      mochaFixtureDiv.appendChild(form)
+
+      var spy = sinon.spy(form, 'removeEventListener')
+
+      bsCustomFileInput.init()
+      bsCustomFileInput.destroy()
+
+      expect(spy.called).to.be.true
+    })
+  })
+})

tests/mocha.html

@@ -17,7 +17,8 @@
       mocha.setup('bdd')
       window.expect = chai.expect
     </script>
-    <script src="main.spec.js"></script>
+    <script src="index.spec.js"></script>
+    <script src="util.spec.js"></script>
     <script>
       document.addEventListener('DOMContentLoaded', function() {
         mocha.checkLeaks()

tests/polyfill.js

@@ -1,4 +1,8 @@
 (function () {
+  var mochaFixtureDiv = document.createElement('div')
+  mochaFixtureDiv.setAttribute('id', 'mocha-fixture')
+  document.body.appendChild(mochaFixtureDiv)
+
   // Polyfill new File()
   try {
     new File([], 'test.txt')

tests/main.spec.js → tests/util.spec.js

@@ -5,12 +5,7 @@ var customInputFile = [
   '</div>',
 ].join('')
 
-
-var mochaFixtureDiv = document.createElement('div')
-mochaFixtureDiv.setAttribute('id', 'mocha-fixture')
-document.body.appendChild(mochaFixtureDiv)
-
-describe('bsCustomInputFile', function () {
+describe('util.js', function () {
   var input
   var mochaFixtureDiv
 
@@ -27,93 +22,7 @@ describe('bsCustomInputFile', function () {
     mochaFixtureDiv.innerHTML = ''
   })
 
-  describe('init', function () {
-    it('should add bsCustomFileInput property', function () {
-      bsCustomFileInput.init()
-
-      expect(input.bsCustomFileInput).not.undefined
-    })
-
-    it('should store default text', function () {
-      bsCustomFileInput.init()
-
-      var label = document.querySelector('.custom-file-label')
-
-      expect(input.bsCustomFileInput.defaultText).equal(label.innerHTML)
-    })
-
-    it('should add listener to the given input', function () {
-      var spy = sinon.spy(input, 'addEventListener')
-
-      bsCustomFileInput.init()
-
-      expect(spy.called).equal(true)
-    })
-
-    it('should add an event listener on forms', function () {
-      var form = document.createElement('form')
-      form.innerHTML = customInputFile
-
-      mochaFixtureDiv.appendChild(form)
-
-      var spy = sinon.spy(form, 'addEventListener')
-
-      bsCustomFileInput.init()
-
-      expect(spy.called).to.be.true
-    })
-
-    it('should store custom input selector and custom form selector', function () {
-      bsCustomFileInput.init('input', '.form')
-
-      expect(bsCustomFileInput.customInputSelector).equal('input')
-      expect(bsCustomFileInput.customFormSelector).equal('.form')
-    })
-
-    it('should select only my custom input selector', function () {
-      mochaFixtureDiv.innerHTML = [
-        '<input type="file" id="test" />',
-        customInputFile,
-      ].join('')
-
-      bsCustomFileInput.init('#test')
-
-      var testInput = document.getElementById('test')
-      var otherInput = document.querySelector('.custom-file input[type="file"]')
-
-      expect(testInput.bsCustomFileInput).not.undefined
-      expect(otherInput.bsCustomFileInput).undefined
-    })
-  })
-
-  describe('destroy', function () {
-    it('should remove bsCustomFileInput property', function () {
-      bsCustomFileInput.init()
-      bsCustomFileInput.destroy()
-
-      expect(input.bsCustomFileInput).to.undefined
-    })
-
-    it('should remove event listener on forms', function () {
-      var form = document.createElement('form')
-      form.innerHTML = [
-        '<div class="custom-file">',
-        '  <input type="file" class="custom-file-input">',
-        '</div>',
-      ].join('')
-
-      mochaFixtureDiv.appendChild(form)
-
-      var spy = sinon.spy(form, 'removeEventListener')
-
-      bsCustomFileInput.init()
-      bsCustomFileInput.destroy()
-
-      expect(spy.called).to.be.true
-    })
-  })
-
-  describe('util - handleInputChange', function () {
+  describe('handleInputChange', function () {
     it('should change the label when a file is selected', function (done) {
       bsCustomFileInput.init()
 
@@ -172,7 +81,7 @@ describe('bsCustomInputFile', function () {
     })
   })
 
-  describe('util - handleFormReset', function () {
+  describe('handleFormReset', function () {
     var form
 
     beforeEach(function () {