@equinor/fusion-framework-vitest-plugin-react-app 0.2.0-next.0

package/src/scope/resolve-fusion.ts

@@ -0,0 +1,29 @@
+import type { AppEnv } from '@equinor/fusion-framework-app';
+import type { Fusion } from '@equinor/fusion-framework';
+import { mockFramework } from '@equinor/fusion-framework/mock';
+import { enableAppManifestMock } from '@equinor/fusion-framework-app/mock';
+import type { AppModule } from '@equinor/fusion-framework-module-app';
+
+import { defaultAppEnv } from './default-app-env';
+
+/**
+ * Resolves the parent Fusion instance backing an application module scope, building a
+ * fresh {@link mockFramework} instance with this app's own manifest served when none is
+ * given.
+ *
+ * @template TEnv - The application environment descriptor.
+ * @param env - The application environment; defaults to {@link defaultAppEnv}.
+ * @param fusion - An already-built parent Fusion instance to reuse instead.
+ * @returns The given `fusion`, or a fresh mocked parent Fusion instance.
+ */
+export async function resolveFusion<TEnv extends AppEnv = AppEnv>(
+  env?: TEnv,
+  fusion?: Fusion,
+): Promise<Fusion> {
+  return (
+    fusion ??
+    mockFramework<[AppModule]>((configurator) =>
+      enableAppManifestMock(configurator, env ?? (defaultAppEnv as TEnv)),
+    )
+  );
+}

package/src/test-app.tsx

@@ -0,0 +1,72 @@
+import type { ReactElement } from 'react';
+import { test as baseTest } from 'vitest';
+import { render, renderHook } from 'vitest-browser-react';
+import type { RenderOptions, RenderHookOptions } from 'vitest-browser-react';
+
+import { mockAppModules } from '@equinor/fusion-framework-app/mock';
+import type { AppMockConfigureFn } from '@equinor/fusion-framework-app/mock';
+import type { AppEnv } from '@equinor/fusion-framework-app';
+
+import { defaultAppEnv, resolveFusion, createAppScopeWrapper } from './scope';
+
+/**
+ * `vitest`'s `test`, extended with an application module scope fixture.
+ *
+ * @remarks
+ * An alternative to {@link renderAppComponent}/{@link renderAppHook} for a test file whose
+ * cases share seeded fixture defaults: `env`/`configure` become suite-level concerns,
+ * overridden once per file (or per `describe` block) with `testApp.extend(...)`, rather than
+ * an options object repeated on every call. `fusion`/`app` are still instantiated fresh per
+ * test — only the seeded defaults are shared, not state between tests. They also resolve
+ * lazily: a test that only destructures `app` never pays for rendering anything, and one
+ * that only destructures `render`/`renderHook` gets the same fixture wiring automatically.
+ *
+ * Both entry points stay supported: reach for `renderAppComponent`/`renderAppHook` for a
+ * one-off test whose configuration is not shared by the rest of the file; reach for
+ * `testApp` when several cases in a file share one set of seeded fixture defaults.
+ *
+ * @example
+ * ```tsx
+ * testApp('resolves current context', async ({ app, render }) => {
+ *   const screen = await render(<App />);
+ *   expect(app.context).toBeDefined();
+ * });
+ * ```
+ *
+ * @example Seed a module for every test in a suite
+ * ```tsx
+ * describe('with a seeded context module', () => {
+ *   const test = testApp.extend('configure', { injected: true }, () =>
+ *     (configurator) => enableContextMock(configurator, (mock) => mock.setCurrentContext(projectA)),
+ *   );
+ *
+ *   test('starts on the seeded context', async ({ render }) => {
+ *     const screen = await render(<App />);
+ *     await expect.element(screen.getByText(projectA.title)).toBeVisible();
+ *   });
+ * });
+ * ```
+ */
+export const testApp = baseTest
+  .extend('env', { injected: true }, defaultAppEnv)
+  // `test.extend`'s plain-`value` overload rejects function types (ambiguous with the
+  // resolver-`fn` overload), so a function-typed fixture default must go through `fn` instead.
+  .extend('configure', { injected: true }, () => undefined as AppMockConfigureFn | undefined)
+  .extend('fusion', async ({ env }) => resolveFusion(env))
+  .extend('app', async ({ configure, env, fusion }) =>
+    mockAppModules<unknown, AppEnv>(configure, env as AppEnv, fusion),
+  )
+  .extend('render', ({ fusion, app }) => {
+    const wrapper = createAppScopeWrapper({ framework: fusion, app });
+    return (ui: ReactElement, options?: Omit<RenderOptions, 'wrapper'>) =>
+      render(ui, { ...options, wrapper });
+  })
+  .extend('renderHook', ({ fusion, app }) => {
+    const wrapper = createAppScopeWrapper({ framework: fusion, app });
+    return <Result, Props = undefined>(
+      cb: (initialProps?: Props) => Result,
+      options?: Omit<RenderHookOptions<Props>, 'wrapper'>,
+    ) => renderHook(cb, { ...options, wrapper });
+  });
+
+export default testApp;

package/src/test.tsx

@@ -0,0 +1,35 @@
+import { testApp as baseTestApp } from './test-app';
+
+// resolved at test-time by `appTestVitePlugin` (@equinor/fusion-framework-vitest-plugin-react-app);
+// see virtual-modules.d.ts for the ambient module declarations
+import { manifest, config } from 'virtual:fusion-app-test-env';
+import { configure } from 'virtual:fusion-app-test-configure';
+
+/**
+ * `vitest`'s `test`, pre-seeded with the application's own manifest, config, and
+ * module-configurator, resolved the same way `ffc app build`/`ffc app dev` resolve them.
+ *
+ * @remarks
+ * Requires `appTestVitePlugin` (`@equinor/fusion-framework-vitest-plugin-react-app`) registered in
+ * your `vitest.config.ts` `plugins`, which serves the virtual modules backing this fixture.
+ * Running the same test file without the plugin registered fails to resolve those imports.
+ *
+ * Per-test mocking still works exactly like the base `testApp`: `.extend('configure', ...)` or
+ * a per-case `test.override('env', ...)` layers on top of the resolved values.
+ *
+ * @example
+ * ```tsx
+ * import { test } from '@equinor/fusion-framework-vitest-plugin-react-app/test';
+ * import { App } from '../App';
+ *
+ * test('renders the app', async ({ render }) => {
+ *   const screen = await render(<App />);
+ *   await expect.element(screen.getByRole('heading')).toBeVisible();
+ * });
+ * ```
+ */
+export const test = baseTestApp
+  .extend('env', { injected: true }, { manifest, config })
+  .extend('configure', { injected: true }, () => configure);
+
+export default test;

package/src/version.ts

@@ -0,0 +1,2 @@
+// Generated by genversion.
+export const version = '0.2.0-next.0';

package/src/virtual-modules.d.ts

@@ -0,0 +1,12 @@
+declare module 'virtual:fusion-app-test-env' {
+  import type { AppEnv } from '@equinor/fusion-framework-app';
+
+  export const manifest: AppEnv['manifest'];
+  export const config: AppEnv['config'];
+}
+
+declare module 'virtual:fusion-app-test-configure' {
+  import type { AppMockConfigureFn } from '@equinor/fusion-framework-app/mock';
+
+  export const configure: AppMockConfigureFn | undefined;
+}

package/tsconfig.json

@@ -0,0 +1,24 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "outDir": "dist/esm",
+    "rootDir": "src",
+    "declarationDir": "./dist/types",
+    "paths": {
+      "*": ["./*"]
+    }
+  },
+  "references": [
+    { "path": "../../cli" },
+    { "path": "../../framework" },
+    { "path": "../../app" },
+    { "path": "../../modules/module" },
+    { "path": "../../modules/app" },
+    { "path": "../../react/framework" },
+    { "path": "../../react/modules/module" },
+    { "path": "../../utils/imports" }
+  ],
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist", "src/__tests__/**/*"]
+}

package/vitest.config.ts

@@ -0,0 +1,10 @@
+import { defineProject } from 'vitest/config';
+
+import { name, version } from './package.json' with { type: 'json' };
+
+export default defineProject({
+  test: {
+    include: ['src/__tests__/**/*.test.ts'],
+    name: `${name}@${version}`,
+  },
+});