PageSourceSearch

https://shakacode.com/component---src-template-doc-article-tsx-con…ting-and-tracing-md-31fbe10e919025ea710d.js

js shakacode.com collected 2026-10-04 00:26:38 UTC 34,778 bytes, 2 lines download raw bytes

1"use strict";(self.webpackChunkgatsby_starter_default=self.webpackChunkgatsby_starter_default||[]).push([[1957],{63258:function(n,a,e){e.r(a),e.d(a,{Head:function(){return h},default:function(){return k}});var s=e(28453),t=e(96540);function o(n){const a=Object.assign({h1:"h1",a:"a",span:"span",blockquote:"blockquote",p:"p",strong:"strong",h2:"h2",ol:"ol",li:"li",ul:"ul",h3:"h3"},(0,s.R)(),n.components);return t.createElement(t.Fragment,null,t.createElement(a.h1,{id:"error-reporting-and-tracing",style:{position:"relative"}},t.createElement(a.a,{href:"#error-reporting-and-tracing","aria-label":"error reporting and tracing permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Error Reporting and Tracing"),"\n",t.createElement(a.blockquote,null,"\n",t.createElement(a.p,null,t.createElement(a.strong,null,"Pro Feature")," — Available with ",t.createElement(a.a,{href:"/linked-assets/5f3eacdd52b97cebdce257aa7836a6e1/react-on-rails-pro.md"},"React on Rails Pro"),".\nFree in development, test, CI, and staging, and in production for small organizations, charities, schools, and hospitals; larger organizations subscribe at ",t.createElement(a.a,{href:"https://pro.reactonrails.com/"},"https://pro.reactonrails.com/")," ($1,800 per year per organization). No license key is needed to run Pro."),"\n"),"\n",t.createElement(a.p,null,"For versions before 4.0.0, error reporting was configured via ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">honeybadgerApiKey</code>'}})," and ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">sentryDsn</code>'}})," options. These options were removed in 4.0.0 and will cause an error if used. See the current integration approach below."),"\n",t.createElement(a.p,null,"To integrate with error reporting and tracing services,\nyou need a custom configuration script as described in ",t.createElement(a.a,{href:"/linked-assets/3f622c8d69dadb55215173974f74c90e/js-configuration.md"},"Node Renderer JavaScript Configuration"),"."),"\n",t.createElement(a.p,null,"It should initialize the services according to your requirements and then enable integrations."),"\n",t.createElement(a.h2,{id:"sentry",style:{position:"relative"}},t.createElement(a.a,{href:"#sentry","aria-label":"sentry permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Sentry"),"\n",t.createElement(a.ol,null,"\n",t.createElement(a.li,null,"\n",t.createElement(a.p,null,t.createElement(a.a,{href:"https://docs.sentry.io/platforms/javascript/guides/fastify/"},"Set up Sentry"),". You may create an ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">instrument.js</code>'}})," file as described there and require it in your configuration script, but it is simpler to call ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">Sentry.init</code>'}})," directly in your configuration script."),"\n"),"\n",t.createElement(a.li,null,"\n",t.createElement(a.p,null,"Call ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">Sentry.init</code>'}})," with the desired options according to ",t.createElement(a.a,{href:"https://docs.sentry.io/platforms/javascript/guides/fastify/configuration/"},"the documentation"),"."),"\n"),"\n",t.createElement(a.li,null,"\n",t.createElement(a.p,null,"Then load the integration:"),"\n",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="js"><pre class="language-js"><code class="language-js"><span class="token function">require</span><span class="token punctuation">(</span><span class="token string">
1\'react-on-rails-pro-node-renderer/integrations/sentry\'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre></div>'}}),"\n",t.createElement(a.ul,null,"\n",t.createElement(a.li,null,"Use ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">react-on-rails-pro-node-renderer/integrations/sentry6</code>'}})," instead of ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">.../sentry</code>'}})," for versions of Sentry SDK older than 7.63.0."),"\n",t.createElement(a.li,null,"For Sentry SDK v8+ you can use ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">.init({ fastify: true })</code>'}})," to capture additional Fastify-related information."),"\n"),"\n"),"\n"),"\n",t.createElement(a.h3,{id:"sentry-tracing",style:{position:"relative"}},t.createElement(a.a,{href:"#sentry-tracing","aria-label":"sentry tracing permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Sentry Tracing"),"\n",t.createElement(a.p,null,"To enable Sentry Tracing:"),"\n",t.createElement(a.ol,null,"\n",t.createElement(a.li,null,"Include ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">enableTracing</code>'}}),", ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">tracesSampleRate</code>'}}),", or ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">tracesSampler</code>'}})," in your ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">Sentry.init</code>'}})," call. See ",t.createElement(a.a,{href:"https://docs.sentry.io/platforms/javascript/tracing/"},"the Sentry documentation")," for details, but ignore ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">Sentry.browserTracingIntegration()</code>'}}),"."),"\n",t.createElement(a.li,null,"Depending on your Sentry SDK version:","\n",t.createElement(a.ul,null,"\n",t.createElement(a.li,null,"if it is older than 7.63.0, install ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">@sentry/tracing</code>'}})," as well as ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">@sentry/node</code>'}})," (with the same exact version) and pass ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">integrations: [new Sentry.Integrations.Http({ tracing: true })]</code>'}})," to ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">Sentry.init</code>'}}),"."),"\n",t.createElement(a.li,null,"for newer v7.x.y, pass ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">integrations: Sentry.autoDiscoverNodePerformanceMonitoringIntegrations()</code>'}}),"."),"\n",t.createElement(a.li,null,"for v8.x.y, Node HTTP tracing is included by default."),"\n"),"\n"),"\n",t.createElement(a.li,null,"Pass ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">{ tracing: true }</code>'}})," to the ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">init</code>'}})," function of the integration. It can be combined with ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">fastify: true</code>'}}),"."),"\n"),"\n",t.createElement(a.h3,{id:"sentry-profiling",style:{position:"relative"}}
1,t.createElement(a.a,{href:"#sentry-profiling","aria-label":"sentry profiling permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Sentry Profiling"),"\n",t.createElement(a.p,null,t.createElement(a.a,{href:"https://docs.sentry.io/platforms/javascript/guides/fastify/profiling/"},"Follow this documentation"),"."),"\n",t.createElement(a.h2,{id:"honeybadger",style:{position:"relative"}},t.createElement(a.a,{href:"#honeybadger","aria-label":"honeybadger permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Honeybadger"),"\n",t.createElement(a.ol,null,"\n",t.createElement(a.li,null,"\n",t.createElement(a.p,null,t.createElement(a.a,{href:"https://docs.honeybadger.io/lib/javascript/integration/node/"},"Set up Honeybadger"),". Call ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">Honeybadger.configure</code>'}})," with the desired options in the configuration script."),"\n"),"\n",t.createElement(a.li,null,"\n",t.createElement(a.p,null,"Then load the integration:"),"\n",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="js"><pre class="language-js"><code class="language-js"><span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'react-on-rails-pro-node-renderer/integrations/honeybadger\'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre></div>'}}),"\n",t.createElement(a.p,null,"Use ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">init({ fastify: true })</code>'}})," to capture additional Fastify-related information."),"\n"),"\n"),"\n",t.createElement(a.h2,{id:"other-services",style:{position:"relative"}},t.createElement(a.a,{href:"#other-services","aria-label":"other services permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Other services"),"\n",t.createElement(a.p,null,"You can create your own integrations in the same way as the provided ones.\nYou can use ",t.createElement(a.a,{href:"https://github.com/shakacode/react_on_rails/tree/main/packages/react-on-rails-pro-node-renderer/src/integrations"},"the built-in implementations")," as examples.\nImport these functions from ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">react-on-rails-pro-node-renderer/integrations/api</code>'}}),":"),"\n",t.createElement(a.h3,{id:"error-reporting-services",style:{position:"relative"}}
1,t.createElement(a.a,{href:"#error-reporting-services","aria-label":"error reporting services permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Error reporting services"),"\n",t.createElement(a.ul,null,"\n",t.createElement(a.li,null,t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">addErrorNotifier</code>'}})," and ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">addMessageNotifier</code>'}})," tell React on Rails Pro how to report errors to your chosen service."),"\n",t.createElement(a.li,null,"Use ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">addNotifier</code>'}})," if the service uses the same reporting function for both JavaScript ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">Error</code>'}}),"s and string messages."),"\n"),"\n",t.createElement(a.p,null,"For example, integrating with BugSnag can be as simple as"),"\n",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="js"><pre class="language-js"><code class="language-js"><span class="token keyword">const</span> Bugsnag <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'@bugsnag/js\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token keyword">const</span> <span class="token punctuation">{</span> addNotifier <span class="token punctuation">}</span> <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'react-on-rails-pro-node-renderer/integrations/api\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n\nBugsnag<span class="token punctuation">.</span><span class="token function">start</span><span class="token punctuation">(</span><span class="token punctuation">{</span>\n  <span class="token comment">/* your options */</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n\n<span class="token function">addNotifier</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">msg</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n  Bugsnag<span class="token punctuation">.</span><span class="token function">notify</span><span class="token punctuation">(</span>msg<span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre></div>'}}),"\n",t.createElement(a.h3,{id:"tracing-services",style:{position:"relative"}},t.createElement(a.a,{href:"#tracing-services","aria-label":"tracing services permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Tracing services"),"\n",t.createElement(a.ul,null,"\n",t.createElement(a.li,null,t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">setupTracing</code>'}})," takes an object with two properties:","\n",t.createElement(a.ul,null,"\n",t.createElement(a.li,null,t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">executor</code>'}})," should wrap an async function in the service's unit of work."),"\n",t.createElement(a.li,null,"Since the only units of work we currently track are rendering requests, the options to start them are specified in ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">startSsrRequestOptions</code>'}}),"."),"\n"),"\n"),"\n"),"\n",t.createElement(a.p,null,"To track requests as sessions in BugSnag 8.x+,\nthe above example becomes"),"\n",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="js"><pre class="language-js"><code class="language-js"><span class="token keyword">const</span> Bugsnag <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'@bugsnag/js\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token keyword">const</span> <span class="token punctuation">{</span> addNotifier<span class="token punctuation">,</span>
1 setupTracing <span class="token punctuation">}</span> <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'react-on-rails-pro-node-renderer/integrations/api\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n\nBugsnag<span class="token punctuation">.</span><span class="token function">start</span><span class="token punctuation">(</span><span class="token punctuation">{</span>\n  <span class="token comment">/* your options */</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n\n<span class="token function">addNotifier</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">msg</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n  Bugsnag<span class="token punctuation">.</span><span class="token function">notify</span><span class="token punctuation">(</span>msg<span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token function">setupTracing</span><span class="token punctuation">(</span><span class="token punctuation">{</span>\n  <span class="token function-variable function">executor</span><span class="token operator">:</span> <span class="token keyword">async</span> <span class="token punctuation">(</span><span class="token parameter">fn</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n    Bugsnag<span class="token punctuation">.</span><span class="token function">startSession</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token keyword">try</span> <span class="token punctuation">{</span>\n      <span class="token keyword">return</span> <span class="token keyword">await</span> <span class="token function">fn</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token punctuation">}</span> <span class="token keyword">finally</span> <span class="token punctuation">{</span>\n      Bugsnag<span class="token punctuation">.</span><span class="token function">pauseSession</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token punctuation">}</span>\n  <span class="token punctuation">}</span><span class="token punctuation">,</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre></div>'}}),"\n",t.createElement(a.p,null,"You can optionally add ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">startSsrRequestOptions</code>'}})," property to capture the request data:"),"\n",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="js"><pre class="language-js"><code class="language-js"><span class="token function">setupTracing</span><span class="token punctuation">(</span><span class="token punctuation">{</span>\n  <span class="token function-variable function">startSsrRequestOptions</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> renderingRequest <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">bugsnag</span><span class="token operator">:</span> <span class="token punctuation">{</span> renderingRequest <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>\n  <span class="token function-variable function">executor</span><span class="token operator">:</span> <span class="token keyword">async</span> <span class="token punctuation">(</span><span class="token parameter">fn<span class="token punctuation">,</span> <span class="token punctuation">{</span> bugsnag <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n    Bugsnag<span class="token punctuation">.</span><span class="token function">startSession</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token comment">// bugsnag will look like { renderingRequest }</span>\n    Bugsnag<span class="token punctuation">.</span><span class="token function">leaveBreadcrumb</span><span class="token punctuation">(</span><span class="token string">\'SSR request\'</span><span class="token punctuation">,</span>
1 bugsnag<span class="token punctuation">,</span> <span class="token string">\'request\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token keyword">try</span> <span class="token punctuation">{</span>\n      <span class="token keyword">return</span> <span class="token keyword">await</span> <span class="token function">fn</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token punctuation">}</span> <span class="token keyword">finally</span> <span class="token punctuation">{</span>\n      Bugsnag<span class="token punctuation">.</span><span class="token function">pauseSession</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token punctuation">}</span>\n  <span class="token punctuation">}</span><span class="token punctuation">,</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre></div>'}}),"\n",t.createElement(a.p,null,"Bugsnag v7 is a bit more complicated:"),"\n",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="js"><pre class="language-js"><code class="language-js"><span class="token keyword">const</span> Bugsnag <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'@bugsnag/js\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token keyword">const</span> <span class="token punctuation">{</span> addNotifier<span class="token punctuation">,</span> setupTracing <span class="token punctuation">}</span> <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'react-on-rails-pro-node-renderer/integrations/api\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n\nBugsnag<span class="token punctuation">.</span><span class="token function">start</span><span class="token punctuation">(</span><span class="token punctuation">{</span>\n  <span class="token comment">/* your options */</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n\n<span class="token function">addNotifier</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">msg<span class="token punctuation">,</span> <span class="token punctuation">{</span> bugsnag <span class="token operator">=</span> Bugsnag <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n  bugsnag<span class="token punctuation">.</span><span class="token function">notify</span><span class="token punctuation">(</span>msg<span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token function">setupTracing</span><span class="token punctuation">(</span><span class="token punctuation">{</span>\n  <span class="token function-variable function">executor</span><span class="token operator">:</span> <span class="token keyword">async</span> <span class="token punctuation">(</span><span class="token parameter">fn</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n    <span class="token keyword">const</span> bugsnag <span class="token operator">=</span> Bugsnag<span class="token punctuation">.</span><span class="token function">startSession</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token keyword">try</span> <span class="token punctuation">{</span>
1\n      <span class="token keyword">return</span> <span class="token keyword">await</span> <span class="token function">fn</span><span class="token punctuation">(</span><span class="token punctuation">{</span> bugsnag <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token punctuation">}</span> <span class="token keyword">finally</span> <span class="token punctuation">{</span>\n      bugsnag<span class="token punctuation">.</span><span class="token function">pauseSession</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token punctuation">}</span>\n  <span class="token punctuation">}</span><span class="token punctuation">,</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre></div>'}}),"\n",t.createElement(a.h3,{id:"fastify-integrations",style:{position:"relative"}},t.createElement(a.a,{href:"#fastify-integrations","aria-label":"fastify integrations permalink",className:"anchor before"},t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" height="20" version="1.1" viewBox="0 0 16 16" width="20"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}})),"Fastify integrations"),"\n",t.createElement(a.p,null,"If you want to report HTTP requests from Fastify, you can use ",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">configureFastify</code>'}})," to add hooks or plugins as necessary.\nExtending the above example:"),"\n",t.createElement(a.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="js"><pre class="language-js"><code class="language-js"><span class="token keyword">const</span> <span class="token punctuation">{</span> configureFastify <span class="token punctuation">}</span> <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">\'react-on-rails-pro-node-renderer/integrations/api\'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n\n<span class="token function">configureFastify</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">app</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n  app<span class="token punctuation">.</span><span class="token function">addHook</span><span class="token punctuation">(</span><span class="token string">\'onError\'</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">_req<span class="token punctuation">,</span> _reply<span class="token punctuation">,</span> error<span class="token punctuation">,</span> done</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>\n    Bugsnag<span class="token punctuation">.</span><span class="token function">notify</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span><span class="token punctuation">;</span>\n    <span class="token function">done</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n  <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>\n<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre></div>'}}),"\n",t.createElement(a.p,null,"You could also treat Fastify requests as sessions\nusing ",t.createElement(a.a,{href:"https://fastify.dev/docs/latest/Reference/Hooks/#onrequest"}
1,"onRequest"),"\nor ",t.createElement(a.a,{href:"https://fastify.dev/docs/latest/Reference/Hooks/#prehandler"},"preHandler")," hooks."),"\n",t.createElement(a.p,null,"It isn't recommended to use the ",t.createElement(a.a,{href:"https://github.com/ZigaStrgar/fastify-bugsnag"},"fastify-bugsnag")," plugin\nsince it wants to start Bugsnag on its own."))}var c=function(n){void 0===n&&(n={});const{wrapper:a}=Object.assign({},(0,s.R)(),n.components);return a?t.createElement(a,n,t.createElement(o,n)):o(n)},p=e(63679),l=e(95197),r=e(47388),i=e(23690),u=e(14487);const g=p.default.p.withConfig({displayName:"doc-article__RedirectFallback",componentId:"sc-tic2w5-0"})(["padding:2rem;"]),d=n=>{let{data:a,location:e,children:s}=n;const{headings:o}=a.article.childMdx,c=(0,l.X9)(e.pathname),[p,i]=t.useState(null),d=e.pathname.split("/"),k=d.indexOf("docs"),h=-1===k?e.pathname.length:d.slice(0,k+1).join("/").length,m=e.pathname.slice(0,h),f=e.pathname.slice(h+1).replace(/\/$/,"").split("/").filter((n=>""!==n)),y=f.length>1?f.slice(0,-1).join("/"):"";t.useEffect((()=>{if(!c)return;const{hash:n}=window.location;i(n);const a=""+c+n;window.location.href!==a&&window.location.replace(a)}),[c]);const E=null===c||null===p?null:""+c+p;return t.createElement(t.Fragment,null,null!==E?t.createElement(g,{role:"status","aria-live":"polite"},"Redirecting..."," ",t.createElement("a",{href:E,target:"_blank",rel:"noopener noreferrer"},"Click here if not redirected.")):t.createElement(r.A,{main:t.createElement(u.A,{body:s,headings:o,transformUrl:n=>{if(n.startsWith("http")||n.startsWith("#"))return n;const a=n.replace(/\.md$/,"/");if(a.startsWith("./"))return m+(""===y?"":"/"+y)+a.slice(1);if(a.startsWith("../")){if(""===y)return""+m+a.slice(2);const n=y.split("/").slice(0,-1).join("/");return m+(""===n?"":"/"+n)+a.slice(2)}return m+"/"+(""===y?"":y+"/")+a}})}))};function k(n){return t.createElement(d,n,t.createElement(c,n))}const h=n=>{let{data:a,location:e,pageContext:s}=n;const{headings:o}=a.article.childMdx,{siteUrl:c}=a.site.siteMetadata,{repoDisplayName:p}=s,r=o.find((n=>1===n.depth)),u=(0,l.X9)(e.pathname)||""+c.replace(/\/+$/,"")+e.pathname;return t.createElement(i.A,{title:r?r.value:p,description:r?r.value:p+" documentation",isArticle:!0,canonical:u,pathname:e.pathname})}}}]);
2//# sourceMappingURL=component---src-template-doc-article-tsx-content-file-path-cache-gatsby-source-git-react-on-rails-docs-oss-building-features-node-renderer-error-reporting-and-tracing-md-31fbe10e919025ea710d.js.map

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.