electron.tsx 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  1. import ExternalLink from 'sentry/components/links/externalLink';
  2. import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step';
  3. import type {
  4. Docs,
  5. DocsParams,
  6. OnboardingConfig,
  7. } from 'sentry/components/onboarding/gettingStartedDoc/types';
  8. import {
  9. getReplayConfigureDescription,
  10. getReplaySDKSetupSnippet,
  11. getUploadSourceMapsStep,
  12. } from 'sentry/components/onboarding/gettingStartedDoc/utils';
  13. import {t, tct} from 'sentry/locale';
  14. type Params = DocsParams;
  15. const getConfigureSnippet = (params: Params) => `
  16. import * as Sentry from "@sentry/electron";
  17. Sentry.init({
  18. dsn: "${params.dsn}",
  19. });`;
  20. const getInstallConfig = () => [
  21. {
  22. code: [
  23. {
  24. label: 'npm',
  25. value: 'npm',
  26. language: 'bash',
  27. code: 'npm install --save @sentry/electron',
  28. },
  29. {
  30. label: 'yarn',
  31. value: 'yarn',
  32. language: 'bash',
  33. code: 'yarn add @sentry/electron',
  34. },
  35. ],
  36. },
  37. ];
  38. const onboarding: OnboardingConfig = {
  39. install: () => [
  40. {
  41. type: StepType.INSTALL,
  42. description: t('Add the Sentry Electron SDK package as a dependency:'),
  43. configurations: getInstallConfig(),
  44. },
  45. ],
  46. configure: params => [
  47. {
  48. type: StepType.CONFIGURE,
  49. description: tct(
  50. `You need to call [codeInit:Sentry.init] in the [codeMain:main] process and in every [codeRenderer:renderer] process you spawn.
  51. For more details about configuring the Electron SDK [docsLink:click here].`,
  52. {
  53. codeInit: <code />,
  54. codeMain: <code />,
  55. codeRenderer: <code />,
  56. docsLink: (
  57. <ExternalLink href="https://docs.sentry.io/platforms/javascript/guides/electron/" />
  58. ),
  59. }
  60. ),
  61. configurations: [
  62. {
  63. language: 'javascript',
  64. code: getConfigureSnippet(params),
  65. },
  66. ],
  67. },
  68. getUploadSourceMapsStep({
  69. guideLink:
  70. 'https://docs.sentry.io/platforms/javascript/guides/electron/sourcemaps/',
  71. ...params,
  72. }),
  73. ],
  74. verify: () => [
  75. {
  76. type: StepType.VERIFY,
  77. description: t(
  78. `One way to verify your setup is by intentionally causing an error that breaks your application.`
  79. ),
  80. configurations: [
  81. {
  82. description: t(
  83. `Calling an undefined function will throw a JavaScript exception:`
  84. ),
  85. language: 'javascript',
  86. code: 'myUndefinedFunction();',
  87. },
  88. {
  89. description: t(
  90. `With Electron you can test native crash reporting by triggering a crash:`
  91. ),
  92. language: 'javascript',
  93. code: 'process.crash();',
  94. },
  95. ],
  96. additionalInfo: t(
  97. 'You may want to try inserting these code snippets into both your main and any renderer processes to verify Sentry is operational in both.'
  98. ),
  99. },
  100. ],
  101. };
  102. const replayOnboarding: OnboardingConfig = {
  103. install: () => [
  104. {
  105. type: StepType.INSTALL,
  106. description: tct(
  107. 'For the Session Replay to work, you must have the framework SDK (e.g. [code:@sentry/electron]) installed, minimum version 4.2.0.',
  108. {
  109. code: <code />,
  110. }
  111. ),
  112. configurations: getInstallConfig(),
  113. },
  114. ],
  115. configure: (params: Params) => [
  116. {
  117. type: StepType.CONFIGURE,
  118. description: getReplayConfigureDescription({
  119. link: 'https://docs.sentry.io/platforms/javascript/guides/electron/session-replay/',
  120. }),
  121. configurations: [
  122. {
  123. code: [
  124. {
  125. label: 'JavaScript',
  126. value: 'javascript',
  127. language: 'javascript',
  128. code: getReplaySDKSetupSnippet({
  129. importStatement: `import * as Sentry from "@sentry/electron";`,
  130. dsn: params.dsn,
  131. }),
  132. },
  133. ],
  134. },
  135. ],
  136. },
  137. ],
  138. verify: () => [],
  139. nextSteps: () => [],
  140. };
  141. const docs: Docs = {
  142. onboarding,
  143. replayOnboardingNpm: replayOnboarding,
  144. };
  145. export default docs;