I'm using jest and `react-testing-library` to provide unit test coverage for my app. 

I use this handy helper function Kent C. Dodds showed in one of his videos:

```
const renderWithRedux = ui => ({
    ...render(<Provider store={store}>{ui}</Provider>),
    store,
});

```

I use when I am testing connected components.

I am running into an issue where in order to render a component I needed some data fetched to accuaratly resolve a test, or atleast inject mock data into the store. I am failing to do so

this is my test:

```
test('navbar accepts props', async () => {
    /**
     * Something I was testing
     */
    const functionToTest = () => async dispatch => {
        dispatch(fetchTickets());
    };

    functionToTest();
    const isReady = true;
    const mockData = {
        sessionInformation: {
            ticket: { label: 'Total Tickets' },
            sessionDuration: { sessionLabel: 'Session Duration', duration: 42 },
            equipment: { type: 'Desktop', operatingSystem: 'Windows' },
        },
        component: { isReady },
        tickets: {
            ticketPayload: [
                {
                    number: '1020312039',
                    shortDescription: 'Accessories',
                    status: 'Active',
                    createdOnEpoch: 1512322200000,
                },
            ],
        },
    };

    const data = renderWithRedux(<Navbar props={mockData} />);
});

```

The component I am testing:

```
const NavBar = ({
    openTickets: { label },
    sessionDuration: { sessionLabel, duration },
    tickets: { ticketPayload = [] },
    isReady,
}) => (!isReady ? (
    <Container>
        <LogoContainer>
            <Logo src={logo} alt="logo" />
            <Header>Service Desk</Header>
        </LogoContainer>

        <SessionInformation className="session">
            <NavbarInfo className="session-info">
                <p>
                    <FontAwesomeIcon icon="ticket-alt" className="ticketIcon" />
                    {label}
                </p>
                <p>{`${ticketPayload.length} tickets`}</p>
            </NavbarInfo>
            <NavbarInfo last className="session-info">
                <p>
                    <FontAwesomeIcon icon="clock" className="ticketIcon" />
                    {sessionLabel}
                </p>
                <p>{`${duration} minutes`}</p>
            </NavbarInfo>
            {hasTokens() && (
                <Button type="submit" onClick={() => console.log('notes')}>
                        Notepad
                </Button>
            )}
        </SessionInformation>
    </Container>
) : (
    <LoaderContainer>
        <RingLoader size={100} />
    </LoaderContainer>
));

```

I need to make length calculations with `ticketPayload` however the main store is taking priority. Since that information has not been fetched, `ticketPayload`'s is 0. I want to be able to atleast mock the data to be passed but haven't had any luck using props, as the store takes precedence. 

Hope anyone can beam a light of help or share some guidance. Thanks in Advance!