Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Examples folder #101

Open
janhesters opened this issue Apr 17, 2019 · 0 comments
Open

Examples folder #101

janhesters opened this issue Apr 17, 2019 · 0 comments

Comments

@janhesters
Copy link
Contributor

janhesters commented Apr 17, 2019

So, I've been using RITEway a lot over the last two weeks and I love it, especially for TDD 👌🏻 But there where some edge cases where I wasted up to a couple of hours figuring out the selectors. I think others could save that time.

I'm wondering whether you would be open for an examples/ folder? If you are okay with it, I would include the following cases (for which I already have the code, except for the regex one):

1, Select multiple elements in a React component with the same class (useful for lists, tables).
2, Select input's vaules in a React component
3, Test whether selection is a certain tag (e.g. <button /> or <select /> etc.) in React Component.
4. Add context and dummy required props for propTypes in a React component. This would be in the createComponent factory function. E.g.:

// in the component
Counter.propTypes = {
  onClick: PropTypes.func.isRequired
}

// ... in the test
const createCounter = clickCount =>
  render(
    <ClickCounter clicks={ clickCount } onClick={() => {}} />
  )
;
  1. Regex.
  2. The reducer from your "Unit Testing React Components" article and adding tests for selectors.

I still have 3 questions about these:

  1. Do you even recommend to use propTypes? If not, why not?
  2. You said you would use regex like this: /search text/.test(renderedOutput). I couldn't figure out how you would use this. Could you give a more concrete example?
  3. Is it correct that you would test selectors like this:
const getCount = state => state.counter;

assert({
 given: 'a click count and a click action',
 should: 'add a click to the count',
 actual: getCount({ counter: reducer(3, click()) }),
 expected: 4
});

If you could answer these questions and like the idea of an examples/ folder, I will make a PR asap 😊Also would you like to see another case?

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

No branches or pull requests

2 participants
@janhesters and others