@web-atoms/core 2.4.75 → 2.5.3

package/src/services/FetchBuilder.ts

@@ -247,65 +247,60 @@ export default class FetchBuilder {
         postProcessor: (r: Response, next?: (data) => any) => T | Promise<T>): Promise<{ result: T, headers: any, status: number }> {
 
         let { log, logError, hideBusyIndicator } = this.request;
-        let d:IDisposable;
+        using _d = !hideBusyIndicator ? App.current.createBusyIndicator() : null;
         try {
-            d = !hideBusyIndicator ? App.current.createBusyIndicator() : null;
-            try {
-
-                const { headers, fetchProxy, jsonPostProcessor } = this.request;
-                const r = await (fetchProxy ?? fetch)(this.request.url, this.request);
-                if (ensureSuccess) {
-                    if (r.status > 300) {
-                        log = logError;
-                        log?.(`fetch: ${this.request.method ?? "GET"} ${this.request.url}`);
-                        if (log && headers) {
-                            for (const key in headers) {
-                                if (headers.hasOwnProperty(key)) {
-                                    log?.(`${key}: ${headers[key]}`);
-                                }
+
+            const { headers, fetchProxy, jsonPostProcessor } = this.request;
+            const r = await (fetchProxy ?? fetch)(this.request.url, this.request);
+            if (ensureSuccess) {
+                if (r.status > 300) {
+                    log = logError;
+                    log?.(`fetch: ${this.request.method ?? "GET"} ${this.request.url}`);
+                    if (log && headers) {
+                        for (const key in headers) {
+                            if (headers.hasOwnProperty(key)) {
+                                log?.(`${key}: ${headers[key]}`);
                             }
                         }
-                        log?.(`${r.status} ${r.statusText || "Http Error"}`);
-                        const type = r.headers.get("content-type");
-                        if (/\/json/i.test(type)) {
-                            const json: any = await r.json();
-                            log?.(json);
-                            const message = json.title
-                            ?? json.detail
-                            ?? json.message
-                            ?? json.exceptionMessage
-                            ?? "Json Server Error";
-                            log = null;
-                            logError = null;
-                            throw new JsonError(message, json);
-                        }
-                        const text = await r.text();
-                        log?.(text);
+                    }
+                    log?.(`${r.status} ${r.statusText || "Http Error"}`);
+                    const type = r.headers.get("content-type");
+                    if (/\/json/i.test(type)) {
+                        const json: any = await r.json();
+                        log?.(json);
+                        const message = json.title
+                        ?? json.detail
+                        ?? json.message
+                        ?? json.exceptionMessage
+                        ?? "Json Server Error";
                         log = null;
                         logError = null;
-                        throw new Error(`Fetch failed with error ${r.status} for ${this.request.url}\n${text}`);
+                        throw new JsonError(message, json);
                     }
+                    const text = await r.text();
+                    log?.(text);
+                    log = null;
+                    logError = null;
+                    throw new Error(`Fetch failed with error ${r.status} for ${this.request.url}\n${text}`);
                 }
-                log?.(`${this.request.method ?? "GET"} ${this.request.url}`);
-                if (log && headers) {
-                    for (const key in headers) {
-                        if (headers.hasOwnProperty(key)) {
-                            log?.(`${key}: ${headers[key]}`);
-                        }
+            }
+            log?.(`${this.request.method ?? "GET"} ${this.request.url}`);
+            if (log && headers) {
+                for (const key in headers) {
+                    if (headers.hasOwnProperty(key)) {
+                        log?.(`${key}: ${headers[key]}`);
                     }
                 }
-                const result = await postProcessor(r, jsonPostProcessor);
-                if (log) {
-                    log(`${r.status} ${r.statusText || "OK"}`)
-                    log(result);
-                }
-                return { result, headers: r.headers, status: r.status };
-            } catch (error) {
-                log?.(error);
-                throw error;
             }
-        } finally {
-            d?.dispose();
+            const result = await postProcessor(r, jsonPostProcessor);
+            if (log) {
+                log(`${r.status} ${r.statusText || "OK"}`)
+                log(result);
+            }
+            return { result, headers: r.headers, status: r.status };
+        } catch (error) {
+            log?.(error);
+            throw error;
         }
     }
 

package/src/services/http/RestService.ts

@@ -456,157 +456,151 @@ export class BaseService {
             }
         }
 
-        const busyIndicator = this.showProgress ? ( this.app.createBusyIndicator({
+        using _busyIndicator = this.showProgress ? ( this.app.createBusyIndicator({
             title: url,
             description: `${method} ${url}`
         }) ) : null;
 
-        try {
 
-            url = UMD.resolvePath(url);
+        url = UMD.resolvePath(url);
 
-            let options: AjaxOptions = new AjaxOptions();
-            options.method = method;
+        let options: AjaxOptions = new AjaxOptions();
+        options.method = method;
 
-            if (methodOptions) {
-                options.headers = methodOptions.headers;
-                options.dataType = methodOptions.accept;
-            }
+        if (methodOptions) {
+            options.headers = methodOptions.headers;
+            options.dataType = methodOptions.accept;
+        }
 
-            const methodHeaders = (options.headers = options.headers || {});
+        const methodHeaders = (options.headers = options.headers || {});
 
-            const headers = this.headers
-                ? ({ ... this.headers, ...  methodHeaders })
-                : methodHeaders;
+        const headers = this.headers
+            ? ({ ... this.headers, ...  methodHeaders })
+            : methodHeaders;
 
-            // this is necessary to support IsAjaxRequest in ASP.NET MVC
-            if (!headers["X-Requested-With"]) {
-                headers["X-Requested-With"] = "XMLHttpRequest";
-            }
+        // this is necessary to support IsAjaxRequest in ASP.NET MVC
+        if (!headers["X-Requested-With"]) {
+            headers["X-Requested-With"] = "XMLHttpRequest";
+        }
 
-            options.dataType = options.dataType || "application/json";
+        options.dataType = options.dataType || "application/json";
 
-            const jsonOptions = {
-                ... this.jsonOptions,
-                ... (methodOptions ? methodOptions.jsonOptions : {})
-            };
+        const jsonOptions = {
+            ... this.jsonOptions,
+            ... (methodOptions ? methodOptions.jsonOptions : {})
+        };
 
-            if (bag) {
+        if (bag) {
 
-                for (let i: number = 0; i < bag.length; i++) {
-                    const p: ServiceParameter = bag[i];
-                    const vi = values[i];
-                    const v: any = vi === undefined ? p.defaultValue : vi;
-                    if (v instanceof CancelToken) {
-                        options.cancel = v;
-                        continue;
-                    }
-                    switch (p.type) {
-                        case "path":
-                            if (v === undefined) {
-                                continue;
-                            }
-                            const vs: string = v + "";
-                            const replacer = `{${p.key}}`;
-                            url = url.split(replacer).join(vs);
-                            break;
-                        case "query":
-                            if (v === undefined) {
-                                continue;
-                            }
-                            if (url.indexOf("?") === -1) {
-                                url += "?";
-                            }
-                            if (! /(\&|\?)$/.test(url)) {
-                                url += "&";
-                            }
-                            url += `${encodeURIComponent(p.key)}=${encodeURIComponent(v)}`;
-                            break;
-                        case "queries":
-                            if (url.indexOf("?") === -1) {
-                                url += "?";
-                            }
-                            if (! /(\&|\?)$/.test(url)) {
-                                url += "&";
-                            }
-                            for (const key in v) {
-                                if (v.hasOwnProperty(key)) {
-                                    const element = v[key];
-                                    if (element !== undefined) {
-                                        url += `${encodeURIComponent(key)}=${encodeURIComponent(element)}&`;
-                                    }
+            for (let i: number = 0; i < bag.length; i++) {
+                const p: ServiceParameter = bag[i];
+                const vi = values[i];
+                const v: any = vi === undefined ? p.defaultValue : vi;
+                if (v instanceof CancelToken) {
+                    options.cancel = v;
+                    continue;
+                }
+                switch (p.type) {
+                    case "path":
+                        if (v === undefined) {
+                            continue;
+                        }
+                        const vs: string = v + "";
+                        const replacer = `{${p.key}}`;
+                        url = url.split(replacer).join(vs);
+                        break;
+                    case "query":
+                        if (v === undefined) {
+                            continue;
+                        }
+                        if (url.indexOf("?") === -1) {
+                            url += "?";
+                        }
+                        if (! /(\&|\?)$/.test(url)) {
+                            url += "&";
+                        }
+                        url += `${encodeURIComponent(p.key)}=${encodeURIComponent(v)}`;
+                        break;
+                    case "queries":
+                        if (url.indexOf("?") === -1) {
+                            url += "?";
+                        }
+                        if (! /(\&|\?)$/.test(url)) {
+                            url += "&";
+                        }
+                        for (const key in v) {
+                            if (v.hasOwnProperty(key)) {
+                                const element = v[key];
+                                if (element !== undefined) {
+                                    url += `${encodeURIComponent(key)}=${encodeURIComponent(element)}&`;
                                 }
                             }
-                            break;
-                        case "body":
-                            options.data = v;
-                            options = this.encodeData(options);
-                            break;
-                        case "bodyformmodel":
-                            options.data = v;
-                            break;
-                        case "rawbody":
-                            options.data = v;
-                            break;
-                        case "xmlbody":
-                            options.contentType = "text/xml";
-                            options.data = v;
-                            break;
-                        case "cancel":
-                            options.cancel = v as CancelToken;
-                            break;
-                        case "header":
-                            if (v === undefined) {
-                                continue;
-                            }
-                            headers[p.key] = v;
-                            break;
-                    }
-                }
-            }
-            options.url = url;
-
-            const xhr = await this.ajax(url, options);
-
-            if (/json/i.test(xhr.responseType)) {
-                const text = xhr.responseText;
-                const response = this.jsonService.parse(text, jsonOptions );
-
-                if (xhr.status >= 400) {
-                    throw new JsonError(
-                        typeof response === "string"
-                        ? response
-                        : ( response.title
-                        ?? response.detail
-                        ?? response.message
-                        ?? response.exceptionMessage
-                        ?? text
-                        ?? "Json Server Error"), response);
-                }
-                if (methodOptions && methodOptions.returnHeaders) {
-                    return {
-                        headers: this.parseHeaders(xhr.responseHeaders),
-                        value: response
-                    };
+                        }
+                        break;
+                    case "body":
+                        options.data = v;
+                        options = this.encodeData(options);
+                        break;
+                    case "bodyformmodel":
+                        options.data = v;
+                        break;
+                    case "rawbody":
+                        options.data = v;
+                        break;
+                    case "xmlbody":
+                        options.contentType = "text/xml";
+                        options.data = v;
+                        break;
+                    case "cancel":
+                        options.cancel = v as CancelToken;
+                        break;
+                    case "header":
+                        if (v === undefined) {
+                            continue;
+                        }
+                        headers[p.key] = v;
+                        break;
                 }
-                return response;
             }
+        }
+        options.url = url;
+
+        const xhr = await this.ajax(url, options);
+
+        if (/json/i.test(xhr.responseType)) {
+            const text = xhr.responseText;
+            const response = this.jsonService.parse(text, jsonOptions );
+
             if (xhr.status >= 400) {
-                throw new Error(xhr.responseText || "Server Error");
+                throw new JsonError(
+                    typeof response === "string"
+                    ? response
+                    : ( response.title
+                    ?? response.detail
+                    ?? response.message
+                    ?? response.exceptionMessage
+                    ?? text
+                    ?? "Json Server Error"), response);
             }
-
             if (methodOptions && methodOptions.returnHeaders) {
                 return {
                     headers: this.parseHeaders(xhr.responseHeaders),
-                    value: xhr.responseText
+                    value: response
                 };
             }
-            return xhr.responseText;
-        } finally {
-            if (busyIndicator) {
-                busyIndicator.dispose();
-            }
+            return response;
+        }
+        if (xhr.status >= 400) {
+            throw new Error(xhr.responseText || "Server Error");
+        }
+
+        if (methodOptions && methodOptions.returnHeaders) {
+            return {
+                headers: this.parseHeaders(xhr.responseHeaders),
+                value: xhr.responseText
+            };
         }
+        return xhr.responseText;
 
     }
 

package/src/web/services/PopupService.tsx

@@ -561,12 +561,24 @@ export default class PopupService {
                             vm[key] = e;
                         }
                     }
-                    (control as any).init?.()
-                        ?.catch((error) => {
-                            if (!CancelToken.isCancelled(error)) {
-                                console.error(error);
-                            }
-                        });
+                    const init = (control as any).init;
+                    if (init) {
+                        const c = (control as any).init();
+                        if (c?.then) {
+                            c.then(() => 
+                                control.element.dispatchEvent(new CustomEvent("popupReady", { bubbles: true })),
+                            (error) => {
+                                control.element.dispatchEvent(new CustomEvent("popupReady", { bubbles: true }));
+                                if(!CancelToken.isCancelled(error)) {
+                                    console.error(error);
+                                }
+                            });
+                        } else {
+                            control.element.dispatchEvent(new CustomEvent("popupReady", { bubbles: true }));
+                        }
+                    } else {
+                        control.element.dispatchEvent(new CustomEvent("popupReady", { bubbles: true }));
+                    }
                 }
                 cancelToken?.registerForCancel(cancel);
                 isModal = modal;

package/src/web/services/PopupWindow.tsx

@@ -229,19 +229,19 @@ export default class PopupWindow extends AtomControl {
 
         // init will be called if parameters are set...
         // this.runAfterInit(() => this.app.runAsync(() => this.init?.()));
-
-        setTimeout((p: HTMLElement) => {
+        const p = this.element;
+        this.bindEvent(this.element, "popupReady", (e) => {
+            if (e.defaultPrevented) {
+                return;
+            }
             p.setAttribute("data-ready", "true");
-        }, 10, this.element);
-
-        setTimeout((p: HTMLElement) => {
             const parent = (p.offsetParent ?? document.body) as HTMLElement;
             const left = `${(parent.offsetWidth - p.offsetWidth) / 2}px`;
             const top = `${(parent.offsetHeight - p.offsetHeight) / 2}px`;
             p.style.left = left;
             p.style.top = top;
             p.removeAttribute("not-ready");
-        }, 1000, this.element);
+        });
     }
 
     protected render(node: XNode, e?: any, creator?: any): void {

package/src/web/services/WebBusyIndicatorService.ts

@@ -21,7 +21,7 @@ export class WebBusyIndicatorService extends BusyIndicatorService {
 
     private indicators: number = 0;
 
-    public createIndicator(): IDisposable {
+    public createIndicator(): Disposable {
 
         const host = document.createElement("div");
         const popup = new AtomControl(this.app, host);
@@ -70,6 +70,10 @@ export class WebBusyIndicatorService extends BusyIndicatorService {
             }
         });
 
-        return popup;
+        return {
+            [Symbol.dispose]() {
+                popup.dispose();
+            }
+        }
     }
 }

package/tsconfig.json

@@ -16,7 +16,8 @@
         "jsxFactory": "XNode.create",
         "lib": [
             "es6",
-            "dom"
+            "dom",
+            "ESNext.Disposable"
         ]
     },
     "include": [