Skip to content

Commit 4fc845c

Browse files
yjaaidiyjaaidi
committed
feat: ✨ add 302-recipe-search-integration-browser-mode exercise
1 parent cd27d94 commit 4fc845c

File tree

99 files changed

+2988
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

99 files changed

+2988
-0
lines changed

‎apps/302-recipe-search-integration-browser-mode-solution/eslint.config.mjs‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import nx from '@nx/eslint-plugin';
2+
import baseConfig from '../../eslint.config.mjs';
3+
4+
export default [
5+
...baseConfig,
6+
...nx.configs['flat/angular'],
7+
...nx.configs['flat/angular-template'],
8+
{
9+
files: ['**/*.ts'],
10+
rules: {
11+
'@angular-eslint/directive-selector': [
12+
'error',
13+
{
14+
type: 'attribute',
15+
prefix: 'wm',
16+
style: 'camelCase',
17+
},
18+
],
19+
'@angular-eslint/component-selector': [
20+
'error',
21+
{
22+
type: 'element',
23+
prefix: 'wm',
24+
style: 'kebab-case',
25+
},
26+
],
27+
},
28+
},
29+
{
30+
files: ['**/*.html'],
31+
rules: {
32+
/* Do not do this at home.
33+
* This is just meant to unclutter the exercise. */
34+
'@angular-eslint/template/alt-text': 'off',
35+
},
36+
},
37+
];

‎apps/302-recipe-search-integration-browser-mode-solution/jest.config.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import { swcAngularJestTransformer } from '@jscutlery/swc-angular';
2+
3+
export default {
4+
displayName: 'whiskmate',
5+
preset: '../../jest.preset.js',
6+
setupFilesAfterEnv: ['<rootDir>/src/test-setup-jest.ts'],
7+
testPathIgnorePatterns: ['browser\\.spec\\.ts$'],
8+
coverageDirectory: '../../coverage/apps/whiskmate',
9+
transform: {
10+
'^.+\\.m?(t|j)sx?$': swcAngularJestTransformer(),
11+
},
12+
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
13+
snapshotSerializers: [
14+
'jest-preset-angular/build/serializers/no-ng-attributes',
15+
'jest-preset-angular/build/serializers/ng-snapshot',
16+
'jest-preset-angular/build/serializers/html-comment',
17+
],
18+
};

‎apps/302-recipe-search-integration-browser-mode-solution/playwright-ct.config.ts‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import { defineConfig, devices } from '@jscutlery/playwright-ct-angular';
2+
import { nxE2EPreset } from '@nx/playwright/preset';
3+
import { swcAngularUnpluginOptions } from '@jscutlery/swc-angular';
4+
import swc from 'unplugin-swc';
5+
6+
/**
7+
* See https://playwright.dev/docs/test-configuration.
8+
*/
9+
export default defineConfig({
10+
...nxE2EPreset(__filename, { testDir: '.' }),
11+
testMatch: ['**/*.pw.ts'],
12+
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
13+
use: {
14+
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
15+
trace: 'on-first-retry',
16+
ctViteConfig: {
17+
plugins: [swc.vite(swcAngularUnpluginOptions())],
18+
resolve: {
19+
/* @angular/material is using "style" as a Custom Conditional export to expose prebuilt styles etc... */
20+
conditions: ['style'],
21+
},
22+
},
23+
},
24+
timeout: 10000,
25+
projects: [
26+
{ name: 'chromium', use: { ...devices['Desktop Chrome'] } },
27+
{ name: 'firefox', use: { ...devices['Desktop Firefox'] } },
28+
{ name: 'webkit', use: { ...devices['Desktop Safari'] } },
29+
],
30+
});

‎apps/302-recipe-search-integration-browser-mode-solution/playwright/index.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Testing Page</title>
7+
</head>
8+
<body>
9+
<div id="root"></div>
10+
<script type="module" src="./index.ts"></script>
11+
</body>
12+
</html>

‎apps/302-recipe-search-integration-browser-mode-solution/playwright/index.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import '@angular/compiler';
2+
import 'zone.js';
3+
import '../src/styles.css';
4+
import { beforeMount } from '@jscutlery/playwright-ct-angular/hooks';
5+
import { provideAnimations } from '@angular/platform-browser/animations';
6+
7+
beforeMount(async ({ TestBed }) => {
8+
TestBed.configureTestingModule({
9+
providers: [provideAnimations()],
10+
});
11+
});

‎apps/302-recipe-search-integration-browser-mode-solution/playwright/tsconfig.json‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"extends": "../tsconfig.json",
3+
"compilerOptions": {
4+
"outDir": "../../../dist/out-tsc",
5+
"module": "commonjs",
6+
"types": ["node"],
7+
},
8+
"include": [
9+
"./index.ts",
10+
"../**/*.pw.ts",
11+
]
12+
}

‎apps/302-recipe-search-integration-browser-mode-solution/project.json‎

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
{
2+
"name": "302-recipe-search-integration-browser-mode-solution",
3+
"$schema": "../../node_modules/nx/schemas/project-schema.json",
4+
"projectType": "application",
5+
"sourceRoot": "apps/302-recipe-search-integration-browser-mode-solution/src",
6+
"prefix": "wm",
7+
"tags": [],
8+
"targets": {
9+
"build": {
10+
"executor": "@angular-devkit/build-angular:browser-esbuild",
11+
"options": {
12+
"outputPath": "dist/{projectRoot}",
13+
"index": "{projectRoot}/src/index.html",
14+
"main": "{projectRoot}/src/main.ts",
15+
"tsConfig": "{projectRoot}/tsconfig.app.json",
16+
"assets": ["{projectRoot}/src/favicon.ico", "{projectRoot}/src/assets"],
17+
"styles": ["{projectRoot}/src/styles.css"],
18+
"scripts": []
19+
},
20+
"configurations": {
21+
"production": {
22+
"budgets": [
23+
{
24+
"type": "initial",
25+
"maximumWarning": "500kb",
26+
"maximumError": "1mb"
27+
},
28+
{
29+
"type": "anyComponentStyle",
30+
"maximumWarning": "2kb",
31+
"maximumError": "4kb"
32+
}
33+
],
34+
"fileReplacements": [
35+
{
36+
"replace": "{projectRoot}/src/environments/environment.ts",
37+
"with": "{projectRoot}/src/environments/environment.prod.ts"
38+
}
39+
],
40+
"outputHashing": "all"
41+
},
42+
"development": {
43+
"buildOptimizer": false,
44+
"optimization": false,
45+
"extractLicenses": false,
46+
"sourceMap": true,
47+
"namedChunks": true
48+
}
49+
},
50+
"defaultConfiguration": "production"
51+
},
52+
"serve": {
53+
"executor": "@angular-devkit/build-angular:dev-server",
54+
"configurations": {
55+
"production": {
56+
"buildTarget": ":build:production"
57+
},
58+
"development": {
59+
"buildTarget": ":build:development"
60+
}
61+
},
62+
"defaultConfiguration": "development",
63+
"continuous": true
64+
},
65+
"extract-i18n": {
66+
"executor": "@angular-devkit/build-angular:extract-i18n",
67+
"options": {
68+
"buildTarget": ":build"
69+
}
70+
},
71+
"reset": {
72+
"command": "rm -rf .swc playwright/.cache",
73+
"options": {
74+
"cwd": "{projectRoot}"
75+
}
76+
},
77+
"test": {
78+
"configurations": {
79+
"debug": {
80+
"args": "--watch",
81+
"env": {
82+
"DEBUG_BROWSER": "true"
83+
}
84+
}
85+
}
86+
},
87+
"test-ui": {
88+
"command": "playwright test -c playwright-ct.config.ts",
89+
"options": { "cwd": "{projectRoot}" }
90+
}
91+
}
92+
}

‎apps/302-recipe-search-integration-browser-mode-solution/src/app/app.config.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import {
2+
ApplicationConfig,
3+
provideZonelessChangeDetection,
4+
} from '@angular/core';
5+
import { provideHttpClient } from '@angular/common/http';
6+
7+
export const appConfig: ApplicationConfig = {
8+
providers: [provideHttpClient(), provideZonelessChangeDetection()],
9+
};

‎apps/302-recipe-search-integration-browser-mode-solution/src/app/app.ng.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { ChangeDetectionStrategy, Component } from '@angular/core';
2+
import { Title } from './shared/title.ng';
3+
import { RecipeSearch } from './recipe/recipe-search.ng';
4+
5+
@Component({
6+
changeDetection: ChangeDetectionStrategy.OnPush,
7+
selector: 'wm-app',
8+
imports: [Title, RecipeSearch],
9+
template: ` <wm-title>👨🏻‍🍳 Welcome to Whiskmate 🥘</wm-title>
10+
<wm-recipe-search />`,
11+
})
12+
export class App {}

0 commit comments

Comments
 (0)