Issue

The issue here is that your component is still having props from redux injected into it by the connect Higher Order Component. (You removed mapStateToProps and mapDispatchToProps but you've still "defined" them inline in connect) The injected onLoginPressed is overwriting your manually passed jest mock function.

Solution

IMO the easy solution, since you are still using the connect decorator, is to export the undecorated/unconnected Login component so you can pass the props that would normally be provided by redux.

export Login = ({ onFormSubmitFailed, onLoginPressed, history }) => {...

Test

import { Login } from './path/to/Login'; // <-- named import

...

test.only("Login On Submit", () => {
    const onLoginPressed = jest.fn();
    const { getByTestId } = render(Login onLoginPressed={onLoginPressed} />);

    fireEvent.change(screen.getByTestId(/UsernameInput/i), {
        target: { value: 'admin' }
    });
    fireEvent.change(screen.getByTestId(/PasswordInput/i), {
        target: { value: 'admin' }
    });
    fireEvent.click(screen.getByTestId("submitButton"));

    expect(onLoginPressed).toHaveBeenCalled();

});

Solution #2

Mock your store using redux-mock-store and assert the correct action(s) was/were dispatched. Here the mock store simply stores an array of dispatched actions to test against.

test.only("Login On Submit", () => {
    const store = mockStore({});
    const { getByTestId } = render(
        <Provider store={store}>
            <Login onLoginPressed={onLoginPressed} />
        </Provider>
    );

    fireEvent.change(screen.getByTestId(/UsernameInput/i), {
        target: { value: 'admin' }
    });
    fireEvent.change(screen.getByTestId(/PasswordInput/i), {
        target: { value: 'admin' }
    });
    fireEvent.click(screen.getByTestId("submitButton"));

    const actions = store.getActions();
    expect(actions).toEqual([{ type: 'LOGIN' }]); // <-- your action type here!
});

I think there's a few key issues with the overall approach to testing that we should address:

1. How do we test Redux connected components?
2. How do we test behavior?

Test Connected Components by hijacking render()

Our team has a testUtils wrapper that hijacks the react-testing-library render() method and wraps components with a Redux Provider. You can find it on the Redux docs.

// test-utils.js
import React from 'react'
import { render as rtlRender } from '@testing-library/react'
import { createStore } from 'redux'
import { Provider } from 'react-redux'
// Import your own reducer
import reducer from '../reducer'

function render(
  ui,
  {
    initialState,
    store = createStore(reducer, initialState),
    ...renderOptions
  } = {}
) {
  function Wrapper({ children }) {
    return <Provider store={store}>{children}</Provider>
  }
  return rtlRender(ui, { wrapper: Wrapper, ...renderOptions })
}

// re-export everything
export * from '@testing-library/react'
// override render method
export { render }

What's cool about this solution is you get your Redux store and you can initialize state the way you need.

Test behavior, not implementation details

For the next issue, I wouldn't test the mock/implementation. Does your form submit to a backend? Does it show a success message? You could use that to determine the test assertions. Below I used your test with the wrapped render() method and look for a flash message that signifies successful login.

test.only("<Login/>", async () => {
   // You can stub the server response with nock or msw
    nock(`${yoursite}`)
      .post('/someApiEndpoint')
      .reply(200);
    
    const { getByTestId } = render(
      <Login />
    );

    fireEvent.change(screen.getByTestId(/UsernameInput/i), {
        target: { value: 'admin' }
    });
    fireEvent.change(screen.getByTestId(/PasswordInput/i), {
        target: { value: 'admin' }
    });
    fireEvent.click(screen.getByTestId("submitButton"));
    
    await waitFor(() => expect(getById('login-success')).toBeTruthy()); // <-- This is missing
});

What, as a user, would signify a successful login?