Skip to content

Exposing onChangeStart as a callback#66

Merged
davidchin merged 7 commits intodavidchin:masterfrom
oyeanuj:add-on-change-start
Mar 10, 2017
Merged

Exposing onChangeStart as a callback#66
davidchin merged 7 commits intodavidchin:masterfrom
oyeanuj:add-on-change-start

Conversation

@oyeanuj
Copy link
Copy Markdown
Contributor

@oyeanuj oyeanuj commented Mar 9, 2017

Hi @davidchin!

I noticed that there was onChange and onChangeCompleted` but nothing to indicate the start of that action. This is a callback that I needed as I integrated this with a media player. Let me know if this looks good to you!

Thank you!

Includes change to readme + test.
Copy link
Copy Markdown
Owner

@davidchin davidchin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @oyeanuj, thanks for your contribution. I think it's a good addition. Can you please have a look at my comments? They should be minor changes :)


if (this.props.onChangeStart) {
this.props.onChangeStart(this.props.value);
}
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you please add a linebreak between } and the next line? Thanks!

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done!

Comment thread test/input-range/input-range.spec.jsx Outdated
const onChange = jasmine.createSpy('onChange').and.callFake(value => component.setProps({ value }));
const onChangeStart = jasmine.createSpy('onChangeStart');
const jsx = (
<InputRange
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you please fix the indentation of this JSX block? At the moment, I think there are 3 spaces; instead, there should be 6. :)

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done!

Comment thread test/input-range/input-range.spec.jsx Outdated
onChangeStart={onChangeStart} />
);
const component = mount(jsx, { attachTo: container });
// eslint-disable-next-line quotes
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of disabling this rule, can you actually fix the ESLint issue? So, just use single quote 'Slider [onMouseDown]'.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

just removed the eslint line, didn't give any issues. I imagine, its just my editor.

Comment thread test/input-range/input-range.spec.jsx Outdated
document.dispatchEvent(new MouseEvent('mousemove', { clientX: 100, clientY: 50 }));
document.dispatchEvent(new MouseEvent('mousemove', { clientX: 150, clientY: 50 }));
document.dispatchEvent(new MouseEvent('mouseup', { clientX: 150, clientY: 50 }));
expect(onChangeStart.calls.count()).toEqual(0);
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you want to assert that onChangeStart should be called if it is defined. Currently, it asserts that it shouldn't be called?

oyeanuj added 5 commits March 9, 2017 08:04
copy-pasted from a section above to make sure my editor wasn’t up to
some weird tricks :)
sorry about that, was dealing with editor stuff!
@oyeanuj
Copy link
Copy Markdown
Contributor Author

oyeanuj commented Mar 9, 2017

@davidchin Thanks for the quick comments, and sorry about the annoying indentation changes. I've made the changes requested.

But there is one issue, the test is failing now. It seems to work when checked from the example, so I imagine I am setting up the test wrong. I'm not too familiar with this style of testing, so if could take a look there then that would be much appreciated!

@davidchin
Copy link
Copy Markdown
Owner

Hey @oyeanuj, thanks for doing the changes, much apprecated. I think the test is failing at the moment because it is really failing. If you look at handleInteractionStart method, you can see there's a guard statement - return early if onChangeComplete is undefined. That explains why it works in the example, but not in your test. So what you want instead is to move this.props.onChangeStart(this.props.value) above that guard statement. That will fix your issue.

- also changed the if statement to a positive statement for readability
@oyeanuj
Copy link
Copy Markdown
Contributor Author

oyeanuj commented Mar 10, 2017

@davidchin Thank you for spotting that! Added the commit to fix it, and the tests are passing now :)

Copy link
Copy Markdown
Owner

@davidchin davidchin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you!

@davidchin davidchin merged commit 4ca6ea2 into davidchin:master Mar 10, 2017
@oyeanuj
Copy link
Copy Markdown
Contributor Author

oyeanuj commented Mar 11, 2017

Awesome, thanks for merging! Also, do take a look at PRs #68 and #69 whenever you get a moment.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants