foundation-datepicker icon indicating copy to clipboard operation
foundation-datepicker copied to clipboard

filling input not triggering changeDate event

Open sescobb27 opened this issue 8 years ago • 1 comments

hi, i'm doing some integration testing in my app using your lib but i'm having some issues triggering changeDate event when filling the delivery date input, here is code:

// My Component
export default Ember.Component.extend({
  didInsertElement: function () {
    let $datePicker = $('input[name="deliverydate"]');
    $datePicker.fdatepicker({
        format: 'mm/dd/yyyy',
        startDate: new Date()
      })
      .on('changeDate', this.deliveryDateObserver.bind(this));
  },
  deliveryDateObserver: function (event) {
    let newDate = new Date(event.date);
    newDate.setDate(newDate.getDate() + 1);
    let giftCard = this.get('giftCard');
    giftCard.set('deliveryDate', newDate);
  }
})

then in my testing code i'm trying to fill the input and make assertions about my component, but fdatepicker isn't triggering the changeDate event, do you know how can i make it work? thanks

// Testing Code
// $('.delivery-details input[name="deliverydate"]').fdatepicker('update', '11/30/2015');
fillIn('.delivery-details input[name="deliverydate"]', '11/30/2015');
andThen(() => {
  let errors = find('.delivery-details small.error');
  assert.equal(errors.length, 1);
  assert.equal(errors.eq(0).text(), "Send date must be in the future");
});

sescobb27 avatar Jun 24 '16 21:06 sescobb27

i already resolve the issue with the following code, but i think is hacky. i would appreciate any feedback, thanks

export default Ember.Component.extend({
  didInsertElement: function () {
    let $datePicker = $('input[name="deliverydate"]');
    let today = new Date();
    today.setDate(today.getDate() - 1);
    $datePicker.fdatepicker({
        format: 'mm/dd/yyyy',
        startDate: today
      })
      .on('changeDate', this.deliveryDateObserver.bind(this));
    $datePicker.on('change', function () {
      $datePicker.fdatepicker('update', $datePicker.val());
      $datePicker.trigger({
        type: 'changeDate',
        date: $datePicker.data('datepicker').getUTCDate()
      });
    });
  },
  deliveryDateObserver: function (event) {
    let newDate = new Date(event.date);
    newDate.setDate(newDate.getDate() + 1);
    let giftCard = this.get('giftCard');
    giftCard.set('deliveryDate', newDate);
  },
})

sescobb27 avatar Jun 24 '16 22:06 sescobb27