diff --git a/apps/example-app/src/app/issues/issue-304.spec.ts b/apps/example-app/src/app/issues/issue-304.spec.ts new file mode 100644 index 00000000..d9bc355f --- /dev/null +++ b/apps/example-app/src/app/issues/issue-304.spec.ts @@ -0,0 +1,67 @@ +import { Component, EventEmitter, Input, Output } from '@angular/core'; +import { Location } from '@angular/common'; +import { render, screen } from '@testing-library/angular'; +import userEvent from '@testing-library/user-event'; +import { TestBed } from '@angular/core/testing'; + +// with goBackSpy, the implementation of goBack won't be invoked (because it's using the spy) +test('should call a goBack when user click in the button', async () => { + const goBackSpy = jest.fn(); + await render(HeaderBackButtonComponent, { + declarations: [IconButtonComponent], + componentProperties: { + goBack: goBackSpy, + }, + }); + + const button = screen.getByLabelText(/icon button/i); + userEvent.click(button); + expect(goBackSpy).toHaveBeenCalled(); +}); + +// don't spy on goBack, this way the implementation of goBack is invoked, and you can test if location.back() is called +test('should call a Location.back when user click in the button', async () => { + await render(HeaderBackButtonComponent, { + declarations: [IconButtonComponent], + }); + + const location = TestBed.inject(Location); + jest.spyOn(location, 'back'); + + const button = screen.getByLabelText(/icon button/i); + userEvent.click(button); + expect(location.back).toHaveBeenCalled(); +}); + +@Component({ + selector: 'app-cebs-header-back-button', + template: ` +
+ +
+ `, +}) +class HeaderBackButtonComponent { + constructor(private location: Location) {} + + goBack(): void { + this.location.back(); + } +} + +@Component({ + selector: 'app-cebs-icon-button', + template: ` + + `, +}) +class IconButtonComponent { + @Output() clickEvent = new EventEmitter(); + @Input() icon!: string; + + onClick(): void { + this.clickEvent.emit(); + } +} diff --git a/apps/example-app/tsconfig.app.json b/apps/example-app/tsconfig.app.json index a009fad9..04fbd826 100644 --- a/apps/example-app/tsconfig.app.json +++ b/apps/example-app/tsconfig.app.json @@ -4,7 +4,7 @@ "outDir": "../../dist/out-tsc", "types": [], "allowJs": true, - "target": "ES2017" + "target": "ES2020" }, "files": ["src/main.ts", "src/polyfills.ts"], "include": ["src/**/*.d.ts"], diff --git a/package.json b/package.json index 66fb3d80..219e6784 100644 --- a/package.json +++ b/package.json @@ -47,9 +47,11 @@ }, "devDependencies": { "@angular-devkit/build-angular": "14.0.0", - "@angular-eslint/eslint-plugin": "13.0.1", - "@angular-eslint/eslint-plugin-template": "13.0.1", - "@angular-eslint/template-parser": "13.0.1", + "@angular-eslint/builder": "14.0.0", + "@angular-eslint/eslint-plugin": "14.0.0", + "@angular-eslint/eslint-plugin-template": "14.0.0", + "@angular-eslint/schematics": "14.0.0", + "@angular-eslint/template-parser": "14.0.0", "@angular/cli": "14.0.0", "@angular/compiler-cli": "14.0.0", "@angular/forms": "14.0.0", diff --git a/projects/testing-library/tsconfig.schematics.json b/projects/testing-library/tsconfig.schematics.json index 0573a52a..481a34bc 100644 --- a/projects/testing-library/tsconfig.schematics.json +++ b/projects/testing-library/tsconfig.schematics.json @@ -2,7 +2,7 @@ "extends": "../../tsconfig.base.json", "compilerOptions": { "strict": true, - "target": "es6", + "target": "ES2020", "module": "commonjs", "moduleResolution": "node", "esModuleInterop": true, diff --git a/tsconfig.base.json b/tsconfig.base.json index ede79fb8..b75283e1 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -11,7 +11,7 @@ "moduleResolution": "node", "outDir": "./dist/out-tsc", "sourceMap": true, - "target": "es2015", + "target": "ES2020", "typeRoots": ["node_modules/@types"], "strict": true, "exactOptionalPropertyTypes": true,