Merge pull request #5374 from wrighbr/master

Datadog RUM events
2021-04-20 14:47:47 +02:00
parent aa45f8c92b 9b8f596aef
commit 4e7c9d7d16
8 changed files with 124 additions and 2 deletions
@@ -0,0 +1,5 @@
+---
+'@backstage/cli': patch
+---
+
+Added support for Datadog rum events
@@ -13,6 +13,7 @@ Cloudformation
 Codecov
 Codehilite
 Config
+Datadog
 Debounce
 Discoverability
 Dockerfile
@@ -2,6 +2,12 @@ app:
  title: Backstage Example App
  baseUrl: http://localhost:3000
  googleAnalyticsTrackingId: # UA-000000-0
+  datadogRum:
+    clientToken: '123456789'
+    applicationId: qwerty
+  #   site: # datadoghq.eu default = datadoghq.com
+  #   env: # optional
+
  support:
    url: https://github.com/backstage/backstage/issues # Used by common ErrorPage
    items: # Used by common SupportButton component
@@ -0,0 +1,30 @@
+---
+id: installation
+title: Datadog RUM Installation
+sidebar_label: Installation
+# prettier-ignore
+description: Adding Datadog RUM to Your App
+---
+
+There is a basic [Datadog](https://docs.datadoghq.com/real_user_monitoring/)
+integration built into Backstage. You can enable it by adding the following to
+your app configuration:
+
+```yaml
+app:
+  datadogRum:
+    clientToken: '123456789'
+    applicationId: qwerty
+  #   site: # datadoghq.eu default = datadoghq.com
+  #   env: # optional
+```
+
+Replace the clientToken and applicationId with the ones generated for you
+Datadog.
+
+optional arguments:
+
+```
+site: datadoghq.eu # default equals datadoghq.com
+env: dev # allow to specify the environment
+```
@@ -13,6 +13,11 @@ Backstage integrator.
 See how to install Google Analytics in your app
 [here](../integrations/google-analytics/installation.md)

+## Datadog RUM Events
+
+See how to install Datadog Events in your app
+[here](../integrations/datadog-rum/installation.md)
+
 ## Logging

 The backend supplies a central [winston](https://github.com/winstonjs/winston)
@@ -49,8 +49,8 @@
    </style>
    <title><%= app.title %></title>

-    <% if (app.googleAnalyticsTrackingId && typeof app.googleAnalyticsTrackingId
-    === 'string') { %>
+    <% if (app.googleAnalyticsTrackingId && typeof
+    app.googleAnalyticsTrackingId==='string' ) { %>
    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=<%= app.googleAnalyticsTrackingId %>"
@@ -64,8 +64,43 @@

      gtag('config', '<%= app.googleAnalyticsTrackingId %>');
    </script>
+    <% } %> <% if (app.datadogRum.clientToken && app.datadogRum.applicationId )
+    { %>
+    <script>
+      (function (h, o, u, n, d) {
+        h = h[d] = h[d] || {
+          q: [],
+          onReady: function (c) {
+            h.q.push(c);
+          },
+        };
+        d = o.createElement(u);
+        d.async = 1;
+        d.src = n;
+        n = o.getElementsByTagName(u)[0];
+        n.parentNode.insertBefore(d, n);
+      })(
+        window,
+        document,
+        'script',
+        'https://www.datadoghq-browser-agent.com/datadog-rum.js',
+        'DD_RUM',
+      );
+      DD_RUM.onReady(function () {
+        DD_RUM.init({
+          clientToken: '<%= app.datadogRum.clientToken %>',
+          applicationId: '<%= app.datadogRum.applicationId %>',
+          site: '<%= app.datadogRum.site %>' || 'datadoghq.com',
+          service: 'backstage',
+          env: '<%= app.datadogRum.env %>',
+          sampleRate: 100,
+          trackInteractions: true,
+        });
+      });
+    </script>
    <% } %>
  </head>
+
  <body style="margin: 0">
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
@@ -180,6 +180,36 @@
              "UA-000000-0"
            ]
          },
+          "datadogRum": {
+            "type": "object",
+            "description": "Datadog RUM events configuration",
+            "properties": {
+              "env": {
+                "type": "string",
+                "visibility": "frontend",
+                "description": "Environment for Datadog RUM events"
+              },
+              "clientToken": {
+                "type": "string",
+                "visibility": "frontend",
+                "description": "clientToken for Datadog RUM events"
+              },
+              "applicationId": {
+                "type": "string",
+                "visibility": "frontend",
+                "description": "applicationId for Datadog RUM events"
+              },
+              "site": {
+                "type": "string",
+                "visibility": "frontend",
+                "description": "site for Datadog RUM events"
+              }
+            },
+            "required": [
+              "clientToken",
+              "applicationId"
+            ]
+          },
          "listen": {
            "type": "object",
            "description": "Listening configuration for local development",
@@ -127,6 +127,16 @@ export async function createConfig(
          googleAnalyticsTrackingId: frontendConfig.getOptionalString(
            'app.googleAnalyticsTrackingId',
          ),
+          datadogRum: {
+            env: frontendConfig.getOptionalString('app.datadogRum.env'),
+            clientToken: frontendConfig.getOptionalString(
+              'app.datadogRum.clientToken',
+            ),
+            applicationId: frontendConfig.getOptionalString(
+              'app.datadogRum.applicationId',
+            ),
+            site: frontendConfig.getOptionalString('app.datadogRum.site'),
+          },
        },
      },
    }),