Remove deprecated UNSAFE_componentWillUpdate in SLDSDataTable #3053
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes # Deprecation Warning in console about UNSAFE_componentWillUpdate which "promotes unsafe coding practices" - React Blog
Additional description
While
UNSAFE_componentWillUpdateis called right before render,getSnapshotBeforeUpdateis called right before mutating the DOM. According to the React Documentation, the combination ofgetSnapshotBeforeUpdateandcomponentDidUpdateshould cover all use cases for the legacycomponentWillUpdate.In this case since the purpose of using
UNSAFE_componentWillUpdateappeared to be resetting the interactive elements for the datatable if the props differed, I moved this logic intogetSnapshotBeforeUpdate. However, sincegetSnapshotBeforeUpdategets the previous props rather than the next props, the if-statement had to be slightly adjusted. Additionally, becausegetSnapshotBeforeUpdatemust contain a return statement(the return is passed as the third parameter tocomponentDidUpdate), it simply returns null. This change avoid the deprecation warning and enables the same behavior as withUNSAFE_componentWillUpdate.CONTRIBUTOR checklist (do not remove)
Please complete for every pull request
npm run lint:fixhas been run and linting passes.components/component-docs.jsonCI tests pass (npm test).REVIEWER checklist (do not remove)
components/component-docs.jsontests.Required only if there are markup / UX changes
last-slds-markup-reviewinpackage.jsonand push.last-accessibility-review, topackage.jsonand push.npm run local-updatewithin locally cloned site repo to confirm the site will function correctly at the next release.