fix: Respect maxLength prop in type() function #1641
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This commit modifies the `type()` function to respect the `maxLength` prop of the input element. If the current text length exceeds the `maxLength` value, typing events will not be emitted. This ensures that the input value does not exceed the specified maximum length. 1. Create an input element with a `maxLength` prop. 2. Use the `type()` function to input text that exceeds the `maxLength` value. 3. Verify that the input value does not exceed the specified maximum length. 4. Check that no typing events are emitted once the `maxLength` is reached. Additionally, see that `yarn test` passes with an additional test added to `src/user-event/type/__tests__/type.test.tsx`
|
Hi Josh, thanks for submitting this PR. I've done some experiments on iOS, Android and RN Web to check what is the actual behavior of user typing while reaching max chars limit. Here are my findings:
Based on this, I'll tweak your PR to match the iOS/RN Web behavior, as RNTL does not differentiate between platform behaviors but tries to "merge" them in some "reasonable" way. |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #1641 +/- ##
==========================================
- Coverage 95.51% 95.49% -0.03%
==========================================
Files 99 100 +1
Lines 5400 5462 +62
Branches 857 873 +16
==========================================
+ Hits 5158 5216 +58
- Misses 242 246 +4 ☔ View full report in Codecov by Sentry. |
|
This PR has been released in v12.5.3 🎉 |
|
Thanks for tweaking this and getting it merged @mdjastrzebski! |
|
I bumped to the updated version in my project and I was able to remove my local patch! |
github-merge-queue bot
referenced
this pull request
in valora-inc/wallet
Sep 23, 2024
….2 (#6076) This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | |---|---|---|---|---|---| | [@testing-library/react-native](https://callstack.github.io/react-native-testing-library) ([source](https://redirect.github.com/callstack/react-native-testing-library)) | [`^12.4.5` -> `^12.7.2`](https://renovatebot.com/diffs/npm/@testing-library%2freact-native/12.4.5/12.7.2) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | --- ### Release Notes <details> <summary>callstack/react-native-testing-library (@​testing-library/react-native)</summary> ### [`v12.7.2`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.7.2): (2024-09-12) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.7.1...v12.7.2) #### What's Changed ##### Features - feat: simulated native TextInput state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1653](https://redirect.github.com/callstack/react-native-testing-library/pull/1653) - feat: support Switch checked state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1657](https://redirect.github.com/callstack/react-native-testing-library/pull/1657) - feat: support `Image` with `alt` prop as label by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1665](https://redirect.github.com/callstack/react-native-testing-library/pull/1665) ##### Bug Fixes - fix: use native state across the queries and matchers by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1667](https://redirect.github.com/callstack/react-native-testing-library/pull/1667) ##### Other - refactor: accessibility handling by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1658](https://redirect.github.com/callstack/react-native-testing-library/pull/1658) - refactor: scroll view native state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1661](https://redirect.github.com/callstack/react-native-testing-library/pull/1661) - refactor: simplify native state management by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1662](https://redirect.github.com/callstack/react-native-testing-library/pull/1662) - chore(deps-dev): bump [@​callstack/eslint-config](https://redirect.github.com/callstack/eslint-config) from 14.2.0 to 15.0.0 by [@​dependabot](https://redirect.github.com/dependabot) in [https://github.com/callstack/react-native-testing-library/pull/1650](https://redirect.github.com/callstack/react-native-testing-library/pull/1650) #### New Contributors - [@​amandeepmittal](https://redirect.github.com/amandeepmittal) made their first contribution in [https://github.com/callstack/react-native-testing-library/pull/1660](https://redirect.github.com/callstack/react-native-testing-library/pull/1660) **Full Changelog**: callstack/react-native-testing-library@v12.6.1...v12.7.1 ### [`v12.7.1`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.7.1): (2024-09-12) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.7.0...v12.7.1) #### What's Changed ##### Features - feat: simulated native TextInput state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1653](https://redirect.github.com/callstack/react-native-testing-library/pull/1653) - feat: support Switch checked state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1657](https://redirect.github.com/callstack/react-native-testing-library/pull/1657) - feat: support `Image` with `alt` prop as label by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1665](https://redirect.github.com/callstack/react-native-testing-library/pull/1665) ##### Other - refactor: accessibility handling by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1658](https://redirect.github.com/callstack/react-native-testing-library/pull/1658) - refactor: scroll view native state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1661](https://redirect.github.com/callstack/react-native-testing-library/pull/1661) - refactor: simplify native state management by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1662](https://redirect.github.com/callstack/react-native-testing-library/pull/1662) - chore(deps-dev): bump [@​callstack/eslint-config](https://redirect.github.com/callstack/eslint-config) from 14.2.0 to 15.0.0 by [@​dependabot](https://redirect.github.com/dependabot) in [https://github.com/callstack/react-native-testing-library/pull/1650](https://redirect.github.com/callstack/react-native-testing-library/pull/1650) #### New Contributors - [@​amandeepmittal](https://redirect.github.com/amandeepmittal) made their first contribution in [https://github.com/callstack/react-native-testing-library/pull/1660](https://redirect.github.com/callstack/react-native-testing-library/pull/1660) **Full Changelog**: callstack/react-native-testing-library@v12.6.1...v12.7.1 ### [`v12.7.0`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.7.0): (2024-09-12) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.6.1...v12.7.0) #### What's Changed ##### Features - feat: simulated native TextInput state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1653](https://redirect.github.com/callstack/react-native-testing-library/pull/1653) - feat: support Switch checked state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1657](https://redirect.github.com/callstack/react-native-testing-library/pull/1657) - feat: support `Image` with `alt` prop as label by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1665](https://redirect.github.com/callstack/react-native-testing-library/pull/1665) ##### Other - refactor: accessibility handling by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1658](https://redirect.github.com/callstack/react-native-testing-library/pull/1658) - refactor: scroll view native state by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1661](https://redirect.github.com/callstack/react-native-testing-library/pull/1661) - refactor: simplify native state management by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1662](https://redirect.github.com/callstack/react-native-testing-library/pull/1662) - chore(deps-dev): bump [@​callstack/eslint-config](https://redirect.github.com/callstack/eslint-config) from 14.2.0 to 15.0.0 by [@​dependabot](https://redirect.github.com/dependabot) in [https://github.com/callstack/react-native-testing-library/pull/1650](https://redirect.github.com/callstack/react-native-testing-library/pull/1650) #### New Contributors - [@​amandeepmittal](https://redirect.github.com/amandeepmittal) made their first contribution in [https://github.com/callstack/react-native-testing-library/pull/1660](https://redirect.github.com/callstack/react-native-testing-library/pull/1660) **Full Changelog**: callstack/react-native-testing-library@v12.6.1...v12.7.0 ### [`v12.6.1`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.6.1): (2024-08-28) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.6.0...v12.6.1) #### What's Changed - refactor: remove real timers warning in User Event by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1654](https://redirect.github.com/callstack/react-native-testing-library/pull/1654) **Full Changelog**: callstack/react-native-testing-library@v12.6.0...v12.6.1 ### [`v12.6.0`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.6.0): (2024-08-16) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.5.3...v12.6.0) ##### What's changed ##### Features - update `type()` events to match RN 0.75 (remove 'textInput' event) ([#​1645](https://redirect.github.com/callstack/react-native-testing-library/issues/1645)) ([f0df299](https://redirect.github.com/callstack/react-native-testing-library/commit/f0df2994df90357060ac0cfa8e8ef049b4dd9a9c)) - User Event `paste()` interaction ([#​1646](https://redirect.github.com/callstack/react-native-testing-library/issues/1646)) ([38bceed](https://redirect.github.com/callstack/react-native-testing-library/commit/38bceed25b8f84ccaa6c0938f7ab21b112c209e2)) ### [`v12.5.3`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.5.3): (2024-08-09) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.5.2...v12.5.3) #### What's Changed - fix: Respect maxLength prop in type() function by [@​joshuayoes](https://redirect.github.com/joshuayoes) in [https://github.com/callstack/react-native-testing-library/pull/1641](https://redirect.github.com/callstack/react-native-testing-library/pull/1641) - chore: remove broken `experiments-rtl` app by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1642](https://redirect.github.com/callstack/react-native-testing-library/pull/1642) #### New Contributors - [@​joshuayoes](https://redirect.github.com/joshuayoes) made their first contribution in [https://github.com/callstack/react-native-testing-library/pull/1641](https://redirect.github.com/callstack/react-native-testing-library/pull/1641) **Full Changelog**: callstack/react-native-testing-library@v12.5.2...v12.5.3 ### [`v12.5.2`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.5.2) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.5.1...v12.5.2) ##### Bug Fixes - toBeVisible edge case for style values ([#​1640](https://redirect.github.com/callstack/react-native-testing-library/issues/1640)) ([be31579](https://redirect.github.com/callstack/react-native-testing-library/commit/be3157999108f08babc39db25b0721c64c4fbb24)) ### [`v12.5.1`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.5.1) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.5.0...v12.5.1) ##### Bug Fixes - immediate setState in useEffect for unstable_validateStringsRenderedWithinText ([#​1612](https://redirect.github.com/callstack/react-native-testing-library/issues/1612)) ([76de7d2](https://redirect.github.com/callstack/react-native-testing-library/commit/76de7d2b2e814ab2c9d6b30331cc138f2659bc7e)) ### [`v12.5.0`](https://redirect.github.com/callstack/react-native-testing-library/releases/tag/v12.5.0) [Compare Source](https://redirect.github.com/callstack/react-native-testing-library/compare/v12.4.5...v12.5.0) ##### Features - `*ByRole` TypeScript hints by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1596](https://redirect.github.com/callstack/react-native-testing-library/pull/1596) ##### Bug Fixes - User Event: expose common base synthetic event methods by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1589](https://redirect.github.com/callstack/react-native-testing-library/pull/1589) - proper `act` usage by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1592](https://redirect.github.com/callstack/react-native-testing-library/pull/1592) - pass through Test Renderer options by [@​mdjastrzebski](https://redirect.github.com/mdjastrzebski) in [https://github.com/callstack/react-native-testing-library/pull/1594](https://redirect.github.com/callstack/react-native-testing-library/pull/1594) #### New Contributors - [@​iaurg](https://redirect.github.com/iaurg) made their first contribution in [https://github.com/callstack/react-native-testing-library/pull/1591](https://redirect.github.com/callstack/react-native-testing-library/pull/1591) </details> --- ### Configuration 📅 **Schedule**: Branch creation - "before 4am on Monday" in timezone America/Los_Angeles, Automerge - "after 5pm,every weekend" in timezone America/Los_Angeles. 🚦 **Automerge**: Enabled. ♻ **Rebasing**: Whenever PR is behind base branch, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box --- This PR was generated by [Mend Renovate](https://mend.io/renovate/). View the [repository job log](https://developer.mend.io/github/valora-inc/wallet). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzOC44MC4wIiwidXBkYXRlZEluVmVyIjoiMzguODAuMCIsInRhcmdldEJyYW5jaCI6Im1haW4iLCJsYWJlbHMiOlsibnBtIiwicmVub3ZhdGUiXX0=--> Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Summary
This PR modifies the
type()function to respect themaxLengthprop of the input element. If the current text length exceeds themaxLengthvalue, typing events will not be emitted. This ensures that the input value does not exceed the specified maximum length.Resolves #1239
Test plan
maxLengthprop.type()function to input text that exceeds themaxLengthvalue.maxLengthis reached.Additionally, see that
yarn testpasses with an additional test added tosrc/user-event/type/__tests__/type.test.tsx