testing-library / testing-library/user-event

Provide a convenient way to select the whole text with type()

Open
#1,043 8 comments 8 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement needs specification
Dominant language
TypeScript
Stars
2.3k
Forks
258
PR merge metrics
No merged PRs in 30d

Description

Problem description

When using .type() I've been finding a common pattern that emerges is variations on the following

        await userEvent.type(titleInput, 'Edited title', {
          initialSelectionStart: 0,
          initialSelectionEnd: titleInput.value.length,
        });

To represent selecting the whole content and then overwriting it when typing

There was some related discussion in https://github.com/testing-library/user-event/issues/755#issuecomment-950689400

Suggested solution

Adding a new property like selectAll would be convenient, but probably opens up some awkward interactions if initialSelectionStart or initialSelectionEnd are also supplied.

From poking around in the code it looks like if I simply set a large value for initialSelectionEnd then it'll get clamped to the length of the input - which is basically what I want (although it's still quite verbose in a test). Perhaps the answer would be document the pattern of using a large number or Infinity as the selection end?

Additional context

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start at the .type() entry point and trace how initialSelectionStart and initialSelectionEnd are handled, then review the related discussion in issue 755. Determine whether a concise whole-text selection option or documented selection-end pattern fits the existing API, and verify that typing replaces the complete input value without ambiguous option interactions.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend, testing
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
52/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.