xmlui 0.10.13 → 0.10.14

package/dist/scripts/src/testing/infrastructure/public/mockServiceWorker.js

@@ -0,0 +1,266 @@
+"use strict";
+/* eslint-disable */
+/* tslint:disable */
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+/**
+ * Mock Service Worker.
+ * @see https://github.com/mswjs/msw
+ * - Please do NOT modify this file.
+ * - Please do NOT serve this file on production.
+ */
+const PACKAGE_VERSION = '2.8.4';
+const INTEGRITY_CHECKSUM = '00729d72e3b82faf54ca8b9621dbb96f';
+const IS_MOCKED_RESPONSE = Symbol('isMockedResponse');
+const activeClientIds = new Set();
+self.addEventListener('install', function () {
+    self.skipWaiting();
+});
+self.addEventListener('activate', function (event) {
+    event.waitUntil(self.clients.claim());
+});
+self.addEventListener('message', function (event) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const clientId = event.source.id;
+        if (!clientId || !self.clients) {
+            return;
+        }
+        const client = yield self.clients.get(clientId);
+        if (!client) {
+            return;
+        }
+        const allClients = yield self.clients.matchAll({
+            type: 'window',
+        });
+        switch (event.data) {
+            case 'KEEPALIVE_REQUEST': {
+                sendToClient(client, {
+                    type: 'KEEPALIVE_RESPONSE',
+                });
+                break;
+            }
+            case 'INTEGRITY_CHECK_REQUEST': {
+                sendToClient(client, {
+                    type: 'INTEGRITY_CHECK_RESPONSE',
+                    payload: {
+                        packageVersion: PACKAGE_VERSION,
+                        checksum: INTEGRITY_CHECKSUM,
+                    },
+                });
+                break;
+            }
+            case 'MOCK_ACTIVATE': {
+                activeClientIds.add(clientId);
+                sendToClient(client, {
+                    type: 'MOCKING_ENABLED',
+                    payload: {
+                        client: {
+                            id: client.id,
+                            frameType: client.frameType,
+                        },
+                    },
+                });
+                break;
+            }
+            case 'MOCK_DEACTIVATE': {
+                activeClientIds.delete(clientId);
+                break;
+            }
+            case 'CLIENT_CLOSED': {
+                activeClientIds.delete(clientId);
+                const remainingClients = allClients.filter((client) => {
+                    return client.id !== clientId;
+                });
+                // Unregister itself when there are no more clients
+                if (remainingClients.length === 0) {
+                    self.registration.unregister();
+                }
+                break;
+            }
+        }
+    });
+});
+self.addEventListener('fetch', function (event) {
+    const { request } = event;
+    // Bypass navigation requests.
+    if (request.mode === 'navigate') {
+        return;
+    }
+    // Opening the DevTools triggers the "only-if-cached" request
+    // that cannot be handled by the worker. Bypass such requests.
+    if (request.cache === 'only-if-cached' && request.mode !== 'same-origin') {
+        return;
+    }
+    // Bypass all requests when there are no active clients.
+    // Prevents the self-unregistered worked from handling requests
+    // after it's been deleted (still remains active until the next reload).
+    if (activeClientIds.size === 0) {
+        return;
+    }
+    // Generate unique request ID.
+    const requestId = crypto.randomUUID();
+    event.respondWith(handleRequest(event, requestId));
+});
+function handleRequest(event, requestId) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const client = yield resolveMainClient(event);
+        const response = yield getResponse(event, client, requestId);
+        // Send back the response clone for the "response:*" life-cycle events.
+        // Ensure MSW is active and ready to handle the message, otherwise
+        // this message will pend indefinitely.
+        if (client && activeClientIds.has(client.id)) {
+            ;
+            (function () {
+                return __awaiter(this, void 0, void 0, function* () {
+                    const responseClone = response.clone();
+                    sendToClient(client, {
+                        type: 'RESPONSE',
+                        payload: {
+                            requestId,
+                            isMockedResponse: IS_MOCKED_RESPONSE in response,
+                            type: responseClone.type,
+                            status: responseClone.status,
+                            statusText: responseClone.statusText,
+                            body: responseClone.body,
+                            headers: Object.fromEntries(responseClone.headers.entries()),
+                        },
+                    }, [responseClone.body]);
+                });
+            })();
+        }
+        return response;
+    });
+}
+// Resolve the main client for the given event.
+// Client that issues a request doesn't necessarily equal the client
+// that registered the worker. It's with the latter the worker should
+// communicate with during the response resolving phase.
+function resolveMainClient(event) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const client = yield self.clients.get(event.clientId);
+        if (activeClientIds.has(event.clientId)) {
+            return client;
+        }
+        if ((client === null || client === void 0 ? void 0 : client.frameType) === 'top-level') {
+            return client;
+        }
+        const allClients = yield self.clients.matchAll({
+            type: 'window',
+        });
+        return allClients
+            .filter((client) => {
+            // Get only those clients that are currently visible.
+            return client.visibilityState === 'visible';
+        })
+            .find((client) => {
+            // Find the client ID that's recorded in the
+            // set of clients that have registered the worker.
+            return activeClientIds.has(client.id);
+        });
+    });
+}
+function getResponse(event, client, requestId) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const { request } = event;
+        // Clone the request because it might've been already used
+        // (i.e. its body has been read and sent to the client).
+        const requestClone = request.clone();
+        function passthrough() {
+            // Cast the request headers to a new Headers instance
+            // so the headers can be manipulated with.
+            const headers = new Headers(requestClone.headers);
+            // Remove the "accept" header value that marked this request as passthrough.
+            // This prevents request alteration and also keeps it compliant with the
+            // user-defined CORS policies.
+            const acceptHeader = headers.get('accept');
+            if (acceptHeader) {
+                const values = acceptHeader.split(',').map((value) => value.trim());
+                const filteredValues = values.filter((value) => value !== 'msw/passthrough');
+                if (filteredValues.length > 0) {
+                    headers.set('accept', filteredValues.join(', '));
+                }
+                else {
+                    headers.delete('accept');
+                }
+            }
+            return fetch(requestClone, { headers });
+        }
+        // Bypass mocking when the client is not active.
+        if (!client) {
+            return passthrough();
+        }
+        // Bypass initial page load requests (i.e. static assets).
+        // The absence of the immediate/parent client in the map of the active clients
+        // means that MSW hasn't dispatched the "MOCK_ACTIVATE" event yet
+        // and is not ready to handle requests.
+        if (!activeClientIds.has(client.id)) {
+            return passthrough();
+        }
+        // Notify the client that a request has been intercepted.
+        const requestBuffer = yield request.arrayBuffer();
+        const clientMessage = yield sendToClient(client, {
+            type: 'REQUEST',
+            payload: {
+                id: requestId,
+                url: request.url,
+                mode: request.mode,
+                method: request.method,
+                headers: Object.fromEntries(request.headers.entries()),
+                cache: request.cache,
+                credentials: request.credentials,
+                destination: request.destination,
+                integrity: request.integrity,
+                redirect: request.redirect,
+                referrer: request.referrer,
+                referrerPolicy: request.referrerPolicy,
+                body: requestBuffer,
+                keepalive: request.keepalive,
+            },
+        }, [requestBuffer]);
+        switch (clientMessage.type) {
+            case 'MOCK_RESPONSE': {
+                return respondWithMock(clientMessage.data);
+            }
+            case 'PASSTHROUGH': {
+                return passthrough();
+            }
+        }
+        return passthrough();
+    });
+}
+function sendToClient(client, message, transferrables = []) {
+    return new Promise((resolve, reject) => {
+        const channel = new MessageChannel();
+        channel.port1.onmessage = (event) => {
+            if (event.data && event.data.error) {
+                return reject(event.data.error);
+            }
+            resolve(event.data);
+        };
+        client.postMessage(message, [channel.port2].concat(transferrables.filter(Boolean)));
+    });
+}
+function respondWithMock(response) {
+    return __awaiter(this, void 0, void 0, function* () {
+        // Setting response status code to 0 is a no-op.
+        // However, when responding with a "Response.error()", the produced Response
+        // instance will have status code set to 0. Since it's not possible to create
+        // a Response instance with status code 0, handle that use-case separately.
+        if (response.status === 0) {
+            return Response.error();
+        }
+        const mockedResponse = new Response(response.body, response);
+        Reflect.defineProperty(mockedResponse, IS_MOCKED_RESPONSE, {
+            value: true,
+            enumerable: true,
+        });
+        return mockedResponse;
+    });
+}

package/dist/scripts/src/testing/themed-app-test-helpers.js

@@ -0,0 +1,139 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initApp = initApp;
+exports.prepPage = prepPage;
+exports.initThemedApp = initThemedApp;
+exports.scalePercentBy = scalePercentBy;
+exports.getBoundingRect = getBoundingRect;
+exports.getFullRectangle = getFullRectangle;
+exports.isElementOverflown = isElementOverflown;
+exports.pixelStrToNum = pixelStrToNum;
+exports.getElementStyle = getElementStyle;
+exports.getElementStyles = getElementStyles;
+exports.getStyle = getStyle;
+const xmlui_parser_1 = require("../components-core/xmlui-parser");
+function parseComponent(entryPoint) {
+    if (typeof entryPoint === "string") {
+        return (0, xmlui_parser_1.xmlUiMarkupToComponent)(entryPoint).component;
+    }
+    return entryPoint;
+}
+function initApp(page_1, appDescription_1) {
+    return __awaiter(this, arguments, void 0, function* (page, appDescription, url = "/", resources = {}) {
+        const { entryPoint, components } = appDescription;
+        const _appDescription = Object.assign(Object.assign({}, appDescription), { name: appDescription.name || "Test App", entryPoint: parseComponent(entryPoint), resources, components: (!components
+                ? undefined
+                : Array.isArray(components)
+                    ? components.map((comp) => parseComponent(comp))
+                    : [parseComponent(components)]) });
+        yield page.addInitScript((app) => {
+            // @ts-ignore
+            window.TEST_ENV = app;
+        }, _appDescription);
+        yield page.goto(url);
+    });
+}
+function prepPage(co_1, appDesc_1) {
+    return __awaiter(this, arguments, void 0, function* (co, appDesc, url = "/") {
+        const context = co;
+        const page = yield context.newPage();
+        yield initApp(page, appDesc, url);
+        return page;
+    });
+}
+function initThemedApp(page, entryPoint, theme) {
+    return __awaiter(this, void 0, void 0, function* () {
+        var _a, _b;
+        (_a = theme.id) !== null && _a !== void 0 ? _a : (theme.id = "testTheme");
+        (_b = theme.name) !== null && _b !== void 0 ? _b : (theme.name = "Custom Test theme");
+        yield initApp(page, { entryPoint, defaultTheme: theme.id, themes: [theme] });
+    });
+}
+/**
+ * @param percentage a percenage value as a string, like "40%"
+ * @param scalarOf100Percent The value to multiply the percentage by
+ */
+function scalePercentBy(scalarOf100Percent, percentage) {
+    if (!percentage.endsWith("%")) {
+        throw new Error("argument doesn't end with % sign");
+    }
+    const percentageNum = Number(percentage.slice(0, -1));
+    return (scalarOf100Percent / 100) * percentageNum;
+}
+function getBoundingRect(locator) {
+    return __awaiter(this, void 0, void 0, function* () {
+        return locator.evaluate((element) => element.getBoundingClientRect());
+    });
+}
+function getFullRectangle(locator) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const boundingRect = yield locator.evaluate((element) => element.getBoundingClientRect());
+        const margins = yield getElementStyles(locator, [
+            "margin-left",
+            "margin-right",
+            "margin-top",
+            "margin-bottom",
+        ]);
+        const marginLeft = parseFloat(margins["margin-left"]);
+        const marginRight = parseFloat(margins["margin-right"]);
+        const marginTop = parseFloat(margins["margin-top"]);
+        const marginBottom = parseFloat(margins["margin-bottom"]);
+        const width = boundingRect.width + marginLeft + marginRight;
+        const height = boundingRect.height + marginTop + marginBottom;
+        const left = boundingRect.left - marginLeft;
+        const right = boundingRect.right + marginRight;
+        const top = boundingRect.top - marginTop;
+        const bottom = boundingRect.bottom + marginBottom;
+        return { width, height, left, right, top, bottom };
+    });
+}
+function isElementOverflown(locator_1) {
+    return __awaiter(this, arguments, void 0, function* (locator, direction = "both") {
+        const [width, height, scrollWidth, scrollHeight] = yield locator.evaluate((element) => [
+            element.clientWidth,
+            element.clientHeight,
+            element.scrollWidth,
+            element.scrollHeight,
+        ]);
+        if (direction === "x")
+            return scrollWidth > width;
+        if (direction === "y")
+            return scrollHeight > height;
+        return scrollWidth > width && scrollHeight > height;
+    });
+}
+function pixelStrToNum(pixelStr) {
+    return Number(pixelStr.replace("px", ""));
+}
+function getElementStyle(locator, style) {
+    return __awaiter(this, void 0, void 0, function* () {
+        return locator.evaluate((element, style) => window.getComputedStyle(element).getPropertyValue(style), style);
+    });
+}
+/**
+ * Retreives all the provided style properties from the locator
+ * @returns an object with the keys being the elements of the styles argument
+ */
+function getElementStyles(locator_1) {
+    return __awaiter(this, arguments, void 0, function* (locator, styles = []) {
+        return locator.evaluate((element, styles) => Object.fromEntries(styles.map((styleName) => [
+            styleName,
+            window.getComputedStyle(element).getPropertyValue(styleName),
+        ])), styles);
+    });
+}
+function getStyle(page, testId, style) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const locator = page.getByTestId(testId);
+        return yield getElementStyle(locator, style);
+    });
+}

package/dist/standalone/xmlui-standalone.es.d.ts

@@ -438,7 +438,7 @@ declare interface ComponentDefCore {
     debug?: Record<string, any>;
 }
 
-declare type ComponentExtension = ComponentRendererDef | CompoundComponentDef;
+declare type ComponentExtension = ComponentRendererDef | CompoundComponentRendererInfo;
 
 declare type ComponentLike = ComponentDef | CompoundComponentDef;
 
@@ -506,6 +506,11 @@ declare interface CompoundComponentDef extends Scriptable {
     codeBehind?: string;
 }
 
+declare type CompoundComponentRendererInfo = {
+    compoundComponentDef: CompoundComponentDef;
+    metadata?: ComponentMetadata;
+};
+
 declare type CONDITIONAL_EXPRESSION = typeof T_CONDITIONAL_EXPRESSION;
 
 declare interface ConditionalExpression extends ExpressionBase {
@@ -561,6 +566,16 @@ declare function createComponentRenderer<TMd extends ComponentMetadata>(type: st
 
 declare function createMetadata<TProps extends Record<string, ComponentPropertyMetadata>, TEvents extends Record<string, ComponentPropertyMetadata>, TContextVars extends Record<string, ComponentPropertyMetadata> = Record<string, any>, TApis extends Record<string, ComponentPropertyMetadata> = Record<string, any>>(metadata: ComponentMetadata<TProps, TEvents, TContextVars, TApis>): ComponentMetadata<TProps, TEvents, TContextVars, TApis>;
 
+/**
+ * This helper function creates a user defined component renderer definition from its arguments.
+ * @param metadata The metadata of the user-defined component
+ * @param componentMarkup The XMLUI markup that defines the user-defined component
+ * @param codeBehind Optional code-behind script that contains variable and function definitions
+ * used by the component
+ * @returns The view renderer definition composed of the arguments
+ */
+declare function createUserDefinedComponentRenderer<TMd extends ComponentMetadata>(metadata: TMd, def: any, codeBehind?: any): CompoundComponentRendererInfo;
+
 declare function d(description: string, availableValues?: readonly PropertyValueDescription[], valueType?: PropertyValueType, defaultValue?: any, isValid?: IsValidFunction<any>, isRequired?: boolean): ComponentPropertyMetadata;
 
 declare function dComponent(description: string): ComponentPropertyMetadata;
@@ -1349,6 +1364,7 @@ declare const standaloneExports: {
     StandaloneApp: typeof xmluiExports.StandaloneApp;
     StandaloneExtensionManager: typeof StandaloneExtensionManager;
     createComponentRenderer: typeof xmluiExports.createComponentRenderer;
+    createUserDefinedComponentRenderer: typeof xmluiExports.createUserDefinedComponentRenderer;
     createMetadata: typeof xmluiExports.createMetadata;
     d: typeof xmluiExports.d;
     dComponent: typeof xmluiExports.dComponent;
@@ -2119,6 +2135,7 @@ declare namespace xmluiExports {
         StandaloneApp,
         StandaloneExtensionManager,
         createComponentRenderer,
+        createUserDefinedComponentRenderer,
         createMetadata,
         d,
         dComponent,