web-dev-qa-db-fra.com

Comment coller des données de presse-papiers à l'aide de React Library?

J'essaie de coller du texte qui est déjà dans mon presse-papier dans une zone de texte, mais je ne comprends pas comment utiliser "Eventinit" pour faire cela. J'ai lu la documentation sur la façon de coller du texte dans une zone de texte, mais il n'est pas clair sur la façon d'utiliser EventInit.

Comment puis-je coller du texte qui est dans mon presse-papier dans une zone de texte à l'aide de UserEvent?

Ceci est mon code:

test('Copy id button copies correct id', async () => {
  const { getAllByLabelText, debug, getByText } = render(
    <MockedProvider mocks={mocks} addTypename={false}>
      <History />
    </MockedProvider>
  );

  const textbox = <input type="text" />;
  
  await waitFor(() => new Promise((resolve) => setTimeout(resolve, 0)));

  const button = getAllByLabelText('click to copy id')[0];
  fireEvent.click(button);
  // userEvent.paste(textbox,_,) unsure what to do here...
});

Documentation : Documentation

reactjsunit-testingtestingintegration-testingreact-testing-library
13
Noob

Une autre option serait de faire quelque chose comme

test('Pasting fires onPaste event which returns clipboard data', () => {
  const pasted = jest.fn(() => null);
  const changed = jest.fn(() => null);

  render(
    <PasteComponent paste={pasted} changeEvent={changed} data-testid='paste-input' />);

  const PhoneNumberElement = screen.queryByTestId('paste-input');

  const paste = createEvent.paste(PhoneNumberElement, {
    clipboardData: {
      getData: () => '123456',
    },
  });

  fireEvent(PhoneNumberElement, paste);

  expect(pasted).toHaveBeenCalled();
  expect(pasted).toHaveBeenCalledWith('123456');
});

J'ai écrit un post dessus - - https://medium.davidendersby.me/2-ways-to-trigger-the-onpaste-event-vith-testing-library-1502c5fdb9e

4
Davetherave2010