Skip to content

Warn about future changes to onChange callback [WIP] #1350

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

Conversation

interactivellama
Copy link
Contributor

@interactivellama interactivellama commented May 4, 2018

Fixes #273

Additional description

  • Removed breaking change label. This isn't one and just moves components under /forms that are not deprecated, aliases have been added to make backwards compatible. The current code is NOT a breaking change, but it will update the documentation to promote use of /components/checkbox instead.
  • The audit showed that checkbox and inline edit's onChange parameters are wrong (along with deprecated lookup's onChange, onBlur, onFocus, but we aren't updating Lookup).
  • DataTable's onChange is also (selectedArrayOfItems, event). I'm going think about that one a little more. I'm thinking onRowChange or onRowSelect would be the best backwards compatible option right now.
  • SLDS has moved their form components out from under the form folder, so a breaking change in event parameters was a good time to move the checkbox component out of the forms folder. That way, consumers can upgrade at their leisure--unless they are using the CommonJS named imports.
  • Right now, CommonJS and components/forms/checkbox users (that is everyone) will get the warning, but nothing will break.
  • Went ahead and converted checkbox to a ES6 class and removed a lodash function.
  • There was a comment in all the site-stories that mentioned forms-checkbox and that has been removed.
  • The first commit "Align event prop parameters" just adds from empty objects to a few components as the second parameter data object to existing event callbacks, just to guard from being undefined if accessed. This should be standardized.

Deprecation warning for InlineEdit
inline edit warning

Checkbox warning:
screen shot 2018-05-18 at 5 04 56 pm


Pull Request Review checklist (do not remove)

  • npm run lint:fix has been run and linting passes.
  • Mocha, Jest (Storyshots), and components/component-docs.json CI tests pass (npm test).
  • Tests have been added for new props to prevent regressions in the future. See readme.
  • Review the appropriate Storybook stories. Open http://localhost:9001/.
  • Review tests are passing in the browser. Open http://localhost:8001/.
  • Review markup conforms to SLDS by looking at DOM snapshot strings.
  • Add year-first date and commit SHA to last-slds-markup-review in package.json and push.
  • Request a review of the deployed Heroku app by the Salesforce UX Accessibility Team.
  • Add year-first review date, and commit SHA, last-accessibility-review, to package.json and push.
  • While the contributor's branch is checked out, run npm run local-update within locally cloned site repo to confirm the site will function correctly at the next release.

* The audit showed that checkbox and inline edit's `onChange` are wrong (along with deprecated lookup's onChange, onBlur, onFocus, but we aren't updating Lookup). DataTable's `onChange` is also `(selectedArrayOfItems, event)`. I'm going think about that one a little more.
* SLDS has moved their form components out from under the form folder, so a breaking change in event parameters was a good time to move the `checkbox` component out of the forms folder. That way, consumers can upgrade at their leisure--unless they are using the CommonJS named imports.
* Right now, CommonJS and `components/forms/checkbox` users (that is everyone) will get the warning, but nothing will break.
* Went ahead and converted checkbox to a ES6 class and removed a lodash function.
* There was a comment in all the site-stories that mentioned `forms-checkbox` and that has been removed.
* The first commit "Align event prop parameters" just adds from empty objects to a few components as the second parameter `data` object to existing event callbacks, just to guard from being `undefined` if accessed. This should be standardized.
* If oldEventParameterOrder is true, a warning will fire. This will tell folks to change their path—if they are consuming the source code. The CommonJS named imports will just have to break at the next breaking change due to the parameter change, since you can’t change the path.
@interactivellama interactivellama force-pushed the event-parameter-standardize branch from 86248c4 to e8c984e Compare May 23, 2018 20:13
propAsString: 'onChange',
propAsValue: props.onChange,
},
'`components/forms/checkbox` is deprecated. `components/checkbox` should be used. When this path update is made `onChange` event parameters will change from `onChange(value, event, { value } to `onChange(event, { value }). Please update your event parameters when you change paths.` If you are using the CommonJS named import, `Checkbox` events will break at v1.0 and this warning will be present until then. Please review https://github.com/salesforce/design-system-react/releases when you upgrade.'
Copy link
Contributor

Choose a reason for hiding this comment

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

Minor: missing ) in onChange(value, event, { value } to ...

'`components/forms/checkbox` is deprecated. `components/checkbox` should be used. When this path update is made `onChange` event parameters will change from `onChange(value, event, { value } to `onChange(event, { value }). Please update your event parameters when you change paths.` If you are using the CommonJS named import, `Checkbox` events will break at v1.0 and this warning will be present until then. Please review https://github.com/salesforce/design-system-react/releases when you upgrade.'
);

if (props.variant === 'toggle' && props.indeterminate === true) {
Copy link
Contributor

Choose a reason for hiding this comment

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

Minor : === true not necessary?

davidlygagnon
davidlygagnon previously approved these changes Jun 7, 2018
Copy link
Contributor

@davidlygagnon davidlygagnon left a comment

Choose a reason for hiding this comment

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

Looks good to me!

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

Successfully merging this pull request may close these issues.

Audit components: event callbacks should pass syntheticEvent, then customData object
2 participants