From aa3e85bec5b0b1fa71f93bfaab4e625725b2c112 Mon Sep 17 00:00:00 2001 From: arturovt Date: Tue, 12 Nov 2024 19:52:34 +0200 Subject: [PATCH] Angular 16 support In this commit, dependencies have been updated using ng update from Angular 13 to Angular 16. The new version also supports marking components as standalone, so this has been implemented. It is now possible to import components individually rather than the entire module. Resolves #69 --- Angular/powerbi-client-angular/angular.json | 3 +- .../config/src/tsconfig.lib.json | 1 - .../powerbi-client-angular/ng-package.json | 6 ++-- Angular/powerbi-client-angular/package.json | 25 ++++++++-------- .../powerbi-dashboard-embed.component.spec.ts | 2 +- .../powerbi-dashboard-embed.component.ts | 1 + .../powerbi-embed.component.spec.ts | 2 +- .../powerbi-embed/powerbi-embed.component.ts | 1 + ...i-paginated-report-embed.component.spec.ts | 2 +- ...owerbi-paginated-report-embed.component.ts | 1 + .../powerbi-qna-embed.component.spec.ts | 2 +- .../powerbi-qna-embed.component.ts | 1 + .../powerbi-report-embed.component.spec.ts | 2 +- .../powerbi-report-embed.component.ts | 1 + .../powerbi-tile-embed.component.spec.ts | 2 +- .../powerbi-tile-embed.component.ts | 1 + .../powerbi-visual-embed.component.spec.ts | 2 +- .../powerbi-visual-embed.component.ts | 1 + .../src/powerbi-embed.module.ts | 30 ++++++++----------- .../powerbi-client-angular/src/private-api.ts | 6 ++++ .../powerbi-client-angular/src/public-api.ts | 2 ++ Angular/powerbi-client-angular/src/test.ts | 17 ----------- Angular/powerbi-client-angular/tsconfig.json | 14 +++++---- 23 files changed, 58 insertions(+), 67 deletions(-) create mode 100644 Angular/powerbi-client-angular/src/private-api.ts diff --git a/Angular/powerbi-client-angular/angular.json b/Angular/powerbi-client-angular/angular.json index 9dbb9a2..9bdafb3 100644 --- a/Angular/powerbi-client-angular/angular.json +++ b/Angular/powerbi-client-angular/angular.json @@ -42,6 +42,5 @@ } } } - }, - "defaultProject": "powerbi-client-angular" + } } diff --git a/Angular/powerbi-client-angular/config/src/tsconfig.lib.json b/Angular/powerbi-client-angular/config/src/tsconfig.lib.json index cf9fef4..29bd129 100644 --- a/Angular/powerbi-client-angular/config/src/tsconfig.lib.json +++ b/Angular/powerbi-client-angular/config/src/tsconfig.lib.json @@ -2,7 +2,6 @@ "extends": "../../tsconfig.json", "compilerOptions": { "outDir": "../../out-tsc/lib", - "target": "es2015", "declaration": true, "declarationMap": true, "inlineSources": true, diff --git a/Angular/powerbi-client-angular/ng-package.json b/Angular/powerbi-client-angular/ng-package.json index 21b4aba..3512cd5 100644 --- a/Angular/powerbi-client-angular/ng-package.json +++ b/Angular/powerbi-client-angular/ng-package.json @@ -7,8 +7,6 @@ "allowedNonPeerDependencies": [ "powerbi-client", "powerbi-report-authoring", - "prettier", - "tslib", - "zone.js" + "prettier" ] -} \ No newline at end of file +} diff --git a/Angular/powerbi-client-angular/package.json b/Angular/powerbi-client-angular/package.json index ddf6273..d8343f7 100644 --- a/Angular/powerbi-client-angular/package.json +++ b/Angular/powerbi-client-angular/package.json @@ -28,22 +28,21 @@ "tag": "beta" }, "dependencies": { - "powerbi-client": "^2.21.1", - "tslib": "^2.1.0" + "powerbi-client": "^2.21.1" }, "devDependencies": { - "@angular-devkit/build-angular": "~13.3.8", + "@angular-devkit/build-angular": "^16.2.16", "@angular-eslint/builder": "^13.5.0", "@angular-eslint/eslint-plugin": "^13.5.0", "@angular-eslint/eslint-plugin-template": "^13.5.0", "@angular-eslint/schematics": "^13.5.0", "@angular-eslint/template-parser": "^13.5.0", - "@angular/cli": "~13.3.8", - "@angular/compiler": "~13.3.11", - "@angular/compiler-cli": "~13.3.11", - "@angular/core": "^13.3.11", - "@angular/platform-browser": "~13.3.11", - "@angular/platform-browser-dynamic": "~13.3.11", + "@angular/cli": "^16.2.16", + "@angular/compiler": "^16.2.12", + "@angular/compiler-cli": "^16.2.12", + "@angular/core": "^16.2.12", + "@angular/platform-browser": "^16.2.12", + "@angular/platform-browser-dynamic": "^16.2.12", "@types/jasmine": "~3.6.0", "@types/node": "^12.11.1", "@typescript-eslint/eslint-plugin": "4.16.1", @@ -59,9 +58,9 @@ "karma-coverage": "~2.0.3", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.0.0", - "ng-packagr": "^13.3.1", + "ng-packagr": "^16.2.3", "powerbi-report-authoring": "^1.1.1", - "typescript": "~4.6.4", - "zone.js": "~0.11.3" + "typescript": "~4.9.5", + "zone.js": "~0.13.3" } -} \ No newline at end of file +} diff --git a/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.spec.ts b/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.spec.ts index 48e7286..1fbeb1c 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.spec.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.spec.ts @@ -12,7 +12,7 @@ describe('PowerBIDashboardEmbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [PowerBIDashboardEmbedComponent], + imports: [PowerBIDashboardEmbedComponent], }).compileComponents(); // Arrange diff --git a/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.ts b/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.ts index f59d11b..b084362 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-dashboard-embed/powerbi-dashboard-embed.component.ts @@ -11,6 +11,7 @@ import { EventHandler, PowerBIEmbedComponent } from '../powerbi-embed/powerbi-em @Component({ selector: 'powerbi-dashboard[embedConfig]', template: '
', + standalone: true, }) export class PowerBIDashboardEmbedComponent extends PowerBIEmbedComponent implements OnInit, OnChanges, AfterViewInit { // Input() specify properties that will be passed from parent diff --git a/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.spec.ts b/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.spec.ts index b4e6fcf..736109a 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.spec.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.spec.ts @@ -10,7 +10,7 @@ describe('PowerBIEmbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [PowerBIEmbedComponent], + imports: [PowerBIEmbedComponent], }).compileComponents(); fixture = TestBed.createComponent(PowerBIEmbedComponent); diff --git a/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.ts b/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.ts index 85ee679..42add5d 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-embed/powerbi-embed.component.ts @@ -16,6 +16,7 @@ export type EventHandler = (event?: service.ICustomEvent, embeddedEntity?: @Component({ selector: 'powerbi-embed', template: '', + standalone: true, }) export class PowerBIEmbedComponent implements OnInit { // Input() specify the properties that will be passed from the parent diff --git a/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.spec.ts b/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.spec.ts index 038a1f5..85b48f8 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.spec.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.spec.ts @@ -12,7 +12,7 @@ describe('PowerBIPaginatedReportEmbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [PowerBIPaginatedReportEmbedComponent], + imports: [PowerBIPaginatedReportEmbedComponent], }).compileComponents(); // Arrange diff --git a/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.ts b/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.ts index 44d81e6..55a8771 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-paginated-report-embed/powerbi-paginated-report-embed.component.ts @@ -11,6 +11,7 @@ import { PowerBIEmbedComponent } from '../powerbi-embed/powerbi-embed.component' @Component({ selector: 'powerbi-paginated-report[embedConfig]', template: '
', + standalone: true, }) export class PowerBIPaginatedReportEmbedComponent extends PowerBIEmbedComponent implements OnInit, OnChanges, AfterViewInit { // Input() specify properties that will be passed from parent diff --git a/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.spec.ts b/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.spec.ts index f0d5ac2..fbfa64b 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.spec.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.spec.ts @@ -12,7 +12,7 @@ describe('PowerBIQnaEmbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [PowerBIQnaEmbedComponent], + imports: [PowerBIQnaEmbedComponent], }).compileComponents(); // Arrange diff --git a/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.ts b/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.ts index 8cc513c..9c04598 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-qna-embed/powerbi-qna-embed.component.ts @@ -11,6 +11,7 @@ import { EventHandler, PowerBIEmbedComponent } from '../powerbi-embed/powerbi-em @Component({ selector: 'powerbi-qna[embedConfig]', template: '
', + standalone: true, }) export class PowerBIQnaEmbedComponent extends PowerBIEmbedComponent implements OnInit, OnChanges, AfterViewInit { // Input() specify properties that will be passed from parent diff --git a/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.spec.ts b/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.spec.ts index 270ed9f..4e4e917 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.spec.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.spec.ts @@ -14,7 +14,7 @@ describe('PowerBIReportEmbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [PowerBIReportEmbedComponent], + imports: [PowerBIReportEmbedComponent], }).compileComponents(); // Arrange diff --git a/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.ts b/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.ts index 704b87f..f91738f 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-report-embed/powerbi-report-embed.component.ts @@ -11,6 +11,7 @@ import { EventHandler, PowerBIEmbedComponent } from '../powerbi-embed/powerbi-em @Component({ selector: 'powerbi-report[embedConfig]', template: '
', + standalone: true, }) export class PowerBIReportEmbedComponent extends PowerBIEmbedComponent implements OnInit, OnChanges, AfterViewInit { // Input() specify properties that will be passed from parent diff --git a/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.spec.ts b/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.spec.ts index 71fa28c..63a38e0 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.spec.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.spec.ts @@ -12,7 +12,7 @@ describe('PowerBITileEmbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [PowerBITileEmbedComponent], + imports: [PowerBITileEmbedComponent], }).compileComponents(); // Arrange diff --git a/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.ts b/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.ts index 2ca638d..7a38c2a 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-tile-embed/powerbi-tile-embed.component.ts @@ -11,6 +11,7 @@ import { EventHandler, PowerBIEmbedComponent } from '../powerbi-embed/powerbi-em @Component({ selector: 'powerbi-tile[embedConfig]', template: '
', + standalone: true, }) export class PowerBITileEmbedComponent extends PowerBIEmbedComponent implements OnInit, OnChanges, AfterViewInit { // Input() specify properties that will be passed from parent diff --git a/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.spec.ts b/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.spec.ts index 8ce9aef..e8d7539 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.spec.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.spec.ts @@ -13,7 +13,7 @@ describe('PowerBIVisualEmbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [PowerBIVisualEmbedComponent], + imports: [PowerBIVisualEmbedComponent], }).compileComponents(); // Arrange diff --git a/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.ts b/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.ts index c9fa723..fa6a4f7 100644 --- a/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.ts +++ b/Angular/powerbi-client-angular/src/components/powerbi-visual-embed/powerbi-visual-embed.component.ts @@ -11,6 +11,7 @@ import { EventHandler, PowerBIEmbedComponent } from '../powerbi-embed/powerbi-em @Component({ selector: 'powerbi-visual[embedConfig]', template: '
', + standalone: true, }) export class PowerBIVisualEmbedComponent extends PowerBIEmbedComponent implements OnInit, OnChanges, AfterViewInit { // Input() specify properties that will be passed from parent diff --git a/Angular/powerbi-client-angular/src/powerbi-embed.module.ts b/Angular/powerbi-client-angular/src/powerbi-embed.module.ts index c2a5f71..da4e653 100644 --- a/Angular/powerbi-client-angular/src/powerbi-embed.module.ts +++ b/Angular/powerbi-client-angular/src/powerbi-embed.module.ts @@ -10,24 +10,18 @@ import { PowerBIReportEmbedComponent } from './components/powerbi-report-embed/p import { PowerBITileEmbedComponent } from './components/powerbi-tile-embed/powerbi-tile-embed.component'; import { PowerBIVisualEmbedComponent } from './components/powerbi-visual-embed/powerbi-visual-embed.component'; +const components = [ + PowerBIEmbedComponent, + PowerBIDashboardEmbedComponent, + PowerBIPaginatedReportEmbedComponent, + PowerBIQnaEmbedComponent, + PowerBIReportEmbedComponent, + PowerBITileEmbedComponent, + PowerBIVisualEmbedComponent, +]; + @NgModule({ - declarations: [ - PowerBIEmbedComponent, - PowerBIDashboardEmbedComponent, - PowerBIPaginatedReportEmbedComponent, - PowerBIQnaEmbedComponent, - PowerBIReportEmbedComponent, - PowerBITileEmbedComponent, - PowerBIVisualEmbedComponent, - ], - imports: [], - exports: [ - PowerBIDashboardEmbedComponent, - PowerBIPaginatedReportEmbedComponent, - PowerBIQnaEmbedComponent, - PowerBIReportEmbedComponent, - PowerBITileEmbedComponent, - PowerBIVisualEmbedComponent, - ], + imports: components, + exports: components, }) export class PowerBIEmbedModule {} diff --git a/Angular/powerbi-client-angular/src/private-api.ts b/Angular/powerbi-client-angular/src/private-api.ts new file mode 100644 index 0000000..78214d8 --- /dev/null +++ b/Angular/powerbi-client-angular/src/private-api.ts @@ -0,0 +1,6 @@ +// Re-export privately, as this needs to be accessible as a compile symbol. +// Otherwise, the compiler would throw an error: +// Unsupported private class PowerBIEmbedComponent. This class is visible to +// consumers via PowerBIEmbedModule -> PowerBIEmbedComponent, but is not exported +// from the top-level library entrypoint. +export { PowerBIEmbedComponent as ɵPowerBIEmbedComponent } from './components/powerbi-embed/powerbi-embed.component'; diff --git a/Angular/powerbi-client-angular/src/public-api.ts b/Angular/powerbi-client-angular/src/public-api.ts index 7189ba2..19f7f78 100644 --- a/Angular/powerbi-client-angular/src/public-api.ts +++ b/Angular/powerbi-client-angular/src/public-api.ts @@ -12,3 +12,5 @@ export * from './components/powerbi-paginated-report-embed/powerbi-paginated-rep export * from './components/powerbi-visual-embed/powerbi-visual-embed.component'; export * from './components/powerbi-qna-embed/powerbi-qna-embed.component'; export * from './powerbi-embed.module'; + +export * from './private-api'; diff --git a/Angular/powerbi-client-angular/src/test.ts b/Angular/powerbi-client-angular/src/test.ts index ae48f86..7a1b52c 100644 --- a/Angular/powerbi-client-angular/src/test.ts +++ b/Angular/powerbi-client-angular/src/test.ts @@ -8,24 +8,7 @@ import 'zone.js/testing'; import { getTestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; -declare const require: { - context( - path: string, - deep?: boolean, - filter?: RegExp - ): { - keys(): string[]; - (id: string): T; - }; -}; - // First, initialize the Angular testing environment. getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), { teardown: { destroyAfterEach: false } }); - -// Then we find all the tests. -const context = require.context('./', true, /\.spec\.ts$/); - -// And load the modules. -context.keys().map(context); diff --git a/Angular/powerbi-client-angular/tsconfig.json b/Angular/powerbi-client-angular/tsconfig.json index 03a9318..956f807 100644 --- a/Angular/powerbi-client-angular/tsconfig.json +++ b/Angular/powerbi-client-angular/tsconfig.json @@ -13,17 +13,21 @@ "experimentalDecorators": true, "moduleResolution": "node", "importHelpers": true, - "target": "es2017", + "target": "ES2022", "module": "es2020", "lib": [ "es2018", "dom" - ] + ], + "useDefineForClassFields": false }, "angularCompilerOptions": { - "enableI18nLegacyMessageIdFormat": false, + "compilationMode": "partial", + "annotateForClosureCompiler": true, + "skipTemplateCodegen": true, + "strictMetadataEmit": true, + "fullTemplateTypeCheck": true, "strictInjectionParameters": true, - "strictInputAccessModifiers": true, - "strictTemplates": true + "enableResourceInlining": true } }