diff --git a/.github/workflows/on_release_build_image.yml b/.github/workflows/on_release_build_image.yml index 4995740..749252f 100644 --- a/.github/workflows/on_release_build_image.yml +++ b/.github/workflows/on_release_build_image.yml @@ -6,7 +6,7 @@ name: Create and publish a Docker image on: push: - branches: ["main"] + branches: ["main", "27-chore-implement-logging-via-glitchtip"] release: types: [published] diff --git a/package.json b/package.json index 36035b7..308161a 100644 --- a/package.json +++ b/package.json @@ -32,6 +32,7 @@ "@ngx-translate/core": "15.0.0", "@ngx-translate/http-loader": "8.0.0", "@popperjs/core": "^2.11.8", + "@sentry/angular-ivy": "^7.111.0", "@zip.js/zip.js": "2.4.10", "bootstrap": "^5.3.2", "file-saver": "2.0.5", @@ -75,4 +76,4 @@ "typescript": "5.4.5" }, "description": "An Ionic project" -} \ No newline at end of file +} diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 02123c3..4d359a1 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,7 +1,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { BrowserModule } from '@angular/platform-browser'; import { IonicModule, IonicRouteStrategy } from '@ionic/angular'; -import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; +import { NgModule, CUSTOM_ELEMENTS_SCHEMA, ErrorHandler } from '@angular/core'; import { RouteReuseStrategy } from '@angular/router'; import { ServiceWorkerModule } from '@angular/service-worker'; import { TranslateHttpLoader } from '@ngx-translate/http-loader'; @@ -15,6 +15,8 @@ import { ComponentsModule } from '@components/components.module'; import { PipesModule } from '@pipes/pipes.module'; import { CustomHttpInterceptor } from '@shared/http.interceptor'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; +import * as Sentry from "@sentry/angular-ivy"; +import { Router } from "@angular/router"; export const translationLoaderFactory = (http: HttpClient) => new TranslateHttpLoader(http); @NgModule({ @@ -42,7 +44,9 @@ export const translationLoaderFactory = (http: HttpClient) => new TranslateHttpL providers: [ { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }, { provide: HTTP_INTERCEPTORS, useClass: CustomHttpInterceptor, multi: true }, + { provide: ErrorHandler, useValue: Sentry.createErrorHandler({showDialog: true })}, + { provide: Sentry.TraceService, deps: [Router]}, ], bootstrap: [AppComponent] }) -export class AppModule { } +export class AppModule { constructor(trace: Sentry.TraceService) {} } diff --git a/src/app/pages/home/home.page.html b/src/app/pages/home/home.page.html index bdc15fa..5bc0048 100644 --- a/src/app/pages/home/home.page.html +++ b/src/app/pages/home/home.page.html @@ -74,6 +74,7 @@

+

Dieses Tool darf nur in Bildungskontexten genutzt werden. Die Eingabe personenbezogener Daten ist nicht gestattet. diff --git a/src/app/services/video/video.service.ts b/src/app/services/video/video.service.ts index 442dbd6..b8df164 100644 --- a/src/app/services/video/video.service.ts +++ b/src/app/services/video/video.service.ts @@ -3,7 +3,7 @@ import { FFmpeg } from '@ffmpeg/ffmpeg'; import { fetchFile, toBlobURL } from '@ffmpeg/util'; import { Location, LocationStrategy } from '@angular/common'; import { MimeTypes } from '@enums/mime-types.enum'; - +import * as Sentry from "@sentry/angular-ivy"; @Injectable({ @@ -12,11 +12,13 @@ import { MimeTypes } from '@enums/mime-types.enum'; export class VideoService { private loaded = false; private ffmpeg = new FFmpeg(); + private messages = []; private async loadFfmpeg() { const assetBasePath = `${window.location.origin}/assets/js/ffmpeg`; this.ffmpeg.on("log", ({ message }) => { console.log(message) + this.messages.push(message) }); await this.ffmpeg.load({ coreURL: await toBlobURL(`${assetBasePath}/ffmpeg-core.js`, "text/javascript"), @@ -30,8 +32,26 @@ export class VideoService { }; constructor(private location: Location) { } - + public async createVideo(imageBlobs: Blob[], frameRate: number, audioBlob?: Blob) { + let video: Blob; + + try { + video = await this.createVideoWithFfmpeg(imageBlobs, frameRate, audioBlob) + } catch (err) { + console.log("messages: " + this.messages.join("\n")) + Sentry.setContext("ffmpeg-log-error", {messages: this.messages.join("\n")}) + Sentry.captureException(err); + } + + console.log("messages: " + this.messages.join("\n")) + Sentry.setContext("ffmpeg-log", {messages: this.messages.join("\n")}) + Sentry.captureMessage("ffmpeg-log-captured") + + return video; + } + + public async createVideoWithFfmpeg(imageBlobs: Blob[], frameRate: number, audioBlob?: Blob) { if (!this.loaded) { await this.loadFfmpeg(); } diff --git a/src/main.ts b/src/main.ts index 455d324..c9cc106 100644 --- a/src/main.ts +++ b/src/main.ts @@ -5,12 +5,32 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { environment } from '@environment/environment'; import { AppModule } from './app/app.module'; +import * as Sentry from "@sentry/angular-ivy"; if (environment.production) { enableProdMode(); window.console.log = () => { }; } +Sentry.init({ + dsn: "https://c43111bfae664837b4a663223d1673f4@gt.b310.de/2", + integrations: [ + // Registers and configures the Tracing integration, + // which automatically instruments your application to monitor its + // performance, including custom Angular routing instrumentation + + Sentry.browserTracingIntegration(), + // Registers the Replay integration, + // which automatically captures Session Replays + // Sentry.replayIntegration(), + ], + + autoSessionTracking: false, + // Set sampleRates to 1.0 to capture 100% during testing + tracesSampleRate: 1.0, +}); + + platformBrowserDynamic() .bootstrapModule(AppModule) - .catch(err => console.error(err)); + .catch(err => console.error(err)); \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 9b2009b..edc6d35 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2067,6 +2067,88 @@ "@angular-devkit/schematics" "17.3.5" jsonc-parser "3.2.1" +"@sentry-internal/feedback@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry-internal/feedback/-/feedback-7.111.0.tgz#c715e7e6a1877b60cd1f4dff85969660e0deff3f" + integrity sha512-xaKgPPDEirOan7c9HwzYA1KK87kRp/qfIx9ZKLOEtxwy6nqoMuSByGqSwm1Oqfcjpbd7y6/y+7Bw+69ZKNVLDQ== + dependencies: + "@sentry/core" "7.111.0" + "@sentry/types" "7.111.0" + "@sentry/utils" "7.111.0" + +"@sentry-internal/replay-canvas@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry-internal/replay-canvas/-/replay-canvas-7.111.0.tgz#aa3cba0477f312cbf40eff4eabeaeda6221a55b6" + integrity sha512-3KPBIpiegTYmuVw9gA2aKuliAQONS3Ny1kJc9x5kz6XQGuLFxqlh6KzoCVaKfQJeq2WJqRNeR4KFFuNGuB3H8w== + dependencies: + "@sentry/core" "7.111.0" + "@sentry/replay" "7.111.0" + "@sentry/types" "7.111.0" + "@sentry/utils" "7.111.0" + +"@sentry-internal/tracing@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry-internal/tracing/-/tracing-7.111.0.tgz#b352df9f38009c5d306308a829a1dd9a57f084fd" + integrity sha512-CgXly8rsdu4loWVKi2RqpInH3C2cVBuaYsx4ZP5IJpzSinsUAMyyr3Pc0PZzCyoVpBBXGBGj/4HhFsY3q6Z0Vg== + dependencies: + "@sentry/core" "7.111.0" + "@sentry/types" "7.111.0" + "@sentry/utils" "7.111.0" + +"@sentry/angular-ivy@^7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry/angular-ivy/-/angular-ivy-7.111.0.tgz#9847fb95b60ae7b4ad5271659297da0c0e71bd48" + integrity sha512-ILVdfMzh990auRyOR1YXwQGaOHhy4edC/tW9NsXfal6rnZES9yBS70Uz6GbolXhcpf5LzWDcbgaGGsLCZEkJGA== + dependencies: + "@sentry/browser" "7.111.0" + "@sentry/core" "7.111.0" + "@sentry/types" "7.111.0" + "@sentry/utils" "7.111.0" + tslib "^2.4.1" + +"@sentry/browser@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-7.111.0.tgz#29da73e7192eb5643d101c47922d7374e4cc88ed" + integrity sha512-x7S9XoJh+TbMnur4eBhPpCVo+p7udABBV2gQk+Iw6LP9e8EFKmGmNyl76vSsT6GeFJ7mwxDEKfuwbVoLBjIvHw== + dependencies: + "@sentry-internal/feedback" "7.111.0" + "@sentry-internal/replay-canvas" "7.111.0" + "@sentry-internal/tracing" "7.111.0" + "@sentry/core" "7.111.0" + "@sentry/replay" "7.111.0" + "@sentry/types" "7.111.0" + "@sentry/utils" "7.111.0" + +"@sentry/core@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry/core/-/core-7.111.0.tgz#54c9037a3b79b3623377dce1887b69b40670e201" + integrity sha512-/ljeMjZu8CSrLGrseBi/7S2zRIFsqMcvfyG6Nwgfc07J9nbHt8/MqouE1bXZfiaILqDBpK7BK9MLAAph4mkAWg== + dependencies: + "@sentry/types" "7.111.0" + "@sentry/utils" "7.111.0" + +"@sentry/replay@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry/replay/-/replay-7.111.0.tgz#6d21bddf2ec245db6eb2c471e81efd94364107ae" + integrity sha512-cSbI4A4hrO0sZ0ynvLQauPg8YyaDOQkhGkyvbws8W9WgfxR8X827bY9S0f1TPfgaFiVcKb0iRaAwyXHg3pyzOg== + dependencies: + "@sentry-internal/tracing" "7.111.0" + "@sentry/core" "7.111.0" + "@sentry/types" "7.111.0" + "@sentry/utils" "7.111.0" + +"@sentry/types@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry/types/-/types-7.111.0.tgz#9c869c3c51d606041916765ba58f29de915707ac" + integrity sha512-Oti4pgQ55+FBHKKcHGu51ZUxO1u52G5iVNK4mbtAN+5ArSCy/2s1H8IDJiOMswn3acfUnCR0oB/QsbEgAPZ26g== + +"@sentry/utils@7.111.0": + version "7.111.0" + resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-7.111.0.tgz#e006cc1e751b30ff5cf914c34eb143102e2e8c2d" + integrity sha512-CB5rz1EgCSwj3xoXogsCZ5pQtfERrURc/ItcCuoaijUhkD0iMq5MCNWMHW3mBsBrqx/Oba+XGvDu0t/5+SWwBg== + dependencies: + "@sentry/types" "7.111.0" + "@sigstore/bundle@^2.3.0", "@sigstore/bundle@^2.3.1": version "2.3.1" resolved "https://registry.yarnpkg.com/@sigstore/bundle/-/bundle-2.3.1.tgz#f6cdc67c8400e58ca27f0ef495b27a9327512073" @@ -7503,16 +7585,7 @@ streamroller@^3.1.5: debug "^4.3.4" fs-extra "^8.1.0" -"string-width-cjs@npm:string-width@^4.2.0": - version "4.2.3" - resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" - integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== - dependencies: - emoji-regex "^8.0.0" - is-fullwidth-code-point "^3.0.0" - strip-ansi "^6.0.1" - -string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: +"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -7572,14 +7645,7 @@ string_decoder@~1.1.1: dependencies: safe-buffer "~5.1.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1": - version "6.0.1" - resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" - integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== - dependencies: - ansi-regex "^5.0.1" - -strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -7813,7 +7879,7 @@ tsconfig-paths@^4.1.2: minimist "^1.2.6" strip-bom "^3.0.0" -tslib@2.6.2, tslib@^2.1.0, tslib@^2.3.0, tslib@^2.4.0: +tslib@2.6.2, tslib@^2.1.0, tslib@^2.3.0, tslib@^2.4.0, tslib@^2.4.1: version "2.6.2" resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae" integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q== @@ -8260,7 +8326,7 @@ wildcard@^2.0.0: resolved "https://registry.yarnpkg.com/wildcard/-/wildcard-2.0.1.tgz#5ab10d02487198954836b6349f74fff961e10f67" integrity sha512-CC1bOL87PIWSBhDcTrdeLo6eGT7mCFtrg0uIJtqJUFyK+eJnzl8A1niH56uu7KMa5XFrtiV+AQuHO3n7DsHnLQ== -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== @@ -8278,15 +8344,6 @@ wrap-ansi@^6.2.0: string-width "^4.1.0" strip-ansi "^6.0.0" -wrap-ansi@^7.0.0: - version "7.0.0" - resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" - integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== - dependencies: - ansi-styles "^4.0.0" - string-width "^4.1.0" - strip-ansi "^6.0.0" - wrap-ansi@^8.1.0: version "8.1.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"