All files / app/assets/javascripts/performance_bar/stores performance_bar_store.js

100% Statements 40/40
93.75% Branches 15/16
100% Functions 12/12
100% Lines 37/37

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116          17x       33x 3x   30x   30x 6x     30x   30x 3x     30x                     33x     3x 3x   3x 3x 3x 1x             2x                     189x       7x   7x   7x       6x 6x 6x               18x                   14x   25x       30x 30x 30x   30x 30x 3x   30x 3x     30x      
import { mergeUrlParams } from '~/lib/utils/url_utility';
import { sprintf, s__ } from '~/locale';
 
export default class PerformanceBarStore {
  constructor() {
    this.requests = [];
  }
 
  addRequest(requestId, requestUrl, operationName, requestParams, methodVerb) {
    if (this.findRequest(requestId)) {
      this.updateRequestBatchedQueriesCount(requestId);
    } else {
      let displayName = '';
 
      if (methodVerb) {
        displayName += `${methodVerb.toUpperCase()} `;
      }
 
      displayName += PerformanceBarStore.truncateUrl(requestUrl);
 
      if (operationName) {
        displayName += ` (${operationName})`;
      }
 
      this.requests.push({
        id: requestId,
        url: requestUrl,
        fullUrl: mergeUrlParams(requestParams, requestUrl),
        method: methodVerb,
        details: {},
        queriesInBatch: 1, // only for GraphQL
        displayName,
      });
    }
 
    return this.requests;
  }
  updateRequestBatchedQueriesCount(requestId) {
    const existingRequest = this.findRequest(requestId);
    existingRequest.queriesInBatch += 1;
 
    const originalDisplayName = existingRequest.displayName;
    const regex = /\d+ queries batched/;
    if (regex.test(originalDisplayName)) {
      existingRequest.displayName = originalDisplayName.replace(
        regex,
        sprintf(s__('PerformanceBar|%{queryCount} queries batched'), {
          queryCount: existingRequest.queriesInBatch,
        }),
      );
    } else {
      existingRequest.displayName = sprintf(
        s__('PerformanceBar|%{originalDisplayName} [%{queryCount} queries batched]'),
        {
          originalDisplayName,
          queryCount: existingRequest.queriesInBatch,
        },
      );
    }
  }
 
  findRequest(requestId) {
    return this.requests.find((request) => request.id === requestId);
  }
 
  addRequestDetails(requestId, requestDetails) {
    const request = this.findRequest(requestId);
 
    request.details = requestDetails.data;
 
    return request;
  }
 
  setRequestDetailsData(requestId, metricKey, requestDetailsData) {
    const selectedRequest = this.findRequest(requestId);
    Eif (selectedRequest) {
      selectedRequest.details = {
        ...selectedRequest.details,
        [metricKey]: requestDetailsData,
      };
    }
  }
 
  requestsWithDetails() {
    return this.requests.filter((request) => request.details);
  }
 
  canTrackRequest(requestUrl) {
    // We want to store at most 2 unique requests per URL, as additional
    // requests to the same URL probably aren't very interesting.
    //
    // GraphQL requests are the exception: because all GraphQL requests
    // go to the same URL, we set a higher limit of 10 to allow
    // capturing different queries a page may make.
    const requestsLimit = requestUrl.endsWith('/api/graphql') ? 10 : 2;
 
    return this.requests.filter((request) => request.url === requestUrl).length < requestsLimit;
  }
 
  static truncateUrl(requestUrl) {
    const [rootAndQuery] = requestUrl.split('#');
    const [root, query] = rootAndQuery.split('?');
    const components = root.replace(/\/$/, '').split('/');
 
    let truncated = components[components.length - 1];
    if (truncated.match(/^\d+$/)) {
      truncated = `${components[components.length - 2]}/${truncated}`;
    }
    if (query) {
      truncated += `?${query}`;
    }
 
    return truncated;
  }
}