Source maps in production build pointing to .html file instead of .ts

[Eugene]

Environment

Production

What version are you running? Etc.

"@angular/common": "^17.3.7"
"@ionic/angular": "7.8.6"
"@capacitor/ios": "5.7.5"
"@sentry/angular-ivy": "^7.93.0"
"@sentry/capacitor": "^0.17.0"
"@sentry/cli": "^2.31.0"

Steps to Reproduce

1. creating a build using command ionic capacitor build ios --configuration=prod --source-map
2. uploading source maps using command sentry-cli sourcemaps inject --org gymcloud --project strongfirst-mobile ./www && sentry-cli sourcemaps upload --org gymcloud --project strongfirst-mobile ./www --release 1.6 --dist 14

Expected Result

With "optimization": true (enabled for production builds) error stack trace should point to .ts file and method that caused error

Actual Result

With "optimization": true (enabled for production builds) error stack trace points to .html file that contains button that triggers error method, but points to the code at the top of the file, not even the button itself

What actually happened.

The issue is with source maps. I have the next angular.json configuration

"app": {
  "architect": {
    "build": {
      "scripts": [],
      "vendorChunk": true,
      "extractLicenses": false,
      "buildOptimizer": false,
      "sourceMap": true,
      "optimization": false,
      "namedChunks": true
    },
    "configurations": {
      "prod": {
        "optimization": true,
        "outputHashing": "all",
        "sourceMap": {
          "scripts": true,
          "styles": false,
          "hidden": true,
          "vendor": false
        },
        "namedChunks": false,
        "extractLicenses": true,
        "vendorChunk": false,
        "buildOptimizer": true,
      }
    }
  }
}

When I'm using "optimization": true in configurations -> prod source maps are showing html file as a source of error, and position is wrong (button that triggers error is far below).

If I'm using "optimization": false then it shows correct typescript file (error location is little wrong, showing 3 lines higher then it is).

I've tried to choose both Angular and tsc options in sentry wizard, but result is the same. tsc option added this code to tsconfig.json file

"useDefineForClassFields": false,
"inlineSources": true,
// Set `sourceRoot` to  "/" to strip the build path prefix
// from generated source code references.
// This improves issue grouping in Sentry.
"sourceRoot": "/"

This is the result for "optimization": true

link to event

this is for "optimization": false

link to event

I don't think disabling optimization for production is good idea.

[LucasZF]

Hi Eugene and thank you for opening this issue with all the information for reproducing it!
We will investigate what's going on and give you a feedback if anything needs to be changed on the script or on the SDK itself.

[github-actions]

This issue has gone three weeks without activity. In another week, I will close it.

But! If you comment or otherwise update it, I will reset the clock, and if you label it Status: Backlog or Status: In Progress, I will leave it alone ... forever!

---

"A weed is but an unloved flower." ― Ella Wheeler Wilcox 🥀

[Eugene]

comment to not close

[github-actions]

This issue has gone three weeks without activity. In another week, I will close it.

But! If you comment or otherwise update it, I will reset the clock, and if you label it Status: Backlog or Status: In Progress, I will leave it alone ... forever!

---

"A weed is but an unloved flower." ― Ella Wheeler Wilcox 🥀

[Eugene]

comment to not close