npm - @nx/remix - Versions diffs - 16.8.2 → 17.2.5 - Mend

@nx/remix 16.8.2 → 17.2.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (173) hide show

package/src/generators/application/__snapshots__/application.impl.spec.ts.snap CHANGED Viewed

@@ -1,21 +1,21 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Remix Application Integrated Repo --directory should create the application correctly 1`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --directory should create the application correctly 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
 `;
-exports[`Remix Application Integrated Repo --directory should create the application correctly 2`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --directory should create the application correctly 2`] = `
 "import type { MetaFunction } from '@remix-run/node';
 import {
   Links,
@@ -26,15 +26,17 @@ import {
   ScrollRestoration,
 } from '@remix-run/react';
-export const meta: MetaFunction = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
-});
+export const meta: MetaFunction = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
 export default function App() {
   return (
-    <html lang=\\"en\\">
+    <html lang="en">
       <head>
         <Meta />
         <Links />
@@ -51,7 +53,7 @@ export default function App() {
 "
 `;
-exports[`Remix Application Integrated Repo --directory should create the application correctly 3`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --directory should create the application correctly 3`] = `
 "export default function Index() {
   return (
     <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
@@ -59,24 +61,24 @@ exports[`Remix Application Integrated Repo --directory should create the applica
       <ul>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/blog\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
           >
             15m Quickstart Blog Tutorial
           </a>
         </li>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/jokes\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
           >
             Deep Dive Jokes App Tutorial
           </a>
         </li>
         <li>
-          <a target=\\"_blank\\" href=\\"https://remix.run/docs\\" rel=\\"noreferrer\\">
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
             Remix Docs
           </a>
         </li>
@@ -87,22 +89,22 @@ exports[`Remix Application Integrated Repo --directory should create the applica
 "
 `;
-exports[`Remix Application Integrated Repo --directory should extract the layout directory from the directory options if it exists 1`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --directory should extract the layout directory from the directory options if it exists 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
 `;
-exports[`Remix Application Integrated Repo --directory should extract the layout directory from the directory options if it exists 2`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --directory should extract the layout directory from the directory options if it exists 2`] = `
 "import type { MetaFunction } from '@remix-run/node';
 import {
   Links,
@@ -113,15 +115,17 @@ import {
   ScrollRestoration,
 } from '@remix-run/react';
-export const meta: MetaFunction = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
-});
+export const meta: MetaFunction = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
 export default function App() {
   return (
-    <html lang=\\"en\\">
+    <html lang="en">
       <head>
         <Meta />
         <Links />
@@ -138,7 +142,7 @@ export default function App() {
 "
 `;
-exports[`Remix Application Integrated Repo --directory should extract the layout directory from the directory options if it exists 3`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --directory should extract the layout directory from the directory options if it exists 3`] = `
 "export default function Index() {
   return (
     <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
@@ -146,24 +150,24 @@ exports[`Remix Application Integrated Repo --directory should extract the layout
       <ul>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/blog\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
           >
             15m Quickstart Blog Tutorial
           </a>
         </li>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/jokes\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
           >
             Deep Dive Jokes App Tutorial
           </a>
         </li>
         <li>
-          <a target=\\"_blank\\" href=\\"https://remix.run/docs\\" rel=\\"noreferrer\\">
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
             Remix Docs
           </a>
         </li>
@@ -174,22 +178,36 @@ exports[`Remix Application Integrated Repo --directory should extract the layout
 "
 `;
-exports[`Remix Application Integrated Repo --js should create the application correctly 1`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --e2eTestRunner should generate an e2e application for the app 1`] = `
+"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
+import { defineConfig } from 'cypress';
+export default defineConfig({
+  e2e: {
+    ...nxE2EPreset(__filename, { cypressDir: 'src' }),
+    baseUrl: 'http://localhost:4200',
+  },
+});
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --js should create the application correctly 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
 `;
-exports[`Remix Application Integrated Repo --js should create the application correctly 2`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --js should create the application correctly 2`] = `
 "import {
   Links,
   LiveReload,
@@ -198,14 +216,289 @@ exports[`Remix Application Integrated Repo --js should create the application co
   Scripts,
   ScrollRestoration,
 } from '@remix-run/react';
-export const meta = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
+export const meta = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
+export default function App() {
+  return (
+    <html lang="en">
+      <head>
+        <Meta />
+        <Links />
+      </head>
+      <body>
+        <Outlet />
+        <ScrollRestoration />
+        <Scripts />
+        <LiveReload />
+      </body>
+    </html>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --js should create the application correctly 3`] = `
+"export default function Index() {
+  return (
+    <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
+      <h1>Welcome to Remix</h1>
+      <ul>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
+          >
+            15m Quickstart Blog Tutorial
+          </a>
+        </li>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
+          >
+            Deep Dive Jokes App Tutorial
+          </a>
+        </li>
+        <li>
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
+            Remix Docs
+          </a>
+        </li>
+      </ul>
+    </div>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --unitTestRunner should generate the correct files for testing using jest 1`] = `
+"/**
+ * @type {import('@remix-run/dev').AppConfig}
+ */
+module.exports = {
+  ignoredRouteFiles: ['**/.*'],
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
+  watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
+};
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --unitTestRunner should generate the correct files for testing using jest 2`] = `
+"/* eslint-disable */
+export default {
+  setupFilesAfterEnv: ['<rootDir>/test-setup.ts'],
+  displayName: 'test',
+  preset: '../jest.preset.cjs',
+  transform: {
+    '^.+\\\\.[tj]sx?$': ['ts-jest', { tsconfig: '<rootDir>/tsconfig.spec.json' }],
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  coverageDirectory: '../coverage/test',
+};
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --unitTestRunner should generate the correct files for testing using jest 3`] = `
+"import { installGlobals } from '@remix-run/node';
+import '@testing-library/jest-dom/matchers';
+installGlobals();
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --unitTestRunner should generate the correct files for testing using vitest 1`] = `
+"/**
+ * @type {import('@remix-run/dev').AppConfig}
+ */
+module.exports = {
+  ignoredRouteFiles: ['**/.*'],
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
+  watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
+};
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --unitTestRunner should generate the correct files for testing using vitest 2`] = `
+"/// <reference types='vitest' />
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+export default defineConfig({
+  root: __dirname,
+  cacheDir: '../node_modules/.vite/test',
+  plugins: [react(), nxViteTsPaths()],
+  // Uncomment this if you are using workers.
+  // worker: {
+  //  plugins: [ nxViteTsPaths() ],
+  // },
+  test: {
+    setupFiles: ['test-setup.ts'],
+    globals: true,
+    cache: {
+      dir: '../node_modules/.vitest',
+    },
+    environment: 'jsdom',
+    include: ['./tests/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+    reporters: ['default'],
+    coverage: {
+      reportsDirectory: '../coverage/test',
+      provider: 'v8',
+    },
+  },
 });
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --unitTestRunner should generate the correct files for testing using vitest 3`] = `
+"import { installGlobals } from '@remix-run/node';
+import '@testing-library/jest-dom/matchers';
+installGlobals();
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided should create the application correctly 1`] = `
+"/**
+ * @type {import('@remix-run/dev').AppConfig}
+ */
+module.exports = {
+  ignoredRouteFiles: ['**/.*'],
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
+  watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
+};
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided should create the application correctly 2`] = `
+"import type { MetaFunction } from '@remix-run/node';
+import {
+  Links,
+  LiveReload,
+  Meta,
+  Outlet,
+  Scripts,
+  ScrollRestoration,
+} from '@remix-run/react';
+export const meta: MetaFunction = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
+export default function App() {
+  return (
+    <html lang="en">
+      <head>
+        <Meta />
+        <Links />
+      </head>
+      <body>
+        <Outlet />
+        <ScrollRestoration />
+        <Scripts />
+        <LiveReload />
+      </body>
+    </html>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided should create the application correctly 3`] = `
+"export default function Index() {
+  return (
+    <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
+      <h1>Welcome to Remix</h1>
+      <ul>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
+          >
+            15m Quickstart Blog Tutorial
+          </a>
+        </li>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
+          >
+            Deep Dive Jokes App Tutorial
+          </a>
+        </li>
+        <li>
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
+            Remix Docs
+          </a>
+        </li>
+      </ul>
+    </div>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --directory should create the application correctly 1`] = `
+"/**
+ * @type {import('@remix-run/dev').AppConfig}
+ */
+module.exports = {
+  ignoredRouteFiles: ['**/.*'],
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
+  watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
+};
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --directory should create the application correctly 2`] = `
+"import type { MetaFunction } from '@remix-run/node';
+import {
+  Links,
+  LiveReload,
+  Meta,
+  Outlet,
+  Scripts,
+  ScrollRestoration,
+} from '@remix-run/react';
+export const meta: MetaFunction = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
 export default function App() {
   return (
-    <html lang=\\"en\\">
+    <html lang="en">
       <head>
         <Meta />
         <Links />
@@ -222,7 +515,7 @@ export default function App() {
 "
 `;
-exports[`Remix Application Integrated Repo --js should create the application correctly 3`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --directory should create the application correctly 3`] = `
 "export default function Index() {
   return (
     <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
@@ -230,24 +523,24 @@ exports[`Remix Application Integrated Repo --js should create the application co
       <ul>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/blog\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
           >
             15m Quickstart Blog Tutorial
           </a>
         </li>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/jokes\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
           >
             Deep Dive Jokes App Tutorial
           </a>
         </li>
         <li>
-          <a target=\\"_blank\\" href=\\"https://remix.run/docs\\" rel=\\"noreferrer\\">
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
             Remix Docs
           </a>
         </li>
@@ -258,29 +551,218 @@ exports[`Remix Application Integrated Repo --js should create the application co
 "
 `;
-exports[`Remix Application Integrated Repo --unitTestRunner should generate the correct files for testing using jest 1`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --directory should extract the layout directory from the directory options if it exists 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
 `;
-exports[`Remix Application Integrated Repo --unitTestRunner should generate the correct files for testing using jest 2`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --directory should extract the layout directory from the directory options if it exists 2`] = `
+"import type { MetaFunction } from '@remix-run/node';
+import {
+  Links,
+  LiveReload,
+  Meta,
+  Outlet,
+  Scripts,
+  ScrollRestoration,
+} from '@remix-run/react';
+export const meta: MetaFunction = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
+export default function App() {
+  return (
+    <html lang="en">
+      <head>
+        <Meta />
+        <Links />
+      </head>
+      <body>
+        <Outlet />
+        <ScrollRestoration />
+        <Scripts />
+        <LiveReload />
+      </body>
+    </html>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --directory should extract the layout directory from the directory options if it exists 3`] = `
+"export default function Index() {
+  return (
+    <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
+      <h1>Welcome to Remix</h1>
+      <ul>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
+          >
+            15m Quickstart Blog Tutorial
+          </a>
+        </li>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
+          >
+            Deep Dive Jokes App Tutorial
+          </a>
+        </li>
+        <li>
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
+            Remix Docs
+          </a>
+        </li>
+      </ul>
+    </div>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --e2eTestRunner should generate an e2e application for the app 1`] = `
+"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
+import { defineConfig } from 'cypress';
+export default defineConfig({
+  e2e: {
+    ...nxE2EPreset(__filename, { cypressDir: 'src' }),
+    baseUrl: 'http://localhost:4200',
+  },
+});
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --js should create the application correctly 1`] = `
+"/**
+ * @type {import('@remix-run/dev').AppConfig}
+ */
+module.exports = {
+  ignoredRouteFiles: ['**/.*'],
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
+  watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
+};
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --js should create the application correctly 2`] = `
+"import {
+  Links,
+  LiveReload,
+  Meta,
+  Outlet,
+  Scripts,
+  ScrollRestoration,
+} from '@remix-run/react';
+export const meta = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
+export default function App() {
+  return (
+    <html lang="en">
+      <head>
+        <Meta />
+        <Links />
+      </head>
+      <body>
+        <Outlet />
+        <ScrollRestoration />
+        <Scripts />
+        <LiveReload />
+      </body>
+    </html>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --js should create the application correctly 3`] = `
+"export default function Index() {
+  return (
+    <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
+      <h1>Welcome to Remix</h1>
+      <ul>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
+          >
+            15m Quickstart Blog Tutorial
+          </a>
+        </li>
+        <li>
+          <a
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
+          >
+            Deep Dive Jokes App Tutorial
+          </a>
+        </li>
+        <li>
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
+            Remix Docs
+          </a>
+        </li>
+      </ul>
+    </div>
+  );
+}
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --unitTestRunner should generate the correct files for testing using jest 1`] = `
+"/**
+ * @type {import('@remix-run/dev').AppConfig}
+ */
+module.exports = {
+  ignoredRouteFiles: ['**/.*'],
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
+  watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
+};
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --unitTestRunner should generate the correct files for testing using jest 2`] = `
 "/* eslint-disable */
 export default {
   setupFilesAfterEnv: ['<rootDir>/test-setup.ts'],
   displayName: 'test',
-  preset: '../../jest.preset.js',
+  preset: '../../jest.preset.cjs',
   transform: {
-    '^.+\\\\\\\\.[tj]sx?$': ['ts-jest', { tsconfig: '<rootDir>/tsconfig.spec.json' }],
+    '^.+\\\\.[tj]sx?$': ['ts-jest', { tsconfig: '<rootDir>/tsconfig.spec.json' }],
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
   coverageDirectory: '../../coverage/apps/test',
@@ -288,29 +770,37 @@ export default {
 "
 `;
-exports[`Remix Application Integrated Repo --unitTestRunner should generate the correct files for testing using vitest 1`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --unitTestRunner should generate the correct files for testing using jest 3`] = `
+"import { installGlobals } from '@remix-run/node';
+import '@testing-library/jest-dom/matchers';
+installGlobals();
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --unitTestRunner should generate the correct files for testing using vitest 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
 `;
-exports[`Remix Application Integrated Repo --unitTestRunner should generate the correct files for testing using vitest 2`] = `
-"/// <reference types=\\"vitest\\" />
-import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
-import react from '@vitejs/plugin-react';
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --unitTestRunner should generate the correct files for testing using vitest 2`] = `
+"/// <reference types='vitest' />
 import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 export default defineConfig({
-  cacheDir: '../../node_modules/.vite/test',
+  root: __dirname,
+  cacheDir: '../../node_modules/.vite/apps/test',
   plugins: [react(), nxViteTsPaths()],
@@ -320,34 +810,47 @@ export default defineConfig({
   // },
   test: {
-    setupFiles: ['./test-setup.ts'],
+    setupFiles: ['test-setup.ts'],
     globals: true,
     cache: {
       dir: '../../node_modules/.vitest',
     },
     environment: 'jsdom',
-    include: ['./app/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+    include: ['./tests/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+    reporters: ['default'],
+    coverage: {
+      reportsDirectory: '../../coverage/apps/test',
+      provider: 'v8',
+    },
   },
 });
 "
 `;
-exports[`Remix Application Integrated Repo should create the application correctly 1`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --unitTestRunner should generate the correct files for testing using vitest 3`] = `
+"import { installGlobals } from '@remix-run/node';
+import '@testing-library/jest-dom/matchers';
+installGlobals();
+"
+`;
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived should create the application correctly 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
 `;
-exports[`Remix Application Integrated Repo should create the application correctly 2`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived should create the application correctly 2`] = `
 "import type { MetaFunction } from '@remix-run/node';
 import {
   Links,
@@ -358,15 +861,17 @@ import {
   ScrollRestoration,
 } from '@remix-run/react';
-export const meta: MetaFunction = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
-});
+export const meta: MetaFunction = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
 export default function App() {
   return (
-    <html lang=\\"en\\">
+    <html lang="en">
       <head>
         <Meta />
         <Links />
@@ -383,7 +888,7 @@ export default function App() {
 "
 `;
-exports[`Remix Application Integrated Repo should create the application correctly 3`] = `
+exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived should create the application correctly 3`] = `
 "export default function Index() {
   return (
     <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
@@ -391,24 +896,24 @@ exports[`Remix Application Integrated Repo should create the application correct
       <ul>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/blog\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
           >
             15m Quickstart Blog Tutorial
           </a>
         </li>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/jokes\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
           >
             Deep Dive Jokes App Tutorial
           </a>
         </li>
         <li>
-          <a target=\\"_blank\\" href=\\"https://remix.run/docs\\" rel=\\"noreferrer\\">
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
             Remix Docs
           </a>
         </li>
@@ -419,16 +924,30 @@ exports[`Remix Application Integrated Repo should create the application correct
 "
 `;
+exports[`Remix Application Standalone Project Repo --e2eTestRunner should generate an e2e application for the app 1`] = `
+"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
+import { defineConfig } from 'cypress';
+export default defineConfig({
+  e2e: {
+    ...nxE2EPreset(__filename, { cypressDir: 'src' }),
+    baseUrl: 'http://localhost:4200',
+  },
+});
+"
+`;
 exports[`Remix Application Standalone Project Repo --js should create the application correctly 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
@@ -443,14 +962,16 @@ exports[`Remix Application Standalone Project Repo --js should create the applic
   Scripts,
   ScrollRestoration,
 } from '@remix-run/react';
-export const meta = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
-});
+export const meta = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
 export default function App() {
   return (
-    <html lang=\\"en\\">
+    <html lang="en">
       <head>
         <Meta />
         <Links />
@@ -475,24 +996,24 @@ exports[`Remix Application Standalone Project Repo --js should create the applic
       <ul>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/blog\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
           >
             15m Quickstart Blog Tutorial
           </a>
         </li>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/jokes\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
           >
             Deep Dive Jokes App Tutorial
           </a>
         </li>
         <li>
-          <a target=\\"_blank\\" href=\\"https://remix.run/docs\\" rel=\\"noreferrer\\">
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
             Remix Docs
           </a>
         </li>
@@ -509,10 +1030,10 @@ exports[`Remix Application Standalone Project Repo --unitTestRunner should gener
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
@@ -523,9 +1044,9 @@ exports[`Remix Application Standalone Project Repo --unitTestRunner should gener
 export default {
   setupFilesAfterEnv: ['<rootDir>/test-setup.ts'],
   displayName: 'test',
-  preset: './jest.preset.js',
+  preset: './jest.preset.cjs',
   transform: {
-    '^.+\\\\\\\\.[tj]sx?$': ['ts-jest', { tsconfig: '<rootDir>/tsconfig.spec.json' }],
+    '^.+\\\\.[tj]sx?$': ['ts-jest', { tsconfig: '<rootDir>/tsconfig.spec.json' }],
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
   coverageDirectory: './coverage/test',
@@ -537,29 +1058,57 @@ export default {
 "
 `;
+exports[`Remix Application Standalone Project Repo --unitTestRunner should generate the correct files for testing using jest 3`] = `
+"import { installGlobals } from '@remix-run/node';
+import '@testing-library/jest-dom/matchers';
+installGlobals();
+"
+`;
+exports[`Remix Application Standalone Project Repo --unitTestRunner should generate the correct files for testing using jest 4`] = `
+"import { createRemixStub } from '@remix-run/testing';
+import { render, screen, waitFor } from '@testing-library/react';
+import Index from '../../app/routes/_index';
+test('renders loader data', async () => {
+  const RemixStub = createRemixStub([
+    {
+      path: '/',
+      Component: Index,
+    },
+  ]);
+  render(<RemixStub />);
+  await waitFor(() => screen.findByText('Welcome to Remix'));
+});
+"
+`;
 exports[`Remix Application Standalone Project Repo --unitTestRunner should generate the correct files for testing using vitest 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
 `;
 exports[`Remix Application Standalone Project Repo --unitTestRunner should generate the correct files for testing using vitest 2`] = `
-"/// <reference types=\\"vitest\\" />
-import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
-import react from '@vitejs/plugin-react';
+"/// <reference types='vitest' />
 import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 export default defineConfig({
-  cacheDir: './node_modules/.vite/test',
+  root: __dirname,
+  cacheDir: './node_modules/.vite/.',
   plugins: [react(), nxViteTsPaths()],
@@ -569,28 +1118,61 @@ export default defineConfig({
   // },
   test: {
-    setupFiles: ['./test-setup.ts'],
+    setupFiles: ['test-setup.ts'],
     globals: true,
     cache: {
       dir: './node_modules/.vitest',
     },
     environment: 'jsdom',
-    include: ['./app/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+    include: ['./tests/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+    reporters: ['default'],
+    coverage: {
+      reportsDirectory: './coverage/.',
+      provider: 'v8',
+    },
   },
 });
 "
 `;
+exports[`Remix Application Standalone Project Repo --unitTestRunner should generate the correct files for testing using vitest 3`] = `
+"import { createRemixStub } from '@remix-run/testing';
+import { render, screen, waitFor } from '@testing-library/react';
+import Index from '../../app/routes/_index';
+test('renders loader data', async () => {
+  const RemixStub = createRemixStub([
+    {
+      path: '/',
+      Component: Index,
+    },
+  ]);
+  render(<RemixStub />);
+  await waitFor(() => screen.findByText('Welcome to Remix'));
+});
+"
+`;
+exports[`Remix Application Standalone Project Repo --unitTestRunner should generate the correct files for testing using vitest 4`] = `
+"import { installGlobals } from '@remix-run/node';
+import '@testing-library/jest-dom/matchers';
+installGlobals();
+"
+`;
 exports[`Remix Application Standalone Project Repo should create the application correctly 1`] = `
 "/**
  * @type {import('@remix-run/dev').AppConfig}
  */
 module.exports = {
   ignoredRouteFiles: ['**/.*'],
-  // appDirectory: \\"app\\",
-  // assetsBuildDirectory: \\"public/build\\",
-  // serverBuildPath: \\"build/index.js\\",
-  // publicPath: \\"/build/\\",
+  // appDirectory: "app",
+  // assetsBuildDirectory: "public/build",
+  // serverBuildPath: "build/index.js",
+  // publicPath: "/build/",
   watchPaths: () => require('@nx/remix').createWatchPaths(__dirname),
 };
 "
@@ -607,15 +1189,17 @@ import {
   ScrollRestoration,
 } from '@remix-run/react';
-export const meta: MetaFunction = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
-});
+export const meta: MetaFunction = () => [
+  {
+    charset: 'utf-8',
+    title: 'New Remix App',
+    viewport: 'width=device-width,initial-scale=1',
+  },
+];
 export default function App() {
   return (
-    <html lang=\\"en\\">
+    <html lang="en">
       <head>
         <Meta />
         <Links />
@@ -640,24 +1224,24 @@ exports[`Remix Application Standalone Project Repo should create the application
       <ul>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/blog\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/blog"
+            rel="noreferrer"
           >
             15m Quickstart Blog Tutorial
           </a>
         </li>
         <li>
           <a
-            target=\\"_blank\\"
-            href=\\"https://remix.run/tutorials/jokes\\"
-            rel=\\"noreferrer\\"
+            target="_blank"
+            href="https://remix.run/tutorials/jokes"
+            rel="noreferrer"
           >
             Deep Dive Jokes App Tutorial
           </a>
         </li>
         <li>
-          <a target=\\"_blank\\" href=\\"https://remix.run/docs\\" rel=\\"noreferrer\\">
+          <a target="_blank" href="https://remix.run/docs" rel="noreferrer">
             Remix Docs
           </a>
         </li>
@@ -667,3 +1251,46 @@ exports[`Remix Application Standalone Project Repo should create the application
 }
 "
 `;
+exports[`Remix Application Standalone Project Repo should create the application correctly 4`] = `
+"import { createRemixStub } from '@remix-run/testing';
+import { render, screen, waitFor } from '@testing-library/react';
+import Index from '../../app/routes/_index';
+test('renders loader data', async () => {
+  const RemixStub = createRemixStub([
+    {
+      path: '/',
+      Component: Index,
+    },
+  ]);
+  render(<RemixStub />);
+  await waitFor(() => screen.findByText('Welcome to Remix'));
+});
+"
+`;
+exports[`Remix Application Standalone Project Repo should create the application correctly 5`] = `null`;
+exports[`Remix Application Standalone Project Repo should create the application correctly 6`] = `
+"{
+  "root": true,
+  "ignorePatterns": ["!**/*"],
+  "plugins": ["@nx"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx"],
+      "extends": ["plugin:@nx/typescript"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "extends": ["plugin:@nx/javascript"],
+      "rules": {}
+    }
+  ]
+}
+"
+`;