How to use @commercetools-frontend/application-shell - 3 common examples

it('the user can click on the link to "one" and the page should show a text with "View one"', async () => {
    const initialRoute = '/my-project/examples-starter';
    const { getByText, history } = renderApp(, {
      permissions: { canViewProducts: true, canManageProducts: true },
      route: initialRoute,
    });
    await waitForElement(() => getByText(/Hello, world/i));

    fireEvent.click(getByText(/Page one/i));

    await waitForElement(() => getByText(/View one/i));

    expect(history.location).toEqual(
      expect.objectContaining({
        pathname: `${initialRoute}/one`,
      })
    );
  });
});

it('the user can click on the state machines to get to the details page', async () => {
    rendered = renderApp({
      sdkMocks: [
        createStateMachinesListSdkMock(),
        createStateMachinesDetailSdkMockForId1(),
      ],
      permissions: {
        canViewDeveloperSettings: true,
        canManageDeveloperSettings: true,
      },
    });
    await waitForElement(() =>
      rendered.getByText(/There are 2 objects in the cache/i)
    );
    fireEvent.click(rendered.getByText('sm-1'));
    await wait(() => {
      expect(rendered.history.location.pathname).toBe(
        '/my-project/state-machines/sm1'
      );
    });
    await waitForElement(() => rendered.getByText(/sm-1/i));
  });
});

const renderApp = (options = {}) => {
  const route = options.route || '/my-project/state-machines';
  return renderAppWithRedux(, {
    route,
    ...options,
  });
};