From 6e656e1c8536135d5b914d9b4733693c99486f45 Mon Sep 17 00:00:00 2001 From: ArthurKnaus Date: Tue, 7 Nov 2023 14:39:58 +0100 Subject: [PATCH] ref(onboarding): Convert platform apple & apple-macos to new structure (#59412) - relates to https://github.com/getsentry/sentry/issues/56549 --- .../apple/apple-ios.spec.tsx | 2 +- .../apple/apple-macos.spec.tsx | 37 +- .../gettingStartedDocs/apple/apple-macos.tsx | 326 +++++++++--------- .../gettingStartedDocs/apple/apple.spec.tsx | 37 +- static/app/gettingStartedDocs/apple/apple.tsx | 209 +---------- 5 files changed, 216 insertions(+), 395 deletions(-) diff --git a/static/app/gettingStartedDocs/apple/apple-ios.spec.tsx b/static/app/gettingStartedDocs/apple/apple-ios.spec.tsx index 45bda1c8836af4..846a99097b6e0b 100644 --- a/static/app/gettingStartedDocs/apple/apple-ios.spec.tsx +++ b/static/app/gettingStartedDocs/apple/apple-ios.spec.tsx @@ -4,7 +4,7 @@ import {screen} from 'sentry-test/reactTestingLibrary'; import docs from './apple-ios'; describe('apple-ios onboarding docs', function () { - it('renders gradle docs correctly', function () { + it('renders docs correctly', function () { renderWithOnboardingLayout(docs); // Renders main headings diff --git a/static/app/gettingStartedDocs/apple/apple-macos.spec.tsx b/static/app/gettingStartedDocs/apple/apple-macos.spec.tsx index e800fc508bd587..cd9880fe59a9f5 100644 --- a/static/app/gettingStartedDocs/apple/apple-macos.spec.tsx +++ b/static/app/gettingStartedDocs/apple/apple-macos.spec.tsx @@ -1,18 +1,31 @@ -import {render, screen} from 'sentry-test/reactTestingLibrary'; +import {renderWithOnboardingLayout} from 'sentry-test/onboarding/renderWithOnboardingLayout'; +import {screen} from 'sentry-test/reactTestingLibrary'; +import {textWithMarkupMatcher} from 'sentry-test/utils'; -import {StepTitle} from 'sentry/components/onboarding/gettingStartedDoc/step'; +import docs from './apple-macos'; -import {GettingStartedWithMacos, steps} from './apple-macos'; +describe('apple-macos onboarding docs', function () { + it('renders docs correctly', async function () { + renderWithOnboardingLayout(docs, { + releaseRegistry: { + 'sentry.cocoa': { + version: '1.99.9', + }, + }, + }); -describe('GettingStartedWithMacos', function () { - it('renders doc correctly', function () { - render(); + // Renders main headings + expect(screen.getByRole('heading', {name: 'Install'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Configure SDK'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Verify'})).toBeInTheDocument(); - // Steps - for (const step of steps()) { - expect( - screen.getByRole('heading', {name: step.title ?? StepTitle[step.type]}) - ).toBeInTheDocument(); - } + // Renders SDK version from registry + expect( + await screen.findByText( + textWithMarkupMatcher( + /\.package\(url: "https:\/\/github.com\/getsentry\/sentry-cocoa", from: "1\.99\.9"\),/ + ) + ) + ).toBeInTheDocument(); }); }); diff --git a/static/app/gettingStartedDocs/apple/apple-macos.tsx b/static/app/gettingStartedDocs/apple/apple-macos.tsx index 71772ec9f0b92f..560d6dde01bd74 100644 --- a/static/app/gettingStartedDocs/apple/apple-macos.tsx +++ b/static/app/gettingStartedDocs/apple/apple-macos.tsx @@ -1,77 +1,23 @@ import ExternalLink from 'sentry/components/links/externalLink'; -import {Layout, LayoutProps} from 'sentry/components/onboarding/gettingStartedDoc/layout'; -import {ModuleProps} from 'sentry/components/onboarding/gettingStartedDoc/sdkDocumentation'; import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step'; +import type { + Docs, + DocsParams, + OnboardingConfig, +} from 'sentry/components/onboarding/gettingStartedDoc/types'; import {t, tct} from 'sentry/locale'; +import {getPackageVersion} from 'sentry/utils/gettingStartedDocs/getPackageVersion'; -// Configuration Start -export const steps = ({ - dsn, - sourcePackageRegistries, -}: Partial< - Pick -> = {}): LayoutProps['steps'] => [ - { - type: StepType.INSTALL, - description: ( -

- {tct( - 'We recommend installing the SDK with Swift Package Manager (SPM), but we also support [alternateMethods: alternate installation methods]. To integrate Sentry into your Xcode project using SPM, open your App in Xcode and open [addPackage: File > Add Packages]. Then add the SDK by entering the Git repo url in the top right search field:', - { - alternateMethods: ( - - ), - addPackage: , - } - )} -

- ), - configurations: [ - { - language: 'text', - code: ` -https://github.com/getsentry/sentry-cocoa.git - `, - }, - { - description: ( -

- {tct( - 'Alternatively, when your project uses a [packageSwift: Package.swift] file to manage dependencies, you can specify the target with:', - { - packageSwift: , - } - )} -

- ), - language: 'swift', - partialLoading: sourcePackageRegistries?.isLoading, - code: ` -.package(url: "https://github.com/getsentry/sentry-cocoa", from: "${ - sourcePackageRegistries?.isLoading - ? t('\u2026loading') - : sourcePackageRegistries?.data?.['sentry.cocoa']?.version ?? '8.9.3' - }"), - `, - }, - ], - }, - { - type: StepType.CONFIGURE, - description: ( -

- {tct( - 'Make sure you initialize the SDK as soon as possible in your application lifecycle e.g. in your AppDelegate [appDelegate: application:didFinishLaunchingWithOptions] method:', - { - appDelegate: , - } - )} -

- ), - configurations: [ - { - language: 'swift', - code: ` +type Params = DocsParams; + +const getInstallSnippet = (params: Params) => ` +.package(url: "https://github.com/getsentry/sentry-cocoa", from: "${getPackageVersion( + params, + 'sentry.cocoa', + '8.9.3' +)}"),`; + +const getConfigurationSnippet = (params: Params) => ` import Sentry // .... @@ -80,7 +26,7 @@ func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { SentrySDK.start { options in - options.dsn = "${dsn}" + options.dsn = "${params.dsn}" options.debug = true // Enabled debug when first installing is always helpful // Set tracesSampleRate to 1.0 to capture 100% of transactions for performance monitoring. @@ -89,31 +35,16 @@ func application(_ application: UIApplication, } return true -} - `, - }, - { - description: ( -

- {tct( - "When using SwiftUI and your app doesn't implement an app delegate, initialize the SDK within the [initializer: App conformer's initializer]:", - { - initializer: ( - - ), - } - )} -

- ), - language: 'swift', - code: ` +}`; + +const getConfigurationSnippetSwiftUi = (params: Params) => ` import Sentry @main struct SwiftUIApp: App { init() { SentrySDK.start { options in - options.dsn = "${dsn}" + options.dsn = "${params.dsn}" options.debug = true // Enabled debug when first installing is always helpful // Set tracesSampleRate to 1.0 to capture 100% of transactions for performance monitoring. @@ -121,27 +52,9 @@ struct SwiftUIApp: App { options.tracesSampleRate = 1.0 } } -} - `, - }, - ], - }, - { - type: StepType.VERIFY, - description: ( -

- {tct( - 'This snippet contains an intentional error you can use to test that errors are uploaded to Sentry correctly. You can add it to your main [viewController: ViewController].', - { - viewController: , - } - )} -

- ), - configurations: [ - { - language: 'swift', - code: ` +}`; + +const getVerifySnippet = () => ` let button = UIButton(type: .roundedRect) button.frame = CGRect(x: 20, y: 50, width: 100, height: 30) button.setTitle("Break the world", for: []) @@ -150,57 +63,140 @@ view.addSubview(button) @IBAction func breakTheWorld(_ sender: AnyObject) { fatalError("Break the world") -} - `, - }, - ], - }, -]; - -export const nextSteps = [ - { - id: 'cocoapods-carthage', - name: t('CocoaPods/Carthage'), - description: t( - 'Learn about integrating Sentry into your project using CocoaPods or Carthage.' - ), - link: 'https://docs.sentry.io/platforms/apple/install/', - }, - { - id: 'debug-symbols', - name: t('Debug Symbols'), - description: t('Symbolicate and get readable stacktraces in your Sentry errors.'), - link: 'https://docs.sentry.io/platforms/apple/dsym/', - }, - { - id: 'swiftui', - name: t('SwiftUI'), - description: t('Learn about our first class integration with SwiftUI.'), - link: 'https://docs.sentry.io/platforms/apple/performance/instrumentation/swiftui-instrumentation/', - }, - { - id: 'profiling', - name: t('Profiling'), - description: t( - 'Collect and analyze performance profiles from real user devices in production.' - ), - link: 'https://docs.sentry.io/platforms/apple/profiling/', - }, -]; -// Configuration End - -export function GettingStartedWithMacos({ - dsn, - sourcePackageRegistries, - ...props -}: ModuleProps) { - return ( - - ); -} - -export default GettingStartedWithMacos; +}`; + +const onboarding: OnboardingConfig = { + install: params => [ + { + type: StepType.INSTALL, + description: ( +

+ {tct( + 'We recommend installing the SDK with Swift Package Manager (SPM), but we also support [alternateMethods: alternate installation methods]. To integrate Sentry into your Xcode project using SPM, open your App in Xcode and open [addPackage: File > Add Packages]. Then add the SDK by entering the Git repo url in the top right search field:', + { + alternateMethods: ( + + ), + addPackage: , + } + )} +

+ ), + configurations: [ + { + language: 'text', + code: `https://github.com/getsentry/sentry-cocoa.git`, + }, + { + description: ( +

+ {tct( + 'Alternatively, when your project uses a [packageSwift: Package.swift] file to manage dependencies, you can specify the target with:', + { + packageSwift: , + } + )} +

+ ), + language: 'swift', + partialLoading: params.sourcePackageRegistries.isLoading, + code: getInstallSnippet(params), + }, + ], + }, + ], + configure: params => [ + { + type: StepType.CONFIGURE, + description: ( +

+ {tct( + 'Make sure you initialize the SDK as soon as possible in your application lifecycle e.g. in your AppDelegate [appDelegate: application:didFinishLaunchingWithOptions] method:', + { + appDelegate: , + } + )} +

+ ), + configurations: [ + { + language: 'swift', + code: getConfigurationSnippet(params), + }, + { + description: ( +

+ {tct( + "When using SwiftUI and your app doesn't implement an app delegate, initialize the SDK within the [initializer: App conformer's initializer]:", + { + initializer: ( + + ), + } + )} +

+ ), + language: 'swift', + code: getConfigurationSnippetSwiftUi(params), + }, + ], + }, + ], + verify: () => [ + { + type: StepType.VERIFY, + description: ( +

+ {tct( + 'This snippet contains an intentional error you can use to test that errors are uploaded to Sentry correctly. You can add it to your main [viewController: ViewController].', + { + viewController: , + } + )} +

+ ), + configurations: [ + { + language: 'swift', + code: getVerifySnippet(), + }, + ], + }, + ], + nextSteps: () => [ + { + id: 'cocoapods-carthage', + name: t('CocoaPods/Carthage'), + description: t( + 'Learn about integrating Sentry into your project using CocoaPods or Carthage.' + ), + link: 'https://docs.sentry.io/platforms/apple/install/', + }, + { + id: 'debug-symbols', + name: t('Debug Symbols'), + description: t('Symbolicate and get readable stacktraces in your Sentry errors.'), + link: 'https://docs.sentry.io/platforms/apple/dsym/', + }, + { + id: 'swiftui', + name: t('SwiftUI'), + description: t('Learn about our first class integration with SwiftUI.'), + link: 'https://docs.sentry.io/platforms/apple/performance/instrumentation/swiftui-instrumentation/', + }, + { + id: 'profiling', + name: t('Profiling'), + description: t( + 'Collect and analyze performance profiles from real user devices in production.' + ), + link: 'https://docs.sentry.io/platforms/apple/profiling/', + }, + ], +}; + +const docs: Docs = { + onboarding, +}; + +export default docs; diff --git a/static/app/gettingStartedDocs/apple/apple.spec.tsx b/static/app/gettingStartedDocs/apple/apple.spec.tsx index be3e711c44a7fb..956c24880937fb 100644 --- a/static/app/gettingStartedDocs/apple/apple.spec.tsx +++ b/static/app/gettingStartedDocs/apple/apple.spec.tsx @@ -1,18 +1,31 @@ -import {render, screen} from 'sentry-test/reactTestingLibrary'; +import {renderWithOnboardingLayout} from 'sentry-test/onboarding/renderWithOnboardingLayout'; +import {screen} from 'sentry-test/reactTestingLibrary'; +import {textWithMarkupMatcher} from 'sentry-test/utils'; -import {StepTitle} from 'sentry/components/onboarding/gettingStartedDoc/step'; +import docs from './apple'; -import {GettingStartedWithApple, steps} from './apple'; +describe('apple onboarding docs', function () { + it('renders docs correctly', async function () { + renderWithOnboardingLayout(docs, { + releaseRegistry: { + 'sentry.cocoa': { + version: '1.99.9', + }, + }, + }); -describe('GettingStartedWithApple', function () { - it('renders doc correctly', function () { - render(); + // Renders main headings + expect(screen.getByRole('heading', {name: 'Install'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Configure SDK'})).toBeInTheDocument(); + expect(screen.getByRole('heading', {name: 'Verify'})).toBeInTheDocument(); - // Steps - for (const step of steps()) { - expect( - screen.getByRole('heading', {name: step.title ?? StepTitle[step.type]}) - ).toBeInTheDocument(); - } + // Renders SDK version from registry + expect( + await screen.findByText( + textWithMarkupMatcher( + /\.package\(url: "https:\/\/github.com\/getsentry\/sentry-cocoa", from: "1\.99\.9"\),/ + ) + ) + ).toBeInTheDocument(); }); }); diff --git a/static/app/gettingStartedDocs/apple/apple.tsx b/static/app/gettingStartedDocs/apple/apple.tsx index 6c87618736441f..227c4cc339602b 100644 --- a/static/app/gettingStartedDocs/apple/apple.tsx +++ b/static/app/gettingStartedDocs/apple/apple.tsx @@ -1,206 +1,5 @@ -import ExternalLink from 'sentry/components/links/externalLink'; -import {Layout, LayoutProps} from 'sentry/components/onboarding/gettingStartedDoc/layout'; -import {ModuleProps} from 'sentry/components/onboarding/gettingStartedDoc/sdkDocumentation'; -import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step'; -import {t, tct} from 'sentry/locale'; +import docs from './apple-macos'; -// Configuration Start -export const steps = ({ - dsn, - sourcePackageRegistries, -}: Partial< - Pick -> = {}): LayoutProps['steps'] => [ - { - type: StepType.INSTALL, - description: ( -

- {tct( - 'We recommend installing the SDK with Swift Package Manager (SPM), but we also support [alternateMethods: alternate installation methods]. To integrate Sentry into your Xcode project using SPM, open your App in Xcode and open [addPackage: File > Add Packages]. Then add the SDK by entering the Git repo url in the top right search field:', - { - alternateMethods: ( - - ), - addPackage: , - } - )} -

- ), - configurations: [ - { - language: 'text', - code: ` -https://github.com/getsentry/sentry-cocoa.git - `, - }, - { - description: ( -

- {tct( - 'Alternatively, when your project uses a [packageSwift: Package.swift] file to manage dependencies, you can specify the target with:', - { - packageSwift: , - } - )} -

- ), - language: 'swift', - partialLoading: sourcePackageRegistries?.isLoading, - code: ` -.package(url: "https://github.com/getsentry/sentry-cocoa", from: "${ - sourcePackageRegistries?.isLoading - ? t('\u2026loading') - : sourcePackageRegistries?.data?.['sentry.cocoa']?.version ?? '8.9.3' - }"), - `, - }, - ], - }, - { - type: StepType.CONFIGURE, - description: ( -

- {tct( - 'Make sure you initialize the SDK as soon as possible in your application lifecycle e.g. in your AppDelegate [appDelegate: application:didFinishLaunchingWithOptions] method:', - { - appDelegate: , - } - )} -

- ), - configurations: [ - { - language: 'swift', - code: ` -import Sentry - -// .... - -func application(_ application: UIApplication, - didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { - - SentrySDK.start { options in - options.dsn = "${dsn}" - options.debug = true // Enabled debug when first installing is always helpful - - // Set tracesSampleRate to 1.0 to capture 100% of transactions for performance monitoring. - // We recommend adjusting this value in production. - options.tracesSampleRate = 1.0 - } - - return true -} - `, - }, - { - description: ( -

- {tct( - "When using SwiftUI and your app doesn't implement an app delegate, initialize the SDK within the [initializer: App conformer's initializer]:", - { - initializer: ( - - ), - } - )} -

- ), - language: 'swift', - code: ` -import Sentry - -@main -struct SwiftUIApp: App { - init() { - SentrySDK.start { options in - options.dsn = "${dsn}" - options.debug = true // Enabled debug when first installing is always helpful - - // Set tracesSampleRate to 1.0 to capture 100% of transactions for performance monitoring. - // We recommend adjusting this value in production. - options.tracesSampleRate = 1.0 - } - } -} - `, - }, - ], - }, - { - type: StepType.VERIFY, - description: ( -

- {tct( - 'This snippet contains an intentional error you can use to test that errors are uploaded to Sentry correctly. You can add it to your main [viewController: ViewController].', - { - viewController: , - } - )} -

- ), - configurations: [ - { - language: 'swift', - code: ` -let button = UIButton(type: .roundedRect) -button.frame = CGRect(x: 20, y: 50, width: 100, height: 30) -button.setTitle("Break the world", for: []) -button.addTarget(self, action: #selector(self.breakTheWorld(_:)), for: .touchUpInside) -view.addSubview(button) - -@IBAction func breakTheWorld(_ sender: AnyObject) { - fatalError("Break the world") -} - `, - }, - ], - }, -]; - -export const nextSteps = [ - { - id: 'cocoapods-carthage', - name: t('CocoaPods/Carthage'), - description: t( - 'Learn about integrating Sentry into your project using CocoaPods or Carthage.' - ), - link: 'https://docs.sentry.io/platforms/apple/install/', - }, - { - id: 'debug-symbols', - name: t('Debug Symbols'), - description: t('Symbolicate and get readable stacktraces in your Sentry errors.'), - link: 'https://docs.sentry.io/platforms/apple/dsym/', - }, - { - id: 'swiftui', - name: t('SwiftUI'), - description: t('Learn about our first class integration with SwiftUI.'), - link: 'https://docs.sentry.io/platforms/apple/performance/instrumentation/swiftui-instrumentation/', - }, - { - id: 'profiling', - name: t('Profiling'), - description: t( - 'Collect and analyze performance profiles from real user devices in production.' - ), - link: 'https://docs.sentry.io/platforms/apple/profiling/', - }, -]; -// Configuration End - -export function GettingStartedWithApple({ - dsn, - sourcePackageRegistries, - ...props -}: ModuleProps) { - return ( - - ); -} - -export default GettingStartedWithApple; +// apple is the legacy platform key for apple-macos +// So we simply re-export the docs from apple-macos +export default docs;