From 17147a12ad63dc66c15222d66b26db61463acdb5 Mon Sep 17 00:00:00 2001
From: Caleb Ukle <caleb.ukle+github@pm.me>
Date: Mon, 24 Apr 2023 10:54:20 -0500
Subject: [PATCH] fix(nextjs): generate working spec file for --appDir

---
 .../application/application.spec.ts           | 30 ++++++++++++++-----
 .../application/files/app/page.tsx__tmpl__    |  4 +--
 .../specs/__fileName__.spec.tsx__tmpl__       |  8 ++---
 .../lib/create-application-files.ts           |  4 ++-
 4 files changed, 31 insertions(+), 15 deletions(-)

diff --git a/packages/next/src/generators/application/application.spec.ts b/packages/next/src/generators/application/application.spec.ts
index 43e2410cd77e5b..70842b43b483dd 100644
--- a/packages/next/src/generators/application/application.spec.ts
+++ b/packages/next/src/generators/application/application.spec.ts
@@ -450,14 +450,28 @@ describe('app', () => {
         appDir: true,
       });
 
-      expect(tree.exists('apps/testApp/pages/styles.css')).toBeFalsy();
-
-      expect(tree.exists('apps/testApp/app/global.css'));
-      expect(tree.exists('apps/testApp/app/page.tsx'));
-      expect(tree.exists('apps/testApp/app/layout.tsx'));
-      expect(tree.exists('apps/testApp/app/api/hello/route.ts'));
-      expect(tree.exists('apps/testApp/app/page.module.css'));
-      expect(tree.exists('apps/testApp/app/favicon.ico'));
+      expect(tree.exists('apps/test-app/pages/styles.css')).toBeFalsy();
+      expect(tree.exists('apps/test-app/app/global.css')).toBeTruthy();
+      expect(tree.exists('apps/test-app/app/page.tsx')).toBeTruthy();
+      expect(tree.exists('apps/test-app/app/layout.tsx')).toBeTruthy();
+      expect(tree.exists('apps/test-app/app/api/hello/route.ts')).toBeTruthy();
+      expect(tree.exists('apps/test-app/app/page.module.css')).toBeTruthy();
+      expect(tree.exists('apps/test-app/public/favicon.ico')).toBeTruthy();
+      expect(tree.read('apps/test-app/specs/page.spec.tsx', 'utf-8'))
+        .toMatchInlineSnapshot(`
+        "import React from 'react';
+        import { render } from '@testing-library/react';
+        import Page from '../apps/page';
+
+        describe('Page', () => {
+          it('should render successfully', () => {
+            const { baseElement } = render(<Page />);
+
+            expect(baseElement).toBeTruthy();
+          });
+        });
+        "
+      `);
     });
   });
 });
diff --git a/packages/next/src/generators/application/files/app/page.tsx__tmpl__ b/packages/next/src/generators/application/files/app/page.tsx__tmpl__
index fe4ce590e2d732..4b964a3b00168c 100644
--- a/packages/next/src/generators/application/files/app/page.tsx__tmpl__
+++ b/packages/next/src/generators/application/files/app/page.tsx__tmpl__
@@ -14,7 +14,7 @@
 const StyledPage = styled.div`<%- pageStyleContent %>`;
 <% }%>
 
-export default async function Index() {
+export default function Index() {
   /*
    * Replace the elements below with your own.
    *
@@ -26,4 +26,4 @@ export default async function Index() {
       <%- appContent %>
     </<%= wrapper %>>
   );
-};
\ No newline at end of file
+};
diff --git a/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__ b/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__
index 42c94022afd1c1..695cd78a27ce62 100644
--- a/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__
+++ b/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__
@@ -1,11 +1,11 @@
 import React from 'react';
 import { render } from '@testing-library/react';
+<% if(appDir) {%> import Page from '../apps/page';<% } else {%>import Index from '../pages/index';<% } %>
 
-import Index from '../pages/index';
-
-describe('Index', () => {
+describe('<% if(appDir) { %>Page<% } else { %>Index<% } %>', () => {
   it('should render successfully', () => {
-    const { baseElement } = render(<Index />);
+    const { baseElement } = render(<% if(appDir) { %><Page /><% } else { %><Index /><% } %>);
+   
     expect(baseElement).toBeTruthy();
   });
 });
diff --git a/packages/next/src/generators/application/lib/create-application-files.ts b/packages/next/src/generators/application/lib/create-application-files.ts
index ae9fe71e7e1410..3ad90000fc76d4 100644
--- a/packages/next/src/generators/application/lib/create-application-files.ts
+++ b/packages/next/src/generators/application/lib/create-application-files.ts
@@ -16,9 +16,11 @@ import {
 } from './create-application-files.helpers';
 
 export function createApplicationFiles(host: Tree, options: NormalizedSchema) {
+  const n = names(options.name);
   const templateVariables = {
-    ...names(options.name),
     ...options,
+    ...n,
+    fileName: options.appDir ? 'page' : options.fileName ?? n.fileName,
     dot: '.',
     tmpl: '',
     rootTsConfigPath: getRelativePathToRootTsConfig(