[Android] Sentry doesn't show correct source code

[cloudhx]

It used to work well when using v3.x, after bumping a few packages recently and also updated to @nativescript-community/sentry@4.6.12, errors no longer show correct source code, it shows something like this: Source maps are uploaded exactly like before.

Anyone has experience in this? Thank you!

[farfromrefug]

@cloudhx not sure what s happening. Though i can tell you sourcemaps in 4.6.12 works perfectly fine here. Could be an issue with either webpack or wrong/outdated sourcemaps being used on sentry

[cloudhx]

Thanks @farfromrefug , let me provide a bit more information here, hopefully you could find something wrong.

package.json

"dependencies": {
    "@angular/animations": "~13.2.0",
    "@angular/common": "~13.2.0",
    "@angular/compiler": "~13.2.0",
    "@angular/core": "~13.2.0",
    "@angular/forms": "~13.2.0",
    "@angular/platform-browser": "~13.2.0",
    "@angular/platform-browser-dynamic": "~13.2.0",
    "@angular/router": "~13.2.0",
    "@auth0/angular-jwt": "^5.0.2",
    "@mapbox/polyline": "^1.1.1",
    "@nativescript-community/arraybuffers": "^1.1.1",
    "@nativescript-community/insomnia": "^2.0.2",
    "@nativescript-community/sentry": "^4.6.12",
    "@nativescript-community/ui-lottie": "^5.0.5",
    "@nativescript-community/ui-mapbox": "^6.2.15",
    "@nativescript-community/ui-material-button": "^7.0.36",
    "@nativescript-community/ui-material-cardview": "^7.0.37",
    "@nativescript-community/ui-material-textfield": "^7.0.36",
    "@nativescript-community/ui-material-textview": "^7.0.40",
    "@nativescript-community/ui-pulltorefresh": "^2.5.1",
    "@nativescript/angular": "^13.0.0",
    "@nativescript/background-http": "^6.0.0",
    "@nativescript/camera": "^5.0.15",
    "@nativescript/core": "^8.4.7",
    "@nativescript/geolocation": "8.0.4",
    "@nativescript/secure-storage": "^3.0.0",
    "@nativescript/theme": "~3.0.2",
    "@ngrx/store": "^13.2.0",
    "@ngx-translate/core": "^14.0.0",
    "@ngx-translate/http-loader": "^7.0.0",
    "@nordsense/opening-hours-utils": "^0.1.0",
    "@nstudio/nativescript-cardview": "^2.0.1",
    "@nstudio/nativescript-loading-indicator": "^4.1.2",
    "@nstudio/nativescript-snackbar": "^2.1.0",
    "@turf/turf": "^5.1.6",
    "cheap-ruler": "^3.0.2",
    "google-polyline": "^1.0.3",
    "lodash": "^4.17.21",
    "nativescript-audio": "^6.2.6",
    "nativescript-extendedinfo": "^1.0.11",
    "rxjs": "^7.5.5",
    "zone.js": "~0.11.5"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~13.2.0",
    "@angular/compiler-cli": "~13.2.0",
    "@nativescript/android": "^8.4.0",
    "@nativescript/ios": "8.2.3",
    "@nativescript/types": "~8.2.0",
    "@nativescript/webpack": "~5.0.6",
    "@ngtools/webpack": "~13.2.0",
    "@sentry/cli": "^2.13.0",
    "@sentry/webpack-plugin": "^1.20.0",
    "@types/mapbox__polyline": "^1.0.2",
    "prettier": "^2.6.2",
    "typescript": "~4.5.5"
  }

webpack.config.js code snippet

  // Sentry
    const SENTRY_PREFIX = 'app:///';
    const SOURCEMAP_REL_DIR = '../../sourcemaps';

    let appVersion;
    let buildNumber;
    if (platform === 'android') {
      const gradlePath = resolve(projectRoot, appResourcesPath, 'Android/app.gradle');
      const gradleData = readFileSync(gradlePath, 'utf8');
      appVersion = gradleData.match(/versionName "((?:[0-9]+\.?)+)"/)[1];
      buildNumber = gradleData.match(/versionCode ([0-9]+)/)[1];
    } else if (platform === 'ios') {
      const plistPath = resolve(projectRoot, appResourcesPath, 'iOS/Info.plist');
      const plistData = readFileSync(plistPath, 'utf8');
      appVersion = plistData.match(/<key>CFBundleShortVersionString<\/key>[\s\n]*<string>(.*?)<\/string>/)[1];
      buildNumber = plistData.match(/<key>CFBundleVersion<\/key>[\s\n]*<string>([0-9]*)<\/string>/)[1];
    }
    console.log("appVersion", appVersion);
    console.log("buildNumber", buildNumber);

    config.resolve.symlinks = false;
    config.devtool = false;
    config.plugins.push(
      new webpack.SourceMapDevToolPlugin({
        append: `\n//# sourceMappingURL=${SENTRY_PREFIX}[name].js.map`,
        filename: join(SOURCEMAP_REL_DIR, '[name].js.map')
      })
    );

    // Upload source map
    config.plugins.push(
      new SentryCliPlugin({
        urlPrefix: SENTRY_PREFIX,
        rewrite: true,
        cleanArtifacts: true,
        release: `${'our product name'}@${appVersion}+${buildNumber}`,
        dist: `${buildNumber}.${platform}`,
        ignoreFile: '.sentrycliignore',
        include: [dist, join(dist, SOURCEMAP_REL_DIR)]
      })
    );

[cloudhx]

Source maps uploaded in Sentry

Sentry error tags

[farfromrefug]

@cloudhx you can check yourself if the error actually lines in the sources correspond to what sentry says or not. Cant help you from here

[cloudhx]

@farfromrefug After I cleaned up everything and started a new release, it's now working again, thanks for all the suggestions 👍