✨ feat: add standalone component as default

ngx-devs · Sep 22, 2024 · 47f6f2e · 47f6f2e
1 parent ed28161
commit 47f6f2e
Show file tree

Hide file tree

Showing 12 changed files with 155 additions and 147 deletions.
diff --git a/.gitignore b/.gitignore
@@ -6,3 +6,4 @@ coverage
 dist
 build
 
+debug.log
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,3 +1,3 @@
 {
-  "cSpell.words": ["devs", "GLUEGUN", "ngxd"]
+  "cSpell.words": ["cria", "devs", "gluegun", "Gluegun", "GLUEGUN", "ngxd", "serviço"]
 }
diff --git a/src/commands/generate/component/common/common.test.ts b/src/commands/generate/component/common/common.test.ts
@@ -3,17 +3,21 @@ import { filesystem, strings } from 'gluegun';
 import { runNgxdCLI } from '../../../../utils/cli-test-setup';
 
 describe('Commands: [Generate] => [Component] => [Common]', () => {
+  const TESTING_DIR = '__GCC_TEST__';
+  const COMMAND = 'g c c';
+
   beforeEach(() => {
     jest.useFakeTimers();
     jest.setTimeout(100000);
   });
 
   afterEach(() => {
     jest.clearAllTimers();
+    filesystem.remove(TESTING_DIR);
   });
 
   test('should generate a common component with 3 files', async () => {
-    const name = 'sample-with-three-files';
+    const name = 'gcc-3-files';
     await runNgxdCLI(`g c c ${name}`);
 
     const html = filesystem.read(`${name}/${name}.component.html`);
@@ -27,7 +31,7 @@ describe('Commands: [Generate] => [Component] => [Common]', () => {
   });
 
   test('should generate a common component on provided path', async () => {
-    const name = 'sample-with-path';
+    const name = 'gcc-provided-path';
     const baseFolder = 'sample-app';
     const path = `${baseFolder}/src/app/components`;
 
@@ -44,60 +48,59 @@ describe('Commands: [Generate] => [Component] => [Common]', () => {
     filesystem.remove(baseFolder);
   });
 
-  test('should generate a common component html correct content', async () => {
-    const name = 'sample-with-default-template';
-
-    await runNgxdCLI(`g c c ${name}`);
+  test('should generate a common component html default template', async () => {
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcc-default-template';
 
-    const html = filesystem.read(`${name}/${name}.component.html`);
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
+    const html = filesystem.read(`${path}/${name}/${name}.component.html`);
     expect(html).toContain(`<p>${name} works</p>`);
-    filesystem.remove(`${name}`);
   });
 
   test('should generate a common component with correct templateUrl: and styleUrls ', async () => {
-    const name = 'sample-style-template-url';
-    await runNgxdCLI(`g c c ${name}`);
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcc-template-style';
 
-    const ts = filesystem.read(`${name}/${name}.component.ts`);
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
+
+    const ts = filesystem.read(`${path}/${name}/${name}.component.ts`);
 
     expect(ts).toContain(`templateUrl: './${name}.component.html'`);
     expect(ts).toContain(`styleUrls: ['./${name}.component.scss']`);
-    filesystem.remove(`${name}`);
   });
 
   test('should generate a common component with spec file', async () => {
-    const name = 'sample-spec';
-    await runNgxdCLI(`g c c ${name}`);
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcc-spec';
 
-    const ts = filesystem.read(`${name}/${name}.component.spec.ts`);
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    expect(ts).toBeDefined();
+    const ts = filesystem.read(`${path}/${name}/${name}.component.spec.ts`);
 
-    filesystem.remove(`${name}`);
+    expect(ts).toBeDefined();
   });
 
   test('should properly interpolate component name on spec file', async () => {
-    const name = 'sample-spec-two';
-    await runNgxdCLI(`g c c ${name}`);
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcc-spec-interpolate';
+
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    const ts = filesystem.read(`${name}/${name}.component.spec.ts`);
+    const ts = filesystem.read(`${path}/${name}/${name}.component.spec.ts`);
 
     const pascalCaseName = strings.pascalCase(name);
 
     expect(ts).toContain(`describe('${pascalCaseName}Component', () => {`);
-
-    filesystem.remove(`${name}`);
   });
 
-  test('should not contain ngOnInit on import statement', async () => {
-    const name = 'sample-import';
-    await runNgxdCLI(`g c c ${name}`);
-
-    const ts = filesystem.read(`${name}/${name}.component.ts`);
+  test('should contain "standalone: true" on component decorator by default', async () => {
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcc-standalone';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    expect(ts).not.toContain(`OnInit`);
+    const ts = filesystem.read(`${path}/${name}/${name}.component.ts`);
 
-    filesystem.remove(`${name}`);
+    expect(ts).toContain(`standalone: true`);
   });
 });
diff --git a/src/commands/generate/component/dialog/dialog.test.ts b/src/commands/generate/component/dialog/dialog.test.ts
@@ -11,15 +11,12 @@ describe('Commands: [Generate] => [Component] => [Dialog]', () => {
     jest.setTimeout(100000);
   });
 
-  afterEach(() => {
-    jest.clearAllTimers();
-  });
-
   afterAll(() => {
+    jest.clearAllTimers();
     filesystem.remove(TESTING_DIR);
   });
 
-  test('should generate a dialog component with 3 files', async (done) => {
+  test('should generate a dialog component with 3 files', async () => {
     const name = 'gdc-base-fruit';
     await runNgxdCLI(`${COMMAND} ${name}`);
 
@@ -32,12 +29,11 @@ describe('Commands: [Generate] => [Component] => [Dialog]', () => {
     expect(ts).toBeDefined();
 
     filesystem.remove(name);
-    done();
   });
 
-  test('should generate a dialog component on provided path', async (done) => {
+  test('should generate a dialog component on provided path', async () => {
     const path = `${TESTING_DIR}/components`;
-    const name = 'fruit1';
+    const name = 'gdc-provided-path';
 
     await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
@@ -48,30 +44,27 @@ describe('Commands: [Generate] => [Component] => [Dialog]', () => {
     expect(html).toBeDefined();
     expect(scss).toBeDefined();
     expect(ts).toBeDefined();
-    done();
   });
 
-  test('should generate a dialog component html with default template <p>fruit2 works</p>', async (done) => {
+  test('should generate a dialog component html with default template <p>gdc-default-template works</p>', async () => {
     const path = `${TESTING_DIR}/components`;
-    const name = 'fruit2';
+    const name = 'gdc-default-template';
 
     await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
     const html = filesystem.read(`${path}/${name}/${name}.dialog.html`);
     expect(html).toContain(`<p>${name} works</p>`);
-    done();
   });
 
-  test('should generate a dialog component with correct templateUrl: and styleUrls ', async (done) => {
+  test('should generate a dialog component with correct templateUrl: and styleUrls ', async () => {
     const path = `${TESTING_DIR}/components`;
-    const name = 'fruitThree';
+    const name = 'gdc-template-style';
 
     await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
     const ts = filesystem.read(`${path}/${name}/${name}.dialog.ts`);
 
-    expect(ts).toContain(`templateUrl: './fruit-three.dialog.html'`);
-    expect(ts).toContain(`styleUrls: ['./fruit-three.dialog.scss']`);
-    done();
+    expect(ts).toContain(`templateUrl: './${name}.dialog.html'`);
+    expect(ts).toContain(`styleUrls: ['./${name}.dialog.scss']`);
   });
 });
diff --git a/src/commands/generate/component/page/page.test.ts b/src/commands/generate/component/page/page.test.ts
@@ -3,36 +3,23 @@ import { filesystem } from 'gluegun';
 import { runNgxdCLI } from '../../../../utils/cli-test-setup';
 
 describe('Commands: [Generate] => [Component] => [Page]', () => {
+  const TESTING_DIR = '__GWC_TEST__';
+  const COMMAND = 'g c p';
+
   beforeEach(() => {
     jest.useFakeTimers();
     jest.setTimeout(100000);
   });
 
   afterEach(() => {
     jest.clearAllTimers();
+    filesystem.remove(TESTING_DIR);
   });
 
   test('should generate a page component with 3 files', async () => {
-    const name = 'base-gcp-fruit';
-    await runNgxdCLI(`g c p ${name}`);
-
-    const html = filesystem.read(`${name}/${name}.page.html`);
-    const scss = filesystem.read(`${name}/${name}.page.scss`);
-    const ts = filesystem.read(`${name}/${name}.page.ts`);
-
-    expect(html).toBeDefined();
-    expect(scss).toBeDefined();
-    expect(ts).toBeDefined();
-
-    filesystem.remove(name);
-  });
-
-  test('should generate a page component on provided path', async () => {
-    const name = 'sample-with-path';
-    const baseFolder = 'sample-app';
-    const path = `${baseFolder}/src/app/components`;
-
-    await runNgxdCLI(`g c p ${name} --path ${path}`);
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcp-3-files';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
     const html = filesystem.read(`${path}/${name}/${name}.page.html`);
     const scss = filesystem.read(`${path}/${name}/${name}.page.scss`);
@@ -42,26 +29,43 @@ describe('Commands: [Generate] => [Component] => [Page]', () => {
     expect(scss).toBeDefined();
     expect(ts).toBeDefined();
 
-    filesystem.remove(baseFolder);
+    filesystem.remove(TESTING_DIR);
   });
 
   test('should generate a page component html with default template <p>sample works</p>', async () => {
-    const name = 'sample-with-default-template';
-    await runNgxdCLI(`g c p ${name}`);
-    const html = filesystem.read(`${name}/${name}.page.html`);
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcp-default-template';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
+
+    const html = filesystem.read(`${path}/${name}/${name}.page.html`);
 
     expect(html).toContain(`<p>${name} works</p>`);
-    filesystem.remove(name);
+
+    filesystem.remove(TESTING_DIR);
   });
 
   test('should generate a page component with correct templateUrl: and styleUrls ', async () => {
-    const name = 'sample-style-template-url';
-    await runNgxdCLI(`g c p ${name}`);
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcp-template-style';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    const ts = filesystem.read(`${name}/${name}.page.ts`);
+    const ts = filesystem.read(`${path}/${name}/${name}.page.ts`);
 
     expect(ts).toContain(`templateUrl: './${name}.page.html'`);
     expect(ts).toContain(`styleUrls: ['./${name}.page.scss']`);
-    filesystem.remove(name);
+
+    filesystem.remove(TESTING_DIR);
+  });
+
+  test('should contain  "standalone: true" on component decorator by default', async () => {
+    const path = `${TESTING_DIR}/components`;
+    const name = 'gcp-standalone-true';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
+
+    const ts = filesystem.read(`${path}/${name}/${name}.page.ts`);
+
+    expect(ts).toContain(`standalone: true`);
+
+    filesystem.remove(TESTING_DIR);
   });
 });
diff --git a/src/commands/generate/component/widget/widget.test.ts b/src/commands/generate/component/widget/widget.test.ts
@@ -3,7 +3,8 @@ import { filesystem } from 'gluegun';
 import { runNgxdCLI } from '../../../../utils/cli-test-setup';
 
 describe('Commands: [Generate] => [Component] => [Widget]', () => {
-  const name = 'gwc';
+  const TESTING_DIR = '__GWC_TEST__';
+  const COMMAND = 'g c w';
 
   beforeEach(() => {
     jest.useFakeTimers();
@@ -12,53 +13,57 @@ describe('Commands: [Generate] => [Component] => [Widget]', () => {
 
   afterEach(() => {
     jest.clearAllTimers();
-    filesystem.remove(`${name}`);
+    filesystem.remove(TESTING_DIR);
   });
 
   test('should generate a widget component on provided path', async () => {
-    const path = 'sample-project/components';
-    await runNgxdCLI(`g c w ${name} --path=${path}`);
+    const path = `${TESTING_DIR}/components`;
+    const name = 'sample-widget';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    const html = filesystem.read(`${path}/${name}/${name}.component.html`);
-    const scss = filesystem.read(`${path}/${name}/${name}.component.scss`);
-    const ts = filesystem.read(`${path}/${name}/${name}.component.ts`);
-    const widgetModule = filesystem.read(`${path}/${name}/${name}.widget.module.ts`);
+    const html = filesystem.read(`${path}/${name}/${name}.widget.html`);
+    const scss = filesystem.read(`${path}/${name}/${name}.widget.scss`);
+    const ts = filesystem.read(`${path}/${name}/${name}.widget.ts`);
 
     expect(html).toBeDefined();
     expect(scss).toBeDefined();
     expect(ts).toBeDefined();
-    expect(widgetModule).toBeDefined();
 
-    filesystem.remove('sample-project');
+    filesystem.remove(TESTING_DIR);
   });
 
-  test('should generate widget component with 4 files', async () => {
-    await runNgxdCLI(`g c w ${name}`);
+  test('should generate widget component html with default template <p>sample works</p>', async () => {
+    const path = `${TESTING_DIR}/components`;
+    const name = 'template-sample-widget';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    const html = filesystem.read(`${name}/${name}.component.html`);
-    const scss = filesystem.read(`${name}/${name}.component.scss`);
-    const ts = filesystem.read(`${name}/${name}.component.ts`);
-    const widgetModule = filesystem.read(`${name}/${name}.widget.module.ts`);
+    const html = filesystem.read(`${path}/${name}/${name}.widget.html`);
 
-    expect(html).toBeDefined();
-    expect(scss).toBeDefined();
-    expect(ts).toBeDefined();
-    expect(widgetModule).toBeDefined();
+    expect(html).toContain(`<p>${name} works</p>`);
+
+    filesystem.remove(TESTING_DIR);
   });
 
-  test('should generate widget component html with default template <p>sample works</p>', async () => {
-    await runNgxdCLI(`g c w ${name}`);
-    const html = filesystem.read(`${name}/${name}.component.html`);
+  test('should generate a widget component with correct templateUrl: and styleUrls ', async () => {
+    const path = `${TESTING_DIR}/components`;
+    const name = 'template-style-sample-widget';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    expect(html).toContain(`<p>${name} works</p>`);
+    const ts = filesystem.read(`${path}/${name}/${name}.widget.ts`);
+
+    expect(ts).toContain(`templateUrl: './${name}.widget.html'`);
+    expect(ts).toContain(`styleUrls: ['./${name}.widget.scss']`);
+
+    filesystem.remove(TESTING_DIR);
   });
 
-  test('should generate a widget component with correct templateUrl: and styleUrls ', async () => {
-    await runNgxdCLI(`g c w ${name}`);
+  test('should contain  "standalone: true" on component decorator by default', async () => {
+    const path = `${TESTING_DIR}/components`;
+    const name = 'standalone-sample-widget';
+    await runNgxdCLI(`${COMMAND} ${name} --path ${path}`);
 
-    const ts = filesystem.read(`${name}/${name}.component.ts`);
+    const ts = filesystem.read(`${path}/${name}/${name}.widget.ts`);
 
-    expect(ts).toContain(`templateUrl: './${name}.component.html'`);
-    expect(ts).toContain(`styleUrls: ['./${name}.component.scss']`);
+    expect(ts).toContain(`standalone: true`);
   });
 });