Skip to content

Latest commit

 

History

History
131 lines (95 loc) · 3.7 KB

API.md

File metadata and controls

131 lines (95 loc) · 3.7 KB

API

This REST API is the underlying foundation of the middleware.

Note: The /.ui5/ path is reserved for UI5 Core modules and must not be used for third-party modules.

GET {path/to/resource}?instrument=true

A resource could be instrumented for code coverage by appending ?instrument=true as a query parameter. Note: If a resource has already been excluded via excludePatterns in the middleware's configuration, the query parameter is ignored.

Example:

// OpenUI5

GET /resources/sap/m/ComboBox.js?instrument=true
GET /resources/sap/m/ComboBoxBase.js?instrument=true
GET /resources/sap/m/ComboBoxBaseRenderer.js?instrument=true
GET /resources/sap/m/ComboBoxRenderer.js?instrument=true
GET /resources/sap/m/ComboBoxTextField.js?instrument=true
GET /resources/sap/m/ComboBoxTextFieldRenderer.js?instrument=true

GET /.ui5/coverage/ping

Health check. Useful when checking for the middleware's existence.

Example:

fetch("/.ui5/coverage/ping", {
  method: "GET",
});

POST /.ui5/coverage/report

Sends __coverage__ data to the middleware. A static report is generated with the data provided. Reports can be accessed via the /.ui5/coverage/report/${reportType} route. The available report types can be found here.

Note: Report types can be defined and limited via the middleware's configuration.

Note: You can also provide report settings from the front end via the request body. Currently, only watermarks are supported (available since UI5 1.119.0). Front end-defined settings take precedence over default or ui5.yaml-configured ones. For their usage in OpenUI5 HTML test pages, see the Front-End Configuration section of the main document.

Example:

fetch("/.ui5/coverage/report", {
  method: "POST",
  body: JSON.stringify({
    coverage: window.__coverage__,
    watermarks: { // Optional: report setting
      statements: [75, 90],
      functions: [75, 90],
      branches: [75, 90],
      lines: [75, 90]
    }
  }),
  headers: {
    "Content-Type": "application/json",
  },
});

GET /.ui5/coverage/report/${reportType}

Returns the most recent report(s) via the /.ui5/coverage/report route.

Example:

GET /.ui5/coverage/report/html
GET /.ui5/coverage/report/lcov

Custom Integration

Sample scenario to integrate UI5 Middleware Code Coverage:

// A module in the browser

const isMiddlewareAvailable = await fetch("/.ui5/coverage/ping", {
  method: "GET",
});

if (isMiddlewareAvailable) {
  
  const generatedReports = await fetch("/.ui5/coverage/report", {
    method: "POST",
    body: JSON.stringify({
      coverage: window.__coverage__,
      watermarks: { // Optional: report setting
        statements: [75, 90],
        functions: [75, 90],
        branches: [75, 90],
        lines: [75, 90]
      }
    }),
    headers: {
      "Content-Type": "application/json",
    },
  });

  // Extract the html report from the list of reports
  const htmlReport = generatedReports.availableReports.find(
    (report) => report.report === "html"
  );
  
  if (htmlReport) {
    
    const body = document.body;
    const iFrameElem = document.createElement("iframe");
    
    iFrameElem.src = "/.ui5/coverage/report/" + htmlReport.destination;
    iFrameElem.style.border = "none";
    iFrameElem.style.width = "100%";
    iFrameElem.style.height = "100vh";
    iFrameElem.sandbox = "allow-scripts";

    body.appendChild(iFrameElem);
    
  }
}