From a395952b88e8b57a03d7f41b8f82abbca6c2a344 Mon Sep 17 00:00:00 2001
From: Kerry Gallagher <k.gallagher.05@gmail.com>
Date: Wed, 28 Oct 2020 14:08:10 +0000
Subject: [PATCH] [User experience] Fix JS error rate (#81512) (#81888)

* Query adjustments for getClientMetrics
* Remove error rate from JS errors section
---
 .../support/step_definitions/csm/js_errors.ts |  7 +-
 .../ImpactfulMetrics/JSErrors.tsx             | 20 ------
 .../__snapshots__/queries.test.ts.snap        | 64 ++++++++-----------
 .../lib/rum_client/get_client_metrics.ts      | 48 +++++++-------
 .../lib/rum_client/get_page_view_trends.ts    |  1 +
 .../projections/rum_page_load_transactions.ts | 21 +++---
 .../translations/translations/ja-JP.json      |  1 -
 .../translations/translations/zh-CN.json      |  1 -
 8 files changed, 68 insertions(+), 95 deletions(-)

diff --git a/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/js_errors.ts b/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/js_errors.ts
index 0dbefb73e68c44..9e10e2fd599149 100644
--- a/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/js_errors.ts
+++ b/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/js_errors.ts
@@ -12,12 +12,7 @@ Then(`it displays list of relevant js errors`, () => {
   cy.get('.euiBasicTable-loading').should('not.be.visible');
   cy.get('.euiStat__title-isLoading').should('not.be.visible');
 
-  getDataTestSubj('uxJsErrorsTotal').should('have.text', 'Total errors110');
-
-  getDataTestSubj('uxJsErrorRate').should(
-    'have.text',
-    'Error rate100 %Error rate 100 %'
-  );
+  getDataTestSubj('uxJsErrorsTotal').should('have.text', 'Total errors112');
 
   getDataTestSubj('uxJsErrorTable').within(() => {
     cy.get('tr.euiTableRow', DEFAULT_TIMEOUT)
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/JSErrors.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/JSErrors.tsx
index 7a7c0518175551..58f00604b8fda1 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/JSErrors.tsx
+++ b/x-pack/plugins/apm/public/components/app/RumDashboard/ImpactfulMetrics/JSErrors.tsx
@@ -15,7 +15,6 @@ import {
   EuiToolTip,
 } from '@elastic/eui';
 import numeral from '@elastic/numeral';
-import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { useUrlParams } from '../../../../hooks/useUrlParams';
 import { useFetcher } from '../../../../hooks/useFetcher';
@@ -102,11 +101,6 @@ export function JSErrors() {
     });
   };
 
-  const errorRate =
-    totalPageViews > 0
-      ? ((data?.totalErrorPages ?? 0) / totalPageViews) * 100
-      : 0;
-
   const totalErrors = data?.totalErrors ?? 0;
 
   return (
@@ -133,20 +127,6 @@ export function JSErrors() {
             isLoading={status !== 'success'}
           />
         </EuiFlexItem>
-        <EuiFlexItem grow={false}>
-          <EuiStat
-            data-test-subj={'uxJsErrorRate'}
-            titleSize="s"
-            title={i18n.translate('xpack.apm.rum.jsErrors.errorRateValue', {
-              defaultMessage: '{errorRate} %',
-              values: {
-                errorRate: errorRate.toFixed(0),
-              },
-            })}
-            description={I18LABELS.errorRate}
-            isLoading={status !== 'success'}
-          />
-        </EuiFlexItem>{' '}
       </EuiFlexGroup>
       <EuiSpacer size="s" />
       <EuiBasicTable
diff --git a/x-pack/plugins/apm/server/lib/rum_client/__snapshots__/queries.test.ts.snap b/x-pack/plugins/apm/server/lib/rum_client/__snapshots__/queries.test.ts.snap
index 1fafa080824439..eedc3a83cd3766 100644
--- a/x-pack/plugins/apm/server/lib/rum_client/__snapshots__/queries.test.ts.snap
+++ b/x-pack/plugins/apm/server/lib/rum_client/__snapshots__/queries.test.ts.snap
@@ -9,31 +9,35 @@ Object {
   },
   "body": Object {
     "aggs": Object {
-      "backEnd": Object {
-        "percentiles": Object {
-          "field": "transaction.marks.agent.timeToFirstByte",
-          "hdr": Object {
-            "number_of_significant_value_digits": 3,
+      "hasFetchStartField": Object {
+        "aggs": Object {
+          "backEnd": Object {
+            "percentiles": Object {
+              "field": "transaction.marks.agent.timeToFirstByte",
+              "hdr": Object {
+                "number_of_significant_value_digits": 3,
+              },
+              "percents": Array [
+                50,
+              ],
+            },
           },
-          "percents": Array [
-            50,
-          ],
-        },
-      },
-      "domInteractive": Object {
-        "percentiles": Object {
-          "field": "transaction.marks.agent.domInteractive",
-          "hdr": Object {
-            "number_of_significant_value_digits": 3,
+          "domInteractive": Object {
+            "percentiles": Object {
+              "field": "transaction.marks.agent.domInteractive",
+              "hdr": Object {
+                "number_of_significant_value_digits": 3,
+              },
+              "percents": Array [
+                50,
+              ],
+            },
           },
-          "percents": Array [
-            50,
-          ],
         },
-      },
-      "pageViews": Object {
-        "value_count": Object {
-          "field": "transaction.duration.us",
+        "filter": Object {
+          "exists": Object {
+            "field": "transaction.marks.navigationTiming.fetchStart",
+          },
         },
       },
     },
@@ -54,11 +58,6 @@ Object {
               "transaction.type": "page-load",
             },
           },
-          Object {
-            "exists": Object {
-              "field": "transaction.marks.navigationTiming.fetchStart",
-            },
-          },
           Object {
             "term": Object {
               "service.environment": "test",
@@ -68,6 +67,7 @@ Object {
       },
     },
     "size": 0,
+    "track_total_hits": true,
   },
 }
 `;
@@ -139,11 +139,6 @@ Object {
               "agent.name": "rum-js",
             },
           },
-          Object {
-            "term": Object {
-              "transaction.type": "page-load",
-            },
-          },
           Object {
             "term": Object {
               "service.language.name": "javascript",
@@ -545,11 +540,6 @@ Object {
               "transaction.type": "page-load",
             },
           },
-          Object {
-            "exists": Object {
-              "field": "transaction.marks.navigationTiming.fetchStart",
-            },
-          },
           Object {
             "term": Object {
               "service.environment": "test",
diff --git a/x-pack/plugins/apm/server/lib/rum_client/get_client_metrics.ts b/x-pack/plugins/apm/server/lib/rum_client/get_client_metrics.ts
index 6d596246d6af92..da65e69e7eb7cf 100644
--- a/x-pack/plugins/apm/server/lib/rum_client/get_client_metrics.ts
+++ b/x-pack/plugins/apm/server/lib/rum_client/get_client_metrics.ts
@@ -4,7 +4,6 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { TRANSACTION_DURATION } from '../../../common/elasticsearch_fieldnames';
 import { getRumPageLoadTransactionsProjection } from '../../projections/rum_page_load_transactions';
 import { mergeProjection } from '../../projections/util/merge_projection';
 import { Setup, SetupTimeRange } from '../helpers/setup_request';
@@ -25,32 +24,36 @@ export async function getClientMetrics({
   const projection = getRumPageLoadTransactionsProjection({
     setup,
     urlQuery,
+    checkFetchStartFieldExists: false,
   });
 
   const params = mergeProjection(projection, {
     body: {
       size: 0,
+      track_total_hits: true,
       aggs: {
-        pageViews: {
-          value_count: {
-            field: TRANSACTION_DURATION,
+        hasFetchStartField: {
+          filter: {
+            exists: { field: 'transaction.marks.navigationTiming.fetchStart' },
           },
-        },
-        backEnd: {
-          percentiles: {
-            field: TRANSACTION_TIME_TO_FIRST_BYTE,
-            percents: [percentile],
-            hdr: {
-              number_of_significant_value_digits: 3,
+          aggs: {
+            backEnd: {
+              percentiles: {
+                field: TRANSACTION_TIME_TO_FIRST_BYTE,
+                percents: [percentile],
+                hdr: {
+                  number_of_significant_value_digits: 3,
+                },
+              },
             },
-          },
-        },
-        domInteractive: {
-          percentiles: {
-            field: TRANSACTION_DOM_INTERACTIVE,
-            percents: [percentile],
-            hdr: {
-              number_of_significant_value_digits: 3,
+            domInteractive: {
+              percentiles: {
+                field: TRANSACTION_DOM_INTERACTIVE,
+                percents: [percentile],
+                hdr: {
+                  number_of_significant_value_digits: 3,
+                },
+              },
             },
           },
         },
@@ -59,15 +62,16 @@ export async function getClientMetrics({
   });
 
   const { apmEventClient } = setup;
-
   const response = await apmEventClient.search(params);
-  const { backEnd, domInteractive, pageViews } = response.aggregations!;
+  const {
+    hasFetchStartField: { backEnd, domInteractive },
+  } = response.aggregations!;
 
   const pkey = percentile.toFixed(1);
 
   // Divide by 1000 to convert ms into seconds
   return {
-    pageViews,
+    pageViews: { value: response.hits.total.value ?? 0 },
     backEnd: { value: backEnd.values[pkey] || 0 },
     frontEnd: {
       value: (domInteractive.values[pkey] || 0) - (backEnd.values[pkey] || 0),
diff --git a/x-pack/plugins/apm/server/lib/rum_client/get_page_view_trends.ts b/x-pack/plugins/apm/server/lib/rum_client/get_page_view_trends.ts
index c1a602c33feae1..f483acba4b9349 100644
--- a/x-pack/plugins/apm/server/lib/rum_client/get_page_view_trends.ts
+++ b/x-pack/plugins/apm/server/lib/rum_client/get_page_view_trends.ts
@@ -20,6 +20,7 @@ export async function getPageViewTrends({
   const projection = getRumPageLoadTransactionsProjection({
     setup,
     urlQuery,
+    checkFetchStartFieldExists: false,
   });
   let breakdownItem: BreakdownItem | null = null;
   if (breakdowns) {
diff --git a/x-pack/plugins/apm/server/projections/rum_page_load_transactions.ts b/x-pack/plugins/apm/server/projections/rum_page_load_transactions.ts
index 530ca36b5dc9f3..9c33da2278694c 100644
--- a/x-pack/plugins/apm/server/projections/rum_page_load_transactions.ts
+++ b/x-pack/plugins/apm/server/projections/rum_page_load_transactions.ts
@@ -17,9 +17,11 @@ import { TRANSACTION_PAGE_LOAD } from '../../common/transaction_types';
 export function getRumPageLoadTransactionsProjection({
   setup,
   urlQuery,
+  checkFetchStartFieldExists = true,
 }: {
   setup: Setup & SetupTimeRange;
   urlQuery?: string;
+  checkFetchStartFieldExists?: boolean;
 }) {
   const { start, end, esFilter } = setup;
 
@@ -27,13 +29,17 @@ export function getRumPageLoadTransactionsProjection({
     filter: [
       { range: rangeFilter(start, end) },
       { term: { [TRANSACTION_TYPE]: TRANSACTION_PAGE_LOAD } },
-      {
-        // Adding this filter to cater for some inconsistent rum data
-        // not available on aggregated transactions
-        exists: {
-          field: 'transaction.marks.navigationTiming.fetchStart',
-        },
-      },
+      ...(checkFetchStartFieldExists
+        ? [
+            {
+              // Adding this filter to cater for some inconsistent rum data
+              // not available on aggregated transactions
+              exists: {
+                field: 'transaction.marks.navigationTiming.fetchStart',
+              },
+            },
+          ]
+        : []),
       ...(urlQuery
         ? [
             {
@@ -74,7 +80,6 @@ export function getRumErrorsProjection({
     filter: [
       { range: rangeFilter(start, end) },
       { term: { [AGENT_NAME]: 'rum-js' } },
-      { term: { [TRANSACTION_TYPE]: TRANSACTION_PAGE_LOAD } },
       {
         term: {
           [SERVICE_LANGUAGE_NAME]: 'javascript',
diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json
index bd339d20cf9ee6..399c9841be6f4f 100644
--- a/x-pack/plugins/translations/translations/ja-JP.json
+++ b/x-pack/plugins/translations/translations/ja-JP.json
@@ -5045,7 +5045,6 @@
     "xpack.apm.rum.filters.url.noResults": "結果がありません",
     "xpack.apm.rum.jsErrors.errorMessage": "エラーメッセージ",
     "xpack.apm.rum.jsErrors.errorRate": "エラー率",
-    "xpack.apm.rum.jsErrors.errorRateValue": "{errorRate} %",
     "xpack.apm.rum.jsErrors.impactedPageLoads": "影響を受けるページ読み込み数",
     "xpack.apm.rum.jsErrors.totalErrors": "合計エラー数",
     "xpack.apm.rum.userExperienceMetrics": "ユーザーエクスペリエンスメトリック",
diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json
index 9749a730f1e08b..cd4255b08c7515 100644
--- a/x-pack/plugins/translations/translations/zh-CN.json
+++ b/x-pack/plugins/translations/translations/zh-CN.json
@@ -5049,7 +5049,6 @@
     "xpack.apm.rum.filters.url.noResults": "没有可用结果",
     "xpack.apm.rum.jsErrors.errorMessage": "错误消息",
     "xpack.apm.rum.jsErrors.errorRate": "错误率",
-    "xpack.apm.rum.jsErrors.errorRateValue": "{errorRate}%",
     "xpack.apm.rum.jsErrors.impactedPageLoads": "受影响的页面加载",
     "xpack.apm.rum.jsErrors.totalErrors": "错误总数",
     "xpack.apm.rum.userExperienceMetrics": "用户体验指标",