getsentry / sentry-react-native

Official Sentry SDK for React Native
https://sentry.io
MIT License
1.57k stars 333 forks source link

Xcode sentry-cli debug file upload Error: Project not found. #3901

Closed overhearapp closed 2 months ago

overhearapp commented 3 months ago

OS:

Platform:

SDK:

SDK version: "~5.22.0"

react-native version: "0.74.2"

Are you using Expo?

Are you using sentry.io or on-premise?

If you are using sentry.io, please post a link to your issue so we can take a look:

[Link to issue]

Configuration:

(@sentry/react-native)

Sentry.init({
  enabled: __DEV__,
  dsn: 'MY DSN',
  // Set tracesSampleRate to 1.0 to capture 100% of transactions for performance monitoring.
  // We recommend adjusting this value in production.
  tracesSampleRate: 1.0,
  _experiments: {
    // profilesSampleRate is relative to tracesSampleRate.
    // Here, we'll capture profiles for 100% of transactions.
    profilesSampleRate: 1.0,
  },
});

DSN redacted or

(react-native-sentry)

Sentry.config(
  'https://...@sentry.io/...'
  // other options
 ).install();

I have the following issue:

Using eas build for ios I get

Screenshot 2024-06-19 at 08 05 30

Steps to reproduce: Note i'm using the Ignite boilerplate v9.7.1 and Expo 51 installed with npx expo install @sentry/react-native

I've followed Use Sentry instructions from Expo and changed the following files:

App.tsx

import * as Sentry from '@sentry/react-native';
import React, { useEffect } from "react";
import App from "./app/app";
import * as SplashScreen from "expo-splash-screen";
import { AppState } from 'react-native';

Sentry.init({
  enabled: __DEV__,
  dsn: 'https://b66ce6f2ff860cc5fddb62ec520b2e5c@o4507448438947840.ingest.de.sentry.io/4507448441897040',
  // Set tracesSampleRate to 1.0 to capture 100% of transactions for performance monitoring.
  // We recommend adjusting this value in production.
  tracesSampleRate: 1.0,
  _experiments: {
    // profilesSampleRate is relative to tracesSampleRate.
    // Here, we'll capture profiles for 100% of transactions.
    profilesSampleRate: 1.0,
  },
});

function IgniteApp() {
  useEffect(() => {
    SplashScreen.preventAutoHideAsync();

    const subscription = AppState.addEventListener('change', handleAppStateChange);

    return () => {
      subscription.remove();
    };
  }, []);

  const handleAppStateChange = (nextAppState: string) => {
    if (nextAppState === 'background' || nextAppState === 'inactive') {
    }
  };

  return <App hideSplashScreen={SplashScreen.hideAsync} />
}

export default Sentry.wrap(IgniteApp);

i've added this to app.json

 "plugins": [
    "expo-localization",
    [
      "expo-build-properties",
      {
        "ios": {
          "newArchEnabled": false
        },
        "android": {
          "newArchEnabled": false
        }
      }
    ],
    "expo-font",
    [
    "@sentry/react-native/expo",
      {
        "note": "SENTRY_AUTH_TOKEN",
        "project": "SENTRY_PROJECT",
        "organization": "SENTRY_ORGANISATION"
      }
    ]
  ],

metro.config.js

// Learn more https://docs.expo.io/guides/customizing-metro
const { getSentryExpoConfig } = require('@sentry/react-native/metro');
/** @type {import('expo/metro-config').MetroConfig} */
const config = getSentryExpoConfig(__dirname);

config.transformer.getTransformOptions = async () => ({
  transform: {
    // Inline requires are very useful for deferring loading of large dependencies/components.
    // For example, we use it in app.tsx to conditionally load Reactotron.
    // However, this comes with some gotchas.
    // Read more here: https://reactnative.dev/docs/optimizing-javascript-loading
    // And here: https://github.com/expo/expo/issues/27279#issuecomment-1971610698
    inlineRequires: true,
  },
});

// This helps support certain popular third-party libraries
// such as Firebase that use the extension cjs.
config.resolver.sourceExts.push("cjs")

module.exports = config;

and i'm using eas secrets to store my credentials in eas.json: "production": { "env": {

    "SENTRY_AUTH_TOKEN": "@SENTRY_AUTH_TOKEN",
    "SENTRY_PROJECT": "@SENTRY_PROJECT",
    "SENTRY_ORGANISATION": "@SENTRY_ORGANISATION"
  },
  "android": {
    "image": "latest"
  },
  "ios": {
    "image": "latest"
  },
  "channel": "production"
}

},

the sentry docs here https://docs.sentry.io/platforms/react-native/manual-setup/expo/ have some other additons I've tried too:

import { ExpoConfig, ConfigContext } from "@expo/config"
import { withSentry } from "@sentry/react-native/expo";

/**
 * Use ts-node here so we can use TypeScript for our Config Plugins
 * and not have to compile them to JavaScript
 */
require("ts-node/register")

/**
 * @param config ExpoConfig coming from the static config app.json if it exists
 * 
 * You can read more about Expo's Configuration Resolution Rules here:
 * https://docs.expo.dev/workflow/configuration/#configuration-resolution-rules
 */
module.exports = ({ config }: ConfigContext): Partial<ExpoConfig> => {
  const existingPlugins = config.plugins ?? []

  return {
    ...config,
    android: {
      ...config.android,
      // Use the secret for google-services.json
      googleServicesFile: process.env.GOOGLE_SERVICES_JSON,
    },
    ios: {
      ...config.ios,
      infoPlist: {
        ...config.ios?.infoPlist,
        UIBackgroundModes: [
          ...(config.ios?.infoPlist?.UIBackgroundModes || []),
          'remote-notification', 'fetch'
        ],
      },
      // Use the secret for GoogleService-Info.plist
      googleServicesFile: process.env.GOOGLE_SERVICES_INFO_PLIST,
    },
    extra: {
      eas: {
        projectId: "xxx"
      }
    },
    plugins: [
      ...existingPlugins,
      require("./plugins/withSplashScreen").withSplashScreen,
      withSentry, // Added withSentry plugin
    ],
    updates: {
      url: "xxx"
    },
    runtimeVersion: {
      policy: "appVersion"
    }
  }
}

const config: ExpoConfig = {
  name: "xxx",
  slug: "xxx",
};

export default withSentry(config, {
  url: "https://sentry.io/",
  // Use SENTRY_AUTH_TOKEN env to authenticate with Sentry.
  project: "SENTRY_PROJECT",
  organization: "SENTRY_ORGANISATION",
});

I've redacted my name, slug, updates url and eas projectid etc

Actual result:

see issue above

Expected result:

a successful build.

kahest commented 3 months ago

@overhearapp thanks for reporting - when did this happen, and does the problem persist? We're investigating an issue with the /projects endpoint that could've caused this and should be resolved already.

overhearapp commented 3 months ago

its been happening the past few days. This is my first attempt at using Sentry so i don't have a previous success to compare to.

kahest commented 3 months ago

Thanks for the quick reply - this is not related to the endpoint then. We'll need to take a closer look, thanks for providing a lot of context!

Btw. please make sure you don't set the auth token in your app.json (see "note": "SENTRY_AUTH_TOKEN", above) - you probably don't, just wanted to make sure.

overhearapp commented 3 months ago

additionally I see that Ignite provides this also:

/**
 * If you're using Sentry
 *   Expo https://docs.expo.dev/guides/using-sentry/
 */
import * as Sentry from "@sentry/react-native"

/**
 * If you're using Crashlytics: https://rnfirebase.io/crashlytics/usage
 */
// import crashlytics from "@react-native-firebase/crashlytics"

/**
 * If you're using Bugsnag:
 *   RN   https://docs.bugsnag.com/platforms/react-native/)
 *   Expo https://docs.bugsnag.com/platforms/react-native/expo/
 */
// import Bugsnag from "@bugsnag/react-native"
// import Bugsnag from "@bugsnag/expo"

/**
 *  This is where you put your crash reporting service initialization code to call in `./app/app.tsx`
 */
export const initCrashReporting = () => {
  Sentry.init({
    dsn: "MY_DSN",
    debug: true, // If `true`, Sentry will try to print out useful debugging information if something goes wrong with sending the event. Set it to `false` in production
  })
  // Bugsnag.start("YOUR API KEY")
}

/**
 * Error classifications used to sort errors on error reporting services.
 */
export enum ErrorType {
  /**
   * An error that would normally cause a red screen in dev
   * and force the user to sign out and restart.
   */
  FATAL = "Fatal",
  /**
   * An error caught by try/catch where defined using Reactotron.tron.error.
   */
  HANDLED = "Handled",
}

/**
 * Manually report a handled error.
 */
export const reportCrash = (error: Error, type: ErrorType = ErrorType.FATAL) => {
  if (__DEV__) {
    // Log to console and Reactotron in development
    const message = error.message || "Unknown"
    console.error(error)
    console.log(message, type)
  } else {
    // In production, utilize crash reporting service of choice below:
    // RN
    Sentry.captureException(error)
    // crashlytics().recordError(error)
    // Bugsnag.notify(error)
  }
}

DSN redacted.

however if i use this instead of changing App.tsx i still get the same issue.

if my

    "SENTRY_AUTH_TOKEN": "@SENTRY_AUTH_TOKEN",
    "SENTRY_PROJECT": "@SENTRY_PROJECT",
    "SENTRY_ORGANISATION": "@SENTRY_ORGANISATION"

  somehow have typos, which i'm pretty sure they don't. would that trigger the error i have above?

  also double checking this contains my organisation slug
Screenshot 2024-06-19 at 11 02 50

and this my project slug?

Screenshot 2024-06-19 at 11 04 23
kahest commented 3 months ago

Yes this is where you can look up your Organisation and Project slugs. If you're logged into https://sentry.io and navigate to https://docs.sentry.io/platforms/react-native/manual-setup/expo/ the code snippets will also pre-populate with correct values - you can use that to double-check. Also if the token is incorrect you should get a different error.

Screenshot 2024-06-19 at 12 11 30

Are you on US or EU servers? If you're on EU, you might wanna try a newer version of the SDK which bundles a newer version of our sentry-cli with some compatibility fixes for the EU data region.

overhearapp commented 3 months ago

I'm on EU servers. I've updated the SDK using the wizard. now I'm getting this error instead.

Screenshot 2024-06-19 at 12 26 42

i notice that the wizard updated my metro.config.js with:

// Learn more https://docs.expo.io/guides/customizing-metro
const { getSentryExpoConfig } = require('@sentry/react-native/metro');

const {
  withSentryConfig
} = require("@sentry/react-native/metro");

/** @type {import('expo/metro-config').MetroConfig} */
const config = getSentryExpoConfig(__dirname);

config.transformer.getTransformOptions = async () => ({
  transform: {
    // Inline requires are very useful for deferring loading of large dependencies/components.
    // For example, we use it in app.tsx to conditionally load Reactotron.
    // However, this comes with some gotchas.
    // Read more here: https://reactnative.dev/docs/optimizing-javascript-loading
    // And here: https://github.com/expo/expo/issues/27279#issuecomment-1971610698
    inlineRequires: true,
  },
});

// This helps support certain popular third-party libraries
// such as Firebase that use the extension cjs.
config.resolver.sourceExts.push("cjs")

module.exports = withSentryConfig(config);
krystofwoldrich commented 3 months ago

Hi @overhearapp, your previous configuration was correct, @sentry/wizard is not yet compatible with Expo projects.

The Upload Debug Symbols to Sentry build stage uploads native debug files, source maps are uploaded during bundling JS.

To avoid the failed build due to failed upload you can temporarily use SENTRY_ALLOW_FAILURE=true.

I was unable to reproduce the same error (using eu org and org token), to investigate further can you use your previous configuration (https://docs.sentry.io/platforms/react-native/manual-setup/expo/) and add the following env SENTRY_CLI_EXTRA_ARGS="--force-foreground --log-level=debug" and share the output of the failed build phase with us.

krystofwoldrich commented 2 months ago

Closing this due to inactivity. If this is still an issue feel free to comment here or open a new issue if the context changed.