fixes and updates

apps/angular-task-e2e/playwright.config.ts

@@ -16,38 +16,38 @@ const baseURL = process.env['BASE_URL'] || 'http://localhost:4200';
  * See https://playwright.dev/docs/test-configuration.
  */
 export default defineConfig({
-  ...nxE2EPreset(__filename, { testDir: './src' }),
-  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
-  use: {
-    baseURL,
-    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: 'on-first-retry',
-  },
-  /* Run your local dev server before starting the tests */
-  webServer: {
-    command: 'npx nx serve angular-task',
-    url: 'http://localhost:4200',
-    reuseExistingServer: !process.env.CI,
-    cwd: workspaceRoot,
-  },
-  projects: [
-    {
-      name: 'chromium',
-      use: { ...devices['Desktop Chrome'] },
+    ...nxE2EPreset(__filename, { testDir: './src' }),
+    /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+    use: {
+        baseURL,
+        /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+        trace: 'on-first-retry',
     },
-
-    {
-      name: 'firefox',
-      use: { ...devices['Desktop Firefox'] },
+    /* Run your local dev server before starting the tests */
+    webServer: {
+        command: 'npx nx serve angular-task',
+        url: 'http://localhost:4200',
+        reuseExistingServer: !process.env.CI,
+        cwd: workspaceRoot,
     },
+    projects: [
+        {
+            name: 'chromium',
+            use: { ...devices['Desktop Chrome'] },
+        },
 
-    {
-      name: 'webkit',
-      use: { ...devices['Desktop Safari'] },
-    },
+        {
+            name: 'firefox',
+            use: { ...devices['Desktop Firefox'] },
+        },
 
-    // Uncomment for mobile browsers support
-    /* {
+        {
+            name: 'webkit',
+            use: { ...devices['Desktop Safari'] },
+        },
+
+        // Uncomment for mobile browsers support
+        /* {
       name: 'Mobile Chrome',
       use: { ...devices['Pixel 5'] },
     },
@@ -56,7 +56,7 @@ export default defineConfig({
       use: { ...devices['iPhone 12'] },
     }, */
 
-    // Uncomment for branded browsers
+        // Uncomment for branded browsers
     /* {
       name: 'Microsoft Edge',
       use: { ...devices['Desktop Edge'], channel: 'msedge' },
@@ -65,5 +65,5 @@ export default defineConfig({
       name: 'Google Chrome',
       use: { ...devices['Desktop Chrome'], channel: 'chrome' },
     } */
-  ],
+    ],
 });

apps/angular-task-e2e/src/example.spec.ts

@@ -1,8 +1,10 @@
 import { test, expect } from '@playwright/test';
 
 test('has title', async ({ page }) => {
-  await page.goto('/');
 
-  // Expect h1 to contain a substring.
-  expect(await page.locator('h1').innerText()).toContain('Welcome');
+    await page.goto('/');
+
+    // Expect h1 to contain a substring.
+    expect(await page.locator('h1').innerText()).toContain('Welcome');
+
 });

apps/angular-task/server.ts

@@ -6,55 +6,63 @@ import { dirname, join, resolve } from 'node:path';
 import bootstrap from './src/main.server';
 
 // The Express app is exported so that it can be used by serverless Functions.
-export function app(): express.Express {
-  const server = express();
-  const serverDistFolder = dirname(fileURLToPath(import.meta.url));
-  const browserDistFolder = resolve(serverDistFolder, '../browser');
-  const indexHtml = join(serverDistFolder, 'index.server.html');
-
-  const commonEngine = new CommonEngine();
-
-  server.set('view engine', 'html');
-  server.set('views', browserDistFolder);
-
-  // Example Express Rest API endpoints
-  // server.get('/api/**', (req, res) => { });
-  // Serve static files from /browser
-  server.get(
-    '**',
-    express.static(browserDistFolder, {
-      maxAge: '1y',
-      index: 'index.html',
-    })
-  );
-
-  // All regular routes use the Angular engine
-  server.get('**', (req, res, next) => {
-    const { protocol, originalUrl, baseUrl, headers } = req;
-
-    commonEngine
-      .render({
-        bootstrap,
-        documentFilePath: indexHtml,
-        url: `${protocol}://${headers.host}${originalUrl}`,
-        publicPath: browserDistFolder,
-        providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }],
-      })
-      .then((html) => res.send(html))
-      .catch((err) => next(err));
-  });
-
-  return server;
+export function app (): express.Express {
+
+    const server = express();
+    const serverDistFolder = dirname(fileURLToPath(import.meta.url));
+    const browserDistFolder = resolve(serverDistFolder, '../browser');
+    const indexHtml = join(serverDistFolder, 'index.server.html');
+
+    const commonEngine = new CommonEngine();
+
+    server.set('view engine', 'html');
+    server.set('views', browserDistFolder);
+
+    // Example Express Rest API endpoints
+    // server.get('/api/**', (req, res) => { });
+    // Serve static files from /browser
+    server.get(
+        '**',
+        express.static(browserDistFolder, {
+            maxAge: '1y',
+            index: 'index.html',
+        })
+    );
+
+    // All regular routes use the Angular engine
+    server.get('**', (req, res, next) => {
+
+        const { protocol, originalUrl, baseUrl, headers } = req;
+
+        commonEngine
+        .render({
+            bootstrap,
+            documentFilePath: indexHtml,
+            url: `${protocol}://${headers.host}${originalUrl}`,
+            publicPath: browserDistFolder,
+            providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }],
+        })
+        .then((html) => res.send(html))
+        .catch((err) => next(err));
+
+    });
+
+    return server;
+
 }
 
-function run(): void {
-  const port = process.env['PORT'] || 4000;
+function run (): void {
+
+    const port = process.env['PORT'] || 4000;
+
+    // Start up the Node server
+    const server = app();
+    server.listen(port, () => {
+
+        console.log(`Node Express server listening on http://localhost:${port}`);
+
+    });
 
-  // Start up the Node server
-  const server = app();
-  server.listen(port, () => {
-    console.log(`Node Express server listening on http://localhost:${port}`);
-  });
 }
 
 run();

apps/angular-task/src/app/app.component.spec.ts

@@ -1,27 +1,32 @@
 import { TestBed } from '@angular/core/testing';
 import { AppComponent } from './app.component';
-import { NxWelcomeComponent } from './nx-welcome.component';
 import { RouterModule } from '@angular/router';
 
 describe('AppComponent', () => {
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AppComponent, NxWelcomeComponent, RouterModule.forRoot([])],
-    }).compileComponents();
-  });
-
-  it('should render title', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.querySelector('h1')?.textContent).toContain(
-      'Welcome angular-task'
-    );
-  });
-
-  it(`should have as title 'angular-task'`, () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
-    expect(app.title).toEqual('angular-task');
-  });
+
+    beforeEach(async () => {
+
+        await TestBed.configureTestingModule({
+            imports: [AppComponent, RouterModule.forRoot([])],
+        }).compileComponents();
+
+    });
+
+    it('should render title', () => {
+
+        const fixture = TestBed.createComponent(AppComponent);
+        fixture.detectChanges();
+        const compiled = fixture.nativeElement as HTMLElement;
+        expect(compiled.querySelector('h1')?.textContent).toContain('User Management');
+
+    });
+
+    it(`should have as title 'angular-task'`, () => {
+
+        const fixture = TestBed.createComponent(AppComponent);
+        const app = fixture.componentInstance;
+        expect(app.title).toEqual('angular-task');
+
+    });
+
 });

apps/angular-task/src/app/app.config.server.ts

@@ -3,7 +3,7 @@ import { provideServerRendering } from '@angular/platform-server';
 import { appConfig } from './app.config';
 
 const serverConfig: ApplicationConfig = {
-  providers: [provideServerRendering()],
+    providers: [provideServerRendering()],
 };
 
 export const config = mergeApplicationConfig(appConfig, serverConfig);

apps/angular-task/src/main.ts

@@ -3,5 +3,4 @@ import { appConfig } from './app/app.config';
 import { AppComponent } from './app/app.component';
 
 bootstrapApplication(AppComponent, appConfig).catch((err) =>
-  console.error(err)
-);
+    console.error(err));

apps/angular-task/src/test-setup.ts

@@ -1,8 +1,8 @@
 // @ts-expect-error https://thymikee.github.io/jest-preset-angular/docs/getting-started/test-environment
 globalThis.ngJest = {
-  testEnvironmentOptions: {
-    errorOnUnknownElements: true,
-    errorOnUnknownProperties: true,
-  },
+    testEnvironmentOptions: {
+        errorOnUnknownElements: true,
+        errorOnUnknownProperties: true,
+    },
 };
 import 'jest-preset-angular/setup-jest';

libs/user/data-access/src/lib/user/user.service.ts

@@ -41,13 +41,13 @@ export class UserService {
     users = firstValueFrom(this.httpClient.get<User[]>(this.baseUrl));
 
     // GET https://jsonplaceholder.typicode.com/users/:id
-    user$ (id: number) {
+    getUser$ (id: number) {
 
         return this.httpClient.get<User>(`${this.baseUrl}/${id}`);
 
     }
 
-    user (id: number) {
+    getUser (id: number) {
 
         return firstValueFrom(this.httpClient.get<User>(`${this.baseUrl}/${id}`));
 

libs/user/ui/src/index.ts

@@ -0,0 +1 @@
+export * from './lib/console-file';

libs/user/ui/src/lib/console-file.ts

@@ -0,0 +1 @@
+export const consoleFile = console.log('Use this library for ui components');

libs/user/util/src/index.ts

@@ -0,0 +1 @@
+export * from './lib/console-file';

libs/user/util/src/lib/console-file.ts

@@ -0,0 +1 @@
+export const consoleFile = console.log('Use this library for utility methods');