vcgit-forge/angular-challenges
1
0
Fork 0
mirror of https://github.com/Raghu-Ch/angular-challenges.git synced 2026-02-11 05:13:02 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat(test): add challenge 18 and 19 avout testing

Browse Source
This commit is contained in:
thomas
2023-04-08 14:18:49 +02:00
parent 95e0f6b5f8
commit b52ff0697b
52 changed files with 2126 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
apps/testing-nested/src/app/app.component.ts Normal file
View File

@@ -0,0 +1,10 @@
import { Component } from '@angular/core';
import { ChildComponent } from './child.component';
@Component({
standalone: true,
imports: [ChildComponent],
selector: 'app-root',
template: ` <app-child></app-child> `,
})
export class AppComponent {}

15
apps/testing-nested/src/app/child.component.cy.ts Normal file
View File

@@ -0,0 +1,15 @@
import { ChildComponent } from './child.component';
describe(ChildComponent.name, () => {
const setup = () => {
cy.mount(ChildComponent);
};
test('add Good title and send request title with no error', () => {
setup();
});
test('fail validating title because no title were typed', () => {
setup();
});
});

12
apps/testing-nested/src/app/child.component.spec.ts Normal file
View File

@@ -0,0 +1,12 @@
import { render } from '@testing-library/angular';
import { ChildComponent } from './child.component';
describe('ChildComponent', () => {
test('add Good title and send request title with no error', async () => {
await render(ChildComponent);
});
test('fail validating title because no title were typed', async () => {
await render(ChildComponent);
});
});

86
apps/testing-nested/src/app/child.component.ts Normal file
View File

@@ -0,0 +1,86 @@
import { NgIf } from '@angular/common';
import {
ChangeDetectionStrategy,
Component,
EventEmitter,
Input,
Output,
inject,
} from '@angular/core';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { HttpService } from './http.service';
@Component({
selector: 'app-input',
standalone: true,
imports: [ReactiveFormsModule],
template: ` <input type="text" [formControl]="title" /> `,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class InputComponent {
title = new FormControl('', { nonNullable: true });
}
@Component({
selector: 'result',
standalone: true,
template: ` <p>Title is {{ title }}</p> `,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ResultComponent {
@Input() title = '';
}
@Component({
selector: 'app-button',
standalone: true,
template: `<button (click)="validate.emit()">Validate</button>`,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ButtonComponent {
@Output() validate = new EventEmitter();
}
@Component({
selector: 'app-error',
standalone: true,
template: `<p>Title is required !!!</p>`,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ErrorComponent {
@Output() validate = new EventEmitter();
}
@Component({
selector: 'app-child',
standalone: true,
imports: [
ResultComponent,
ButtonComponent,
InputComponent,
ErrorComponent,
NgIf,
],
template: `
<app-input #input></app-input>
<result [title]="input.title.value"></result>
<app-button (validate)="submit(input.title.value)"></app-button>
<app-error *ngIf="showError"></app-error>
`,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ChildComponent {
http = inject(HttpService);
showError = false;
submit(title: string) {
this.showError = false;
if (title === '') {
this.showError = true;
return;
}
this.http.sendTitle(title);
}
}

8
apps/testing-nested/src/app/http.service.ts Normal file
View File

@@ -0,0 +1,8 @@
import { Injectable } from '@angular/core';
@Injectable({ providedIn: 'root' })
export class HttpService {
sendTitle(title: string) {
console.log(`${title} has been sent !!!`);
}
}

0
apps/testing-nested/src/assets/.gitkeep Normal file
View File

BIN
apps/testing-nested/src/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

13
apps/testing-nested/src/index.html Normal file
View File

@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>TestingNested</title>
<base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="favicon.ico" />
</head>
<body>
<app-root></app-root>
</body>
</html>

4
apps/testing-nested/src/main.ts Normal file
View File

@@ -0,0 +1,4 @@
import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
bootstrapApplication(AppComponent).catch((err) => console.error(err));

1
apps/testing-nested/src/styles.scss Normal file
View File

@@ -0,0 +1 @@
/* You can add global styles to this file, and also import other style files */

2
apps/testing-nested/src/test-setup.ts Normal file
View File

@@ -0,0 +1,2 @@
import '@testing-library/jest-dom';
import 'jest-preset-angular/setup-jest';