make computed depend on validation param. fixes #648

addon/mixins/validation-mixin.js

@@ -3,7 +3,7 @@
  */
 import Ember from 'ember';
 
-const { Mixin, computed, A, assert, isArray, Logger, get, String: { loc } } = Ember;
+const { Mixin, computed, A, assert, isArray, Logger, get, String: { loc }, isBlank } = Ember;
 
 import requiredValidator from 'ember-paper/validators/required';
 import minValidator from 'ember-paper/validators/min';
@@ -19,8 +19,11 @@ import maxlengthValidator from 'ember-paper/validators/maxlength';
  *
  * @return computed property that depends on the supplied property name
  */
-function buildComputedValidationMessages(property) {
-  return computed(property, 'errors.[]', 'customValidations.[]', function() {
+function buildComputedValidationMessages(property, validations = [], customValidations = []) {
+  let validationParams = validations.map((v) => get(v, 'param')).filter((v) => !isBlank(v));
+  let customValidationParams = customValidations.map((v) => get(v, 'param')).filter((v) => !isBlank(v));
+
+  return computed(property, 'errors.[]', 'customValidations.[]', ...validationParams, ...customValidationParams, function() {
     let validations = A();
     let messages = A();
 
@@ -69,11 +72,17 @@ export default Mixin.create({
   validationErrorMessages: null,
   lastIsInvalid: undefined,
   validationProperty: null, // property that validation should be based on
+
   init() {
     this._super(...arguments);
     assert('validationProperty must be set', this.get('validationProperty'));
     if (!this.get('validationErrorMessages')) {
-      this.set('validationErrorMessages', buildComputedValidationMessages(this.get('validationProperty')));
+      let computedValidationMessages = buildComputedValidationMessages(
+        this.get('validationProperty'),
+        this.validations(),
+        this.get('customValidations')
+      );
+      this.set('validationErrorMessages', computedValidationMessages);
     }
   },
 

tests/integration/components/paper-input-test.js

@@ -347,6 +347,52 @@ test('custom validations work', function(assert) {
   assert.equal(this.$('.paper-input-error').last().text().trim(), 'You can\'t include the substring cc.');
 });
 
+test('changing param in built-in validations works', function(assert) {
+  assert.expect(3);
+
+  this.value = '';
+  this.required = false;
+
+  this.render(hbs`
+    {{paper-input value=value onChange=dummyOnChange isTouched=true
+      required=required}}
+  `);
+
+  assert.equal(this.$('.paper-input-error').length, 0, 'no errors');
+
+  this.set('required', true);
+
+  assert.equal(this.$('.paper-input-error').length, 1, 'renders one error');
+  assert.equal(this.$('.paper-input-error').first().text().trim(), 'This is required.');
+});
+
+test('changing param in custom validations works', function(assert) {
+  assert.expect(6);
+
+  this.value = 'aaabbbccc';
+  this.notinclude = 'cc';
+  this.customValidations = [{
+    param: 'notinclude',
+    message: 'You can\'t include the substring %@.',
+    validate: (value, notinclude) => typeof value === 'string' && value.indexOf(notinclude) === -1
+  }];
+
+  this.render(hbs`
+    {{paper-input value=value onChange=dummyOnChange isTouched=true
+      maxlength=8 customValidations=customValidations notinclude=notinclude}}
+  `);
+
+  assert.equal(this.$('.paper-input-error').length, 2, 'renders two errors');
+  assert.equal(this.$('.paper-input-error').first().text().trim(), 'Must not exceed 8 characters.');
+  assert.equal(this.$('.paper-input-error').last().text().trim(), 'You can\'t include the substring cc.');
+
+  this.set('notinclude', 'bb');
+
+  assert.equal(this.$('.paper-input-error').length, 2, 'renders two errors');
+  assert.equal(this.$('.paper-input-error').first().text().trim(), 'Must not exceed 8 characters.');
+  assert.equal(this.$('.paper-input-error').last().text().trim(), 'You can\'t include the substring bb.');
+});
+
 test('custom validations without param work', function(assert) {
   assert.expect(3);