autoNumeric/vue-autoNumeric

Prop Validation Returns Error if Empty String

Closed this issue · 3 comments

DinsmoreDesign commented

Hey guys,

Loving the functionality of this library so far, but my only real issue so far is that if I try to pass an empty string (""), I get the following error:

image

As far as I can tell, it's necessary to pass an empty string into the component for it to show the Placeholder value. The component still works as intended after I enter a number, but I'm not too fond of seeing a giant red warning on my console, when it's really not an issue that I can see. Can we add prop validation for a String as well, so an empty value can be passed, or is there a better way to do this?

Thanks!

AlexandreBonneau commented

Hey @DinsmoreDesign, I've added some tests in the examples-src/App.vue file to see if I can reproduce this error:

  • when initializing the component with an empty v-model ''
  • when using the AutoNumeric clear(true) method of the component
  • when using the AutoNumeric set('') method of the component

but couldn't see that message you described, which is odd since I explicitly pass the empty string to the component and I should see that too.

Would you have a reproducible test case?

DinsmoreDesign commented

@AlexandreBonneau Hmm... oddly enough, I can't seem to get this to replicate on the Codepen example. I'm using the module system in my app.

I can't seem to get your project to run properly, but copying and pasting your example into my own project, it still reproduces the console error for me:

https://github.com/DinsmoreDesign/Vue-AutoNumeric-Test

AlexandreBonneau commented

Ok, I fixed the bug, and am going to push it with other fixes in the next couple hours.

For info, you will be able to check that it works with your test project, but you will need to modify your webpack configuration to add the following alias:

resolve: {
  alias: {
    'vue$': 'vue/dist/vue.esm.js',
    AutoNumeric: 'autonumeric/dist/autoNumeric.min', // The new line to add
  },
  extensions: ['*', '.js', '.vue', '.json']
},

If you don't, the build will still work, but you'll get an error from uglifyjs.

  • 👍1