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

type regression if textarea has no value before typing #346

Closed
loekup opened this issue Jun 15, 2020 · 14 comments
Closed

type regression if textarea has no value before typing #346

loekup opened this issue Jun 15, 2020 · 14 comments
Labels
environment:jsdom Issue with JSDOM environment released

Comments

@loekup
Copy link

loekup commented Jun 15, 2020

  • @testing-library/user-event version:
  • Testing Framework and version: 11.4.2
  • DOM Environment:
    jest@26.0.1
    @testing-library/jest-dom@5.9.0
    @testing-library/react@10.2.1

Relevant code or config

test(" empty textarea", async () => {
  render(<textarea data-testid="textbox" />);

  await userEvent.type(screen.getByTestId("textbox"), "1234");
  expect(screen.getByRole("textbox")).toHaveValue("1234");
});

What you did:

Updated from 11.2.1 to 11.4.2

What happened:

library code types incorrectly if the textarea has no value when it start typing

Reproduction repository:
https://codesandbox.io/s/user-event-type-to-add-text-issue-exgpf?file=/src/__tests__/App.test.js

Problem description:

It seems like the "type" event returns to the beginning of the line after it has typed the first letter, after that it returns to normal resulting in the first letter always being at the end of the word/sentence

@bmerkle3
Copy link

I'm following this issue as we encountered the same.

if we expected to get the following input: "Entering a note."
we are currently receiving: "ntering a note.E"

@kentcdodds
Copy link
Member

Thanks for the report you two. I'll get this fixed soon. Doing a bunch of work on user-event right now.

@kentcdodds
Copy link
Member

If I download the codesandbox locally, it passes 🤔

image

@loekup
Copy link
Author

loekup commented Jun 16, 2020

Did some further testing, the problem lies in 'jest-environment-jsdom-sixteen' in my own project i was running 'jest-environment-jsdom-global' and apparently the codesandbox online runner ignores the --env in the package scripts

@mpgon
Copy link

mpgon commented Jun 16, 2020

I don't think it's related, but the newly typed value doesn't show in the rendered markup. Shouldn't it?

test(" empty textarea", async () => {
  const { debug } = render(<textarea data-testid="textbox" defaultValue="" />);


  debug(); // "" in textarea
  await userEvent.type(screen.getByTestId("textbox"), "1234");
  expect(screen.getByRole("textbox")).toHaveValue("2341"); // the other bug
  debug(); // still shows "" instead of "2341"
});

@nickmccurdy nickmccurdy added the environment:jsdom Issue with JSDOM environment label Jun 16, 2020
@kentcdodds
Copy link
Member

I don't know. I'd have to look into it. You can if you like 😁

@nickmccurdy nickmccurdy added the needs investigation Someone has to do research on this label Jun 16, 2020
@twdrake-ap
Copy link

Yeah type is busted for me as well. Not modifying the input at all.

@kentcdodds
Copy link
Member

🎉 This issue has been resolved in version 12.0.4 🎉

The release is available on:

Your semantic-release bot 📦🚀

@mpgon
Copy link

mpgon commented Jun 22, 2020

The codesandbox repro case above is still failing for me for versions 12.0.4/5/6

@marcosvega91
Copy link
Member

marcosvega91 commented Jun 22, 2020

The problem here is that before typing selectionStart and selectionEnd are undefined. I think that can be a problem of jsdom instead.

@nickmccurdy
Copy link
Member

If anyone still has this issue, I think I've tracked it down in #391 (comment), and you can subscribe to #391 for updates

@dave-cabbage
Copy link

I'm using the latest version of user-event but I still kept getting this issue, so I had to resort to setting a selection text before typing. That seemed to work

@ph-fritsche
Copy link
Member

@dave-cabbage The reproduction example of this issue works as expected with up-to-date dependencies:
https://codesandbox.io/s/user-event-type-to-add-text-issue-forked-dezvq?file=/src/__tests__/App.test.js

Are you by chance using an old version of jsdom?

If your problem does not resolve by updating the dependencies on your project, please file a new issue with a reproduction example like above. :)

@dave-cabbage
Copy link

Yes @ph-fritsche, I'm using jsdom 15 with jest-environment-jsdom-fifteen. I had to downgrade to this from 16 because my CRA didn't play well with jsdom 16.
Anyways, I'll have to refactor this in the future and I'll check again, but until then, selecting the text works for me.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
environment:jsdom Issue with JSDOM environment released
Projects
None yet
Development

No branches or pull requests

9 participants