@allurereport/web-commons 3.0.0-beta.3

package/README.md

@@ -0,0 +1,25 @@
+# Allure Web Commons
+
+[<img src="https://allurereport.org/public/img/allure-report.svg" height="85px" alt="Allure Report logo" align="right" />](https://allurereport.org "Allure Report")
+
+- Learn more about Allure Report at https://allurereport.org
+- 📚 [Documentation](https://allurereport.org/docs/) – discover official documentation for Allure Report
+- ❓ [Questions and Support](https://github.com/orgs/allure-framework/discussions/categories/questions-support) – get help from the team and community
+- 📢 [Official announcements](https://github.com/orgs/allure-framework/discussions/categories/announcements) – be in touch with the latest updates
+- 💬 [General Discussion ](https://github.com/orgs/allure-framework/discussions/categories/general-discussion) – engage in casual conversations, share insights and ideas with the community
+
+---
+
+## Overview
+
+The package includes utilities which are used in web-implementations of Allure reports.
+
+## Install
+
+Use your favorite package manager to install the package:
+
+```shell
+npm add @allurereport/web-commons
+yarn add @allurereport/web-commons
+pnpm add @allurereport/web-commons
+```

package/dist/data.d.ts

@@ -0,0 +1,11 @@
+export declare const ALLURE_LIVE_RELOAD_HASH_STORAGE_KEY = "__allure_report_live_reload_hash__";
+export declare const createReportDataScript: (reportFiles?: {
+    name: string;
+    value: string;
+}[]) => string;
+export declare const ensureReportDataReady: () => Promise<unknown>;
+export declare const loadReportData: (name: string) => Promise<string>;
+export declare const reportDataUrl: (path: string, contentType?: string) => Promise<string>;
+export declare const fetchReportJsonData: <T>(path: string) => Promise<T>;
+export declare const fetchReportAttachment: (path: string, contentType: string) => Promise<Response>;
+export declare const getReportOptions: <T>() => T;

package/dist/data.js

@@ -0,0 +1,81 @@
+export const ALLURE_LIVE_RELOAD_HASH_STORAGE_KEY = "__allure_report_live_reload_hash__";
+export const createReportDataScript = (reportFiles = []) => {
+    if (reportFiles.length === 0) {
+        return `
+      <script async>
+        window.allureReportDataReady = true;
+      </script>
+    `;
+    }
+    const reportFilesDeclaration = reportFiles.map(({ name, value }) => `d('${name}','${value}')`).join(",");
+    return `
+    <script async>
+      window.allureReportDataReady = false;
+      window.allureReportData = window.allureReportData || {};
+      
+      function d(name, value){
+        return new Promise(function (resolve) {
+          window.allureReportData[name] = value;
+          
+          return resolve(true);
+        });
+      }
+    </script>
+    <script defer>
+      Promise.allSettled([${reportFilesDeclaration}])
+        .then(function(){
+          window.allureReportDataReady = true;
+        })
+    </script>
+  `;
+};
+export const ensureReportDataReady = () => new Promise((resolve) => {
+    const waitForReady = () => {
+        if (globalThis.allureReportDataReady) {
+            return resolve(true);
+        }
+        setTimeout(waitForReady, 30);
+    };
+    waitForReady();
+});
+export const loadReportData = async (name) => {
+    await ensureReportDataReady();
+    return new Promise((resolve, reject) => {
+        if (globalThis.allureReportData[name]) {
+            return resolve(globalThis.allureReportData[name]);
+        }
+        else {
+            return reject(new Error(`Data "${name}" not found!`));
+        }
+    });
+};
+export const reportDataUrl = async (path, contentType = "application/octet-stream") => {
+    if (globalThis.allureReportData) {
+        const dataKey = path.replace(/\?attachment$/, "");
+        const value = await loadReportData(dataKey);
+        return `data:${contentType};base64,${value}`;
+    }
+    const baseEl = globalThis.document.head.querySelector("base")?.href ?? "https://localhost";
+    const url = new URL(path, baseEl);
+    const liveReloadHash = globalThis.localStorage.getItem(ALLURE_LIVE_RELOAD_HASH_STORAGE_KEY);
+    if (liveReloadHash) {
+        url.searchParams.set("live_reload_hash", liveReloadHash);
+    }
+    return url.pathname + url.search + url.hash;
+};
+export const fetchReportJsonData = async (path) => {
+    const url = await reportDataUrl(path);
+    const res = await globalThis.fetch(url);
+    if (!res.ok) {
+        throw new Error(`Failed to fetch ${url}, response status: ${res.status}`);
+    }
+    const data = res.json();
+    return data;
+};
+export const fetchReportAttachment = async (path, contentType) => {
+    const url = await reportDataUrl(path, contentType);
+    return globalThis.fetch(url);
+};
+export const getReportOptions = () => {
+    return globalThis.allureReportOptions;
+};

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./data.js";
+export * from "./static.js";

package/dist/index.js

@@ -0,0 +1,2 @@
+export * from "./data.js";
+export * from "./static.js";

package/dist/static.d.ts

@@ -0,0 +1,8 @@
+export declare const createScriptTag: (src: string, options?: {
+    async?: false;
+    defer?: false;
+}) => string;
+export declare const createStylesLinkTag: (src: string) => string;
+export declare const createFontLinkTag: (src: string) => string;
+export declare const createFaviconLinkTag: (src: string) => string;
+export declare const createBaseUrlScript: () => string;

package/dist/static.js

@@ -0,0 +1,25 @@
+export const createScriptTag = (src, options) => {
+    return `<script ${options?.async ? "async" : ""} ${options?.defer ? "defer" : ""} src="${src}"></script>`;
+};
+export const createStylesLinkTag = (src) => {
+    return `<link rel="stylesheet" type="text/css" href="${src}">`;
+};
+export const createFontLinkTag = (src) => {
+    return `<link rel="preload" href="${src}" as="font" type="font/woff" crossorigin /> `;
+};
+export const createFaviconLinkTag = (src) => {
+    return `<link rel="icon" href="${src}">`;
+};
+export const createBaseUrlScript = () => {
+    return `
+    <script>
+      const { origin, pathname } = window.location; 
+      const url = new URL(pathname, origin);
+      const baseEl = document.createElement("base");
+      
+      baseEl.href = url.toString();
+      
+      window.document.head.appendChild(baseEl);
+    </script>
+  `;
+};

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@allurereport/web-commons",
+  "version": "3.0.0-beta.3",
+  "description": "Collection of utilities used across the web Allure reports",
+  "keywords": [
+    "allure",
+    "testing"
+  ],
+  "repository": "https://github.com/allure-framework/allure3",
+  "license": "Apache-2.0",
+  "author": "Qameta Software",
+  "type": "module",
+  "exports": {
+    ".": "./dist/index.js"
+  },
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "run clean && tsc --project ./tsconfig.json",
+    "clean": "rimraf ./dist"
+  },
+  "dependencies": {
+    "@allurereport/core-api": "3.0.0-beta.3"
+  },
+  "devDependencies": {
+    "@stylistic/eslint-plugin": "^2.6.1",
+    "@types/eslint": "^8.56.11",
+    "@typescript-eslint/eslint-plugin": "^8.0.0",
+    "@typescript-eslint/parser": "^8.0.0",
+    "@vitest/runner": "^2.1.8",
+    "allure-js-commons": "^3.0.7",
+    "allure-vitest": "^3.0.7",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jsdoc": "^50.0.0",
+    "eslint-plugin-n": "^17.10.1",
+    "eslint-plugin-no-null": "^1.0.2",
+    "eslint-plugin-prefer-arrow": "^1.2.3",
+    "rimraf": "^6.0.1",
+    "tslib": "^2.7.0",
+    "typescript": "^5.6.3",
+    "vitest": "^2.1.8"
+  }
+}