@quilted/create 0.3.2 → 0.3.4

package/templates/app-trpc/tests/render/render.tsx

@@ -1,15 +1,12 @@
 import {createRender} from '@quilted/quilt/testing';
-import {
-  BrowserDetailsContext,
-  BrowserTestMock,
-} from '@quilted/quilt/browser/testing';
-import {Navigation, TestRouter} from '@quilted/quilt/navigation/testing';
+import {TestBrowser} from '@quilted/quilt/browser/testing';
+import {TestNavigation} from '@quilted/quilt/navigation/testing';
 import {Localization} from '@quilted/quilt/localize';
+import {QuiltFrameworkTestContext} from '@quilted/quilt/context/testing';
 
 import {QueryClient, QueryClientProvider} from '@tanstack/react-query';
 
 import {trpc} from '~/context/trpc.ts';
-import {AppContextPreact} from '~/context/preact.ts';
 
 import {RenderOptions, RenderContext, RenderActions} from './types.ts';
 
@@ -26,37 +23,36 @@ export const renderApp = createRender<
   // Create context that can be used by the `render` function, and referenced by test
   // authors on the `root.context` property. Context is used to share data between your
   // React tree and your test code, and is ideal for mocking out global context providers.
-  context({router = new TestRouter(), browser = new BrowserTestMock()}) {
+  context({
+    navigation = new TestNavigation(),
+    browser = new TestBrowser(),
+    localization = new Localization('en'),
+  }) {
     return {
-      navigation: {router},
+      navigation,
       browser,
+      localization,
       trpc: trpc.createClient(),
       queryClient: new QueryClient(),
     };
   },
   // Render all of our app-wide context providers around each component under test.
-  render(element, context, {locale = 'en'}) {
-    const {
-      navigation: {router},
-      browser,
-      trpc: trpcClient,
-      queryClient,
-    } = context;
-
+  render(
+    element,
+    {navigation, browser, localization, trpc: trpcClient, queryClient},
+  ) {
     return (
-      <AppContextPreact.Provider value={context}>
-        <BrowserDetailsContext.Provider value={browser}>
-          <Localization locale={locale}>
-            <Navigation router={router}>
-              <trpc.Provider client={trpcClient} queryClient={queryClient}>
-                <QueryClientProvider client={queryClient}>
-                  {element}
-                </QueryClientProvider>
-              </trpc.Provider>
-            </Navigation>
-          </Localization>
-        </BrowserDetailsContext.Provider>
-      </AppContextPreact.Provider>
+      <QuiltFrameworkTestContext
+        navigation={navigation}
+        browser={browser}
+        localization={localization}
+      >
+        <trpc.Provider client={trpcClient} queryClient={queryClient}>
+          <QueryClientProvider client={queryClient}>
+            {element}
+          </QueryClientProvider>
+        </trpc.Provider>
+      </QuiltFrameworkTestContext>
     );
   },
   async afterRender() {

package/templates/app-trpc/tests/render/types.ts

@@ -1,39 +1,40 @@
-import type {TestRouter} from '@quilted/quilt/navigation/testing';
-import type {BrowserTestMock} from '@quilted/quilt/browser/testing';
+import type {TestNavigation} from '@quilted/quilt/navigation/testing';
+import type {TestBrowser} from '@quilted/quilt/browser/testing';
+import type {Localization} from '@quilted/quilt/localize';
 import type {QueryClient} from '@tanstack/react-query';
 
-import type {AppContext} from '~/context/types.ts';
-
 export interface RenderOptions {
   /**
-   * A custom router to use for this component test. You can use a
-   * custom router to simulate a particular URL, and you can spy on
-   * its navigation method to check that components navigate as
-   * you expect.
+   * A custom navigation to use for this component test.
    */
-  readonly router?: TestRouter;
+  readonly navigation?: TestNavigation;
 
   /**
    * A custom environment for this component test.
    */
-  readonly browser?: BrowserTestMock;
+  readonly browser?: TestBrowser;
 
   /**
-   * A custom locale to use for this component test.
+   * A custom localization instance to use for this component test.
    */
-  readonly locale?: string;
+  readonly localization?: Localization;
 }
 
-export interface RenderContext extends AppContext {
+export interface RenderContext {
   /**
-   * The router used for this component test.
+   * The navigation used for this component test.
    */
-  readonly navigation: {router: TestRouter};
+  readonly navigation: TestNavigation;
 
   /**
    * The browser environment for this component test.
    */
-  readonly browser: BrowserTestMock;
+  readonly browser: TestBrowser;
+
+  /**
+   * The localization used for this component test.
+   */
+  readonly localization: Localization;
 
   /**
    * The react-query client used for this component test.

package/templates/app-trpc/tests/render.ts

@@ -1,6 +1,6 @@
 import '@quilted/quilt/testing';
 
-export {TestRouter} from '@quilted/quilt/navigation/testing';
+export {TestNavigation} from '@quilted/quilt/navigation/testing';
 
 export * from './render/types.ts';
 export {renderApp} from './render/render.tsx';