Error: Not implemented: HTMLFormElement.prototype.submit | React Testing Library | Jest

Viewed 18

Can't seem to get rid of this error from the test. We must write the form like this as the 3rd party site requires it. Tried adding onSubmit and mocking that, but same issue.

Form

<form action={makePayment} method="post" name="make-payment-button-form">
      <input type="hidden" name="businessId" value={businessPartnerId} />
      <input type="hidden" name="cardBlocking" value="false" />
      <input type="hidden" name="mimoHash" value="step3" />
      <input type="hidden" name="mimoType" value="start/transfer" />
      <input type="hidden" name="orgBp" value="" />
      <input type="hidden" name="premisesId" value={businessPartnerId} />
      <input type="hidden" name="redirectUrl" value={mimoHome} />
      <Button
        className={makePaymentButtonClassName}
        htmlId="make-payment-button"
        message={messages.text}
        onClick={(): void => googleTagManager.trackButtonClick(tagGroup, tag)}
      />
    </form>

Test

it('should render a button and fire gtm tags once clicked', (): void => {
    mockGoogleTagManager.trackButtonClick.mockImplementation(mockTrackButtonClick);
    renderDomWithIntl(<PastDueDepositPage />);

    const button = screen.getByRole('button', { name: 'Make a Payment' });

    expect(button).toBeVisible();

    userEvent.click(button);

    expect(mockTrackButtonClick).toHaveBeenCalledWith('start pid', 'past due deposit payment button');
  });

Error Message

  console.error
    Error: Not implemented: HTMLFormElement.prototype.submit
        at module.exports (C:\Users\smillion\Desktop\mimo-web\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\browser\not-implemented.js:9:17)
        at HTMLFormElementImpl.submit (C:\Users\smillion\Desktop\mimo-web\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\nodes\HTMLFormElement-impl.js:88:5)
        at HTMLFormElementImpl._doSubmit (C:\Users\smillion\Desktop\mimo-web\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\nodes\HTMLFormElement-impl.js:80:10)
        at HTMLButtonElementImpl._activationBehavior (C:\Users\smillion\Desktop\mimo-web\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\nodes\HTMLButtonElement-impl.js:23:14)
        at HTMLButtonElementImpl._dispatch (C:\Users\smillion\Desktop\mimo-web\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\events\EventTarget-impl.js:240:26)
        at HTMLButtonElementImpl.dispatchEvent (C:\Users\smillion\Desktop\mimo-web\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\events\EventTarget-impl.js:94:17)
        at HTMLButtonElement.dispatchEvent (C:\Users\smillion\Desktop\mimo-web\node_modules\jest-environment-jsdom\node_modules\jsdom\lib\jsdom\living\generated\EventTarget.js:231:34)
        at C:\Users\smillion\Desktop\mimo-web\node_modules\@testing-library\dom\dist\events.js:25:20
        at C:\Users\smillion\Desktop\mimo-web\node_modules\@testing-library\react\dist\pure.js:66:16
        at batchedUpdates$1 (C:\Users\smillion\Desktop\mimo-web\node_modules\react-dom\cjs\react-dom.development.js:21856:12) undefined
0 Answers
Related