Update React Native Onboarding (#85743)

getsentry · Feb 25, 2025 · ab65e3e · ab65e3e
1 parent af4ab9b
commit ab65e3e
Show file tree

Hide file tree

Showing 3 changed files with 375 additions and 251 deletions.
diff --git a/static/app/gettingStartedDocs/react-native/react-native.spec.tsx b/static/app/gettingStartedDocs/react-native/react-native.spec.tsx
@@ -3,52 +3,86 @@ import {screen} from 'sentry-test/reactTestingLibrary';
 import {textWithMarkupMatcher} from 'sentry-test/utils';
 
 import {ProductSolution} from 'sentry/components/onboarding/gettingStartedDoc/types';
-
-import docs from './react-native';
+import docs, {
+  InstallationMode,
+} from 'sentry/gettingStartedDocs/react-native/react-native';
 
 describe('getting started with react-native', function () {
+  it('renders manual installation docs correctly', function () {
+    renderWithOnboardingLayout(docs, {
+      selectedOptions: {
+        installationMode: InstallationMode.MANUAL,
+      },
+    });
+
+    // For manual install, we should see "Install SDK Package" instead of "Install"
+    expect(
+      screen.getByRole('heading', {name: 'Install SDK Package'})
+    ).toBeInTheDocument();
+    expect(screen.getByRole('heading', {name: 'Configure SDK'})).toBeInTheDocument();
+    expect(screen.getByRole('heading', {name: 'Verify'})).toBeInTheDocument();
+  });
+
+  it('renders auto installation docs correctly', function () {
+    renderWithOnboardingLayout(docs, {
+      selectedOptions: {
+        installationMode: InstallationMode.AUTO,
+      },
+    });
+
+    // For auto install, we should see "Install" and no configure/verify sections
+    expect(screen.getByRole('heading', {name: 'Install'})).toBeInTheDocument();
+    expect(
+      screen.queryByRole('heading', {name: 'Configure SDK'})
+    ).not.toBeInTheDocument();
+    expect(screen.queryByRole('heading', {name: 'Verify'})).not.toBeInTheDocument();
+  });
+
   it('renders errors onboarding docs correctly', function () {
-    renderWithOnboardingLayout(docs);
+    renderWithOnboardingLayout(docs, {
+      selectedOptions: {
+        installationMode: InstallationMode.MANUAL,
+      },
+      selectedProducts: [ProductSolution.PERFORMANCE_MONITORING],
+    });
 
     // Renders main headings
-    expect(screen.getByRole('heading', {name: 'Install'})).toBeInTheDocument();
+    expect(
+      screen.getByRole('heading', {name: 'Install SDK Package'})
+    ).toBeInTheDocument();
     expect(screen.getByRole('heading', {name: 'Configure SDK'})).toBeInTheDocument();
     expect(screen.getByRole('heading', {name: 'Verify'})).toBeInTheDocument();
     expect(screen.getByRole('heading', {name: 'Tracing'})).toBeInTheDocument();
     expect(screen.getByRole('heading', {name: 'Debug Symbols'})).toBeInTheDocument();
     expect(screen.getByRole('heading', {name: 'Source Context'})).toBeInTheDocument();
   });
 
-  it('renders performance onboarding docs correctly', async function () {
+  it('renders performance onboarding docs correctly', function () {
     renderWithOnboardingLayout(docs, {
       selectedProducts: [ProductSolution.PERFORMANCE_MONITORING],
+      selectedOptions: {
+        installationMode: InstallationMode.MANUAL,
+      },
     });
 
     expect(
-      await screen.findByText(textWithMarkupMatcher(/tracesSampleRate/))
-    ).toBeInTheDocument();
-    expect(
-      await screen.findByText(
-        textWithMarkupMatcher(/Sentry can measure the performance of your app/)
-      )
+      screen.getByText(textWithMarkupMatcher(/tracesSampleRate/))
     ).toBeInTheDocument();
   });
 
-  it('renders profiling onboarding docs correctly', async function () {
+  it('renders profiling onboarding docs correctly', function () {
     renderWithOnboardingLayout(docs, {
       selectedProducts: [
         ProductSolution.PERFORMANCE_MONITORING,
         ProductSolution.PROFILING,
       ],
+      selectedOptions: {
+        installationMode: InstallationMode.MANUAL,
+      },
     });
 
     expect(
-      await screen.findByText(textWithMarkupMatcher(/profilesSampleRate/))
-    ).toBeInTheDocument();
-    expect(
-      await screen.findByText(
-        textWithMarkupMatcher(/React Native Profiling is available/)
-      )
+      screen.getByText(textWithMarkupMatcher(/profilesSampleRate/))
     ).toBeInTheDocument();
   });
 });