TrackedInput with type='checkbox' doesn't trigger events

[Yankovsky]

<TrackedInput
  id='myid'
  type='checkbox'
/>

won't fire any events, because the value doesn't change for the checkbox. Either TrackedInput should track checked value change, or there should be a separate component TrackedCheckbox. Currently, the problem could be solved by manually setting value property, but I think this should be integrated into the library.

Also, I think it would be a great addition to add a warning if someone tries to use TrackedInput with type=radio or type=checkbox.

Thank you!

[sdirosa]

TrackedInput should track checked value change

Checkboxes are a bit arbitrary because in some cases it may make sense to track the value property, while in other cases we only care whether the checkbox is selected or not. And sometimes both.

What would be the preferred behavior in your case?

---

FYI:

There's a new version of the SDK that allows to track custom event handlers and stateless inputs : https://github.com/objectiv/objectiv-analytics/pull/1127.

It's available on npm as 0.0.24-next.5

So you could do something like this:

<TrackedInput 
  type={"checkbox"} 
  id={'checkbox-1'} 
  stateless={true} 
  eventHandler={'onChange'}  // or 'onClick'
  trackValue={true} 
  value={'value-1'}
/>

This will track values only though. So an event will be triggered when the checkbox is checked or unchecked, and there's no way of distinguishing them currently.

I think a TrackedInputCheckbox makes sense. It should probably, automatically, gather the checked attribute as InputValueContext.

Would that cover your use-cases?

Also, I think it would be a great addition to add a warning if someone tries to use TrackedInput with type=radio or type=checkbox.

This is a great idea 👌🏼

[Yankovsky]

Thank you for a quick response!

I think it should be either one very smart TrackedInput component, that will know how to handle any input types, or a set of separate components (radio, checkbox, date, file, etc.). Personally, I prefer the latter option.

[sdirosa]

@Yankovsky I went for a smart TrackedInputContext: https://github.com/objectiv/objectiv-analytics/pull/1136

Still working on it:

• Verifying the onChange weirdness while testing
• Adding some more validation messages, as you suggested

I plan to release a preview of this probably early afternoon and give it a round of testing

[sdirosa]

React SDK: easier tracking of checked based inputs + select has been merged in the next tag.

A prerelease has been pushed to NPM: https://www.npmjs.com/package/@objectiv/tracker-react/v/0.0.24-next.12

I'll wait for the new documentation to be live before promoting that to latest and closing this issue.