diff --git a/packages/client/src/login/LoginForm.test.tsx b/packages/client/src/login/LoginForm.test.tsx
index 66d3abd..0a0df32 100644
--- a/packages/client/src/login/LoginForm.test.tsx
+++ b/packages/client/src/login/LoginForm.test.tsx
@@ -15,18 +15,21 @@ describe('LoginForm', () => {
 
   const createTestProvider = () => test.withProvider({
     reducers: {Login: Feature.Login},
-    connector: new Feature.LoginConnector(loginActions),
     select: state => state.Login,
-    customJSX: (Component, props) =>
-      <MemoryRouter><Component {...props} /></MemoryRouter>,
   })
+  .withComponent(
+    select => new Feature.LoginConnector(loginActions).connect(select),
+  )
+  .withJSX((Component, props) =>
+    <MemoryRouter><Component {...props} /></MemoryRouter>,
+  )
 
   beforeAll(() => {
     (window as any).__MOCK_SERVER_SIDE__ = true
   })
 
   it('should render', () => {
-    createTestProvider().render()
+    createTestProvider().render({})
   })
 
   describe('submit', () => {
diff --git a/packages/client/src/login/RegisterForm.test.tsx b/packages/client/src/login/RegisterForm.test.tsx
index 3a9ed7c..84bd021 100644
--- a/packages/client/src/login/RegisterForm.test.tsx
+++ b/packages/client/src/login/RegisterForm.test.tsx
@@ -13,16 +13,18 @@ describe('RegisterForm', () => {
 
   const createTestProvider = () => test.withProvider({
     reducers: {Login: Feature.Login},
-    connector: new Feature.RegisterConnector(loginActions),
     select: state => state.Login,
   })
+  .withComponent(
+    select => new Feature.RegisterConnector(loginActions).connect(select),
+  )
 
   beforeAll(() => {
     (window as any).__MOCK_SERVER_SIDE__ = true
   })
 
   it('should render', () => {
-    createTestProvider().render()
+    createTestProvider().render({})
   })
 
   describe('submit', () => {
diff --git a/packages/client/src/team/TeamConnector.test.ts b/packages/client/src/team/TeamConnector.test.tsx
similarity index 56%
rename from packages/client/src/team/TeamConnector.test.ts
rename to packages/client/src/team/TeamConnector.test.tsx
index 5d7c951..30ad51b 100644
--- a/packages/client/src/team/TeamConnector.test.ts
+++ b/packages/client/src/team/TeamConnector.test.tsx
@@ -2,7 +2,8 @@ import * as Feature from './'
 // export ReactDOM from 'react-dom'
 // import T from 'react-dom/test-utils'
 import {HTTPClientMock, TestUtils/*, getError*/} from '../test-utils'
-import {IAPIDef, ITeam} from '@rondo/common'
+import {IAPIDef, ITeam, IUserInTeam} from '@rondo/common'
+import React from 'react'
 
 const test = new TestUtils()
 
@@ -13,18 +14,37 @@ describe('TeamConnector', () => {
 
   const createTestProvider = () => test.withProvider({
     reducers: {Team: Feature.Team},
-    connector: new Feature.TeamConnector(teamActions),
     select: state => state.Team,
   })
+  .withComponent(select =>
+    new Feature
+    .TeamConnector(teamActions)
+    .connect(select))
+  .withJSX((Component, props) => <Component {...props} />)
 
   const teams: ITeam[] = [{id: 100, name: 'my-team', userId: 1}]
 
+  const users: IUserInTeam[] = [{
+    teamId: 123,
+    userId: 1,
+    displayName: 'test test',
+    roleId: 1,
+    roleName: 'ADMIN',
+  }]
+
   it('it fetches user teams on render', async () => {
     http.mockAdd({
       method: 'get',
       url: '/my/teams',
     }, teams)
-    const {node} = createTestProvider().render()
+    http.mockAdd({
+      method: 'get',
+      url: '/teams/:teamId/users',
+      params: {
+        teamId: 123,
+      },
+    }, users)
+    const {node} = createTestProvider().render({editTeamId: 123})
     await http.wait()
     expect(node.innerHTML).toContain('my-team')
   })
diff --git a/packages/client/src/test-utils/TestUtils.tsx b/packages/client/src/test-utils/TestUtils.tsx
index dee4cf1..f265c7a 100644
--- a/packages/client/src/test-utils/TestUtils.tsx
+++ b/packages/client/src/test-utils/TestUtils.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
 import T from 'react-dom/test-utils'
-import {Connector, IStateSelector} from '../redux'
+import {IStateSelector} from '../redux'
 import {Provider} from 'react-redux'
 import {createStore} from '../store'
 import {
@@ -13,15 +13,16 @@ import {
   combineReducers,
 } from 'redux'
 
-interface IRenderParams<State> {
+interface IRenderParams<State, LocalState> {
   reducers: ReducersMapObject<State, any>
   state?: DeepPartial<State>
-  connector: Connector<any>
-  select: IStateSelector<State, any>
-  customJSX?: (
-    Component: React.ComponentType<any>,
-    additionalProps: Record<string, any>,
-  ) => JSX.Element
+  select: IStateSelector<State, LocalState>
+  // getComponent: (
+  //   select: IStateSelector<State, LocalState>) => React.ComponentType<Props>,
+  // customJSX?: (
+  //   Component: React.ComponentType<Props>,
+  //   props: Props,
+  // ) => JSX.Element
 }
 
 export class TestUtils {
@@ -47,29 +48,54 @@ export class TestUtils {
    * Creates a redux store, connects a component, and provides the `render`
    * method to render the connected component with a `Provider`.
    */
-  withProvider<State, A extends Action<any> = AnyAction>(
-    params: IRenderParams<State>,
+  withProvider<State, LocalState, A extends Action<any> = AnyAction>(
+    params: IRenderParams<State, LocalState>,
   ) {
+    const {reducers, state, select} = params
+
     const store = this.createStore({
-      reducer: this.combineReducers(params.reducers),
-    })(params.state)
-    const Component = params.connector.connect(params.select)
+      reducer: this.combineReducers(reducers),
+    })(state)
 
-    const render = (additionalProps: Record<string, any> = {}) => {
-      const jsx = params.customJSX
-        ? params.customJSX(Component, additionalProps)
-        : <Component {...additionalProps} />
-      return this.render(
-        <Provider store={store}>
-          {jsx}
-        </Provider>,
-      )
+    const withComponent = <Props extends {}>(
+      getComponent: (select: IStateSelector<State, LocalState>) =>
+        React.ComponentType<Props>,
+    ) => {
+      const Component = getComponent(select)
+
+      type CreateJSX = (
+        Component: React.ComponentType<Props>,
+        props: Props,
+      ) => JSX.Element
+
+      let createJSX: CreateJSX | undefined
+
+      const render = (props: Props) => {
+        const jsx = createJSX
+          ? createJSX(Component, props)
+          : <Component {...props} />
+        return this.render(
+          <Provider store={store}>
+            {jsx}
+          </Provider>,
+        )
+      }
+
+      const withJSX = (localCreateJSX: CreateJSX) => {
+        createJSX = localCreateJSX
+        return self
+      }
+
+      const self = {
+        render,
+        store,
+        Component,
+        withJSX,
+      }
+
+      return self
     }
 
-    return {
-      render,
-      store,
-      Component,
-    }
+    return {withComponent}
   }
 }