jsf.js_next_gen 4.0.0-RC.1 → 4.0.0-RC.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jsf.js_next_gen",
-  "version": "4.0.0-RC.1",
+  "version": "4.0.0-RC.10",
   "description": "A next generation typescript reimplementation of jsf.js",
   "main": "dist/window/faces.js",
   "scripts": {
@@ -21,33 +21,33 @@
   "license": "Apache-2.0",
   "devDependencies": {
     "@istanbuljs/nyc-config-typescript": "^1.0.2",
-    "@types/chai": "^4.3.3",
+    "@types/chai": "^4.3.4",
     "@types/mocha": "^10.0.0",
     "@types/node": "^18.11.9",
     "@types/sinon": "^10.0.13",
     "babel-plugin-syntax-dynamic-import": "^6.18.0",
-    "chai": "^4.3.6",
+    "chai": "^4.3.7",
     "compression-webpack-plugin": "^10.0.0",
     "html-webpack-plugin": "^5.5.0",
     "http-server": "^14.1.1",
-    "jsdom": "^20.0.2",
+    "jsdom": "^20.0.3",
     "jsdom-global": "^3.0.2",
     "mocha": "^10.1.0",
-    "npm-check-updates": "^16.3.16",
+    "npm-check-updates": "^16.4.3",
     "nyc": "^15.1.0",
     "replace-in-file": "^6.3.5",
     "rxjs": "^7.5.7",
-    "sinon": "^14.0.1",
+    "sinon": "^14.0.2",
     "terser-webpack-plugin": "^5.3.6",
     "ts-loader": "^9.4.1",
     "ts-node": "^10.9.1",
-    "typedoc": "^0.23.20",
-    "typescript": "^4.8.4",
-    "webpack": "^5.74.0",
-    "webpack-cli": "^4.10.0",
+    "typedoc": "^0.23.21",
+    "typescript": "^4.9.3",
+    "webpack": "^5.75.0",
+    "webpack-cli": "^5.0.0",
     "webpack-dev-server": "^4.11.1"
   },
   "dependencies": {
-    "mona-dish": "0.23.5"
+    "mona-dish": "^0.23.8"
   }
 }

package/src/main/typescript/@types/definitions/index.d.ts

@@ -23,9 +23,24 @@
 declare global {
 
     type Consumer<T> = (s?: T) => void;
+    type Tuple<V,K> = [V, K];
+    type Tuples<V,K> = [Tuple<V, K>];
     type AssocArr<T> = { [key: string]: T };
     type EvalFuncs = Array<Function | string>;
-    type Options = { [key: string]: string | Function | { [key: string]: string | Function } };
+
+
+    type Options = {
+        render ?: string,
+        execute ?: string,          //space separated list of client ids
+        onevent ?: Function,        // event handler callback
+        onerror ?: Function,        // error handler callback
+        params ?: AssocArr<any>,    // passthrough params
+        delay ?: number,            // delay in milliseconds
+        resetValues ?: boolean,     // if set to true jakarta.faces.partial.resetValues is sent
+        /* @deprecated non-spec conform fallback behavior that anything can be passed and is used as passthrough */
+        [key: string]: any
+    }
+
     type Context = AssocArr<any>;
     type ElemDef = Element | string;
 
@@ -106,7 +121,7 @@ declare global {
     interface OAM {
         clearHiddenInput(formName: string, name: string): void;
         setHiddenInput(formName: string, name: string, value: string): void;
-        submitForm(formName: string, linkId: string, target: string, params: { [key: string]: any }): boolean;
+        submitForm(formName: string, linkId?: string |null, target?: string | null, params?: AssocArr<any> |Tuples<string, any> | null): boolean;
     }
 
     interface MyFacesAPI {

package/src/main/typescript/api/_api.ts

@@ -201,6 +201,7 @@ export module faces {
          * @param channel the channel name/id
          * @param onopen The function to be invoked when the web socket is opened.
          * @param onmessage The function to be invoked when a message is received.
+         * @param onerror The function to be invoked when an error occurs.
          * @param onclose The function to be invoked when the web socket is closed.
          * @param behaviors functions which are invoked whenever a message is received
          * @param autoConnect Whether or not to automatically open the socket. Defaults to <code>false</code>.
@@ -210,10 +211,11 @@ export module faces {
                     channel: string,
                     onopen: Function,
                     onmessage: Function,
+                    onerror: Function,
                     onclose: Function,
                     behaviors: any,
                     autoConnect: boolean): void {
-            PushImpl.init(socketClientId, url, channel, onopen, onmessage, onclose, behaviors, autoConnect);
+            PushImpl.init(socketClientId, url, channel, onopen, onmessage, onerror, onclose, behaviors, autoConnect);
         }
 
         /**
@@ -250,7 +252,7 @@ export module myfaces {
      * @param render
      * @param options
      */
-    export function ab(source: Element, event: Event, eventName: string, execute: string, render: string, options: Context = {}): void {
+    export function ab(source: Element, event: Event, eventName: string, execute: string, render: string, options: Options = {}): void {
         if (eventName) {
            options[$nsp(P_BEHAVIOR_EVENT)] = eventName;
         }

package/src/main/typescript/api/jsf.ts

@@ -26,6 +26,24 @@ if(!window?.jsf) {
     (window as any)['jsf'] = window?.jsf ?? faces;
     window.jsf.specversion = 230000;
     delete window.jsf.contextpath;
+
+    let faces4Init = faces.push.init;
+    /*
+     * we shim back the breaking api change from 3.0 to 4.0
+     * onerror is gone
+     */
+    faces.push.init = (socketClientId: string,
+                       url: string,
+                       channel: string,
+                       onopen: Function,
+                       onmessage: Function,
+                       // no on error api change for 4.0
+                       //onerror: Function,
+                       onclose: Function,
+                       behaviors: any,
+                       autoConnect: boolean) => {
+        faces4Init(socketClientId, url, channel, onopen, onmessage, null, onclose, behaviors, autoConnect);
+    }
 }
 if(!window?.myfaces?.ab) {
     const myfaces = require("./_api").myfaces;

package/src/main/typescript/impl/AjaxImpl.ts

@@ -50,7 +50,7 @@ import {
     CTX_PARAM_RENDER,
     REQ_TYPE_POST,
     SOURCE,
-    TAG_FORM
+    TAG_FORM, CTX_PARAM_SPEC_PARAMS
 } from "./core/Const";
 import {
     resolveDefaults,
@@ -81,7 +81,9 @@ enum BlockFilter {
     myfaces = "myfaces",
     delay = "delay",
     timeout = "timeout",
-    windowId = "windowId"
+    resetValues = "resetValues",
+    windowId = "windowId",
+    params = "params"
 }
 
 /**
@@ -267,7 +269,12 @@ export module Implementation {
 
         requestCtx.assignIf(!!windowId, P_WINDOW_ID).value = windowId;
 
+        // old non spec behavior will be removed after it is clear whether the removal breaks any code
         requestCtx.assign(CTX_PARAM_PASS_THR).value = filterPassThroughValues(options.value);
+
+        // spec conform behavior, all passthrough params must be under "passthrough
+        const params = remapArrayToAssocArr(options.getIf(CTX_PARAM_SPEC_PARAMS).orElse({}).value);
+        requestCtx.getIf(CTX_PARAM_PASS_THR).shallowMerge(new Config(params), true);
         requestCtx.assignIf(!!resolvedEvent, CTX_PARAM_PASS_THR, P_EVT).value = resolvedEvent?.type;
 
         /**
@@ -653,7 +660,13 @@ export module Implementation {
      * Filter the options given with a blacklist, so that only
      * the values required for pass-through are processed in the ajax request
      *
+     * Note this is a bug carried over from the old implementation
+     * the spec conform behavior is to use params for passthrough values
+     * this will be removed soon, after it is cleared up wheter removing
+     * it breaks any legacy code
+     *
      * @param {Context} mappedOpts the options to be filtered
+     * @deprecated
      */
     function filterPassThroughValues(mappedOpts: Context): Context {
         //we now can use the full code reduction given by our stream api
@@ -663,6 +676,13 @@ export module Implementation {
             .collect(new AssocArrayCollector());
     }
 
+    function remapArrayToAssocArr(arrayedParams: [[string, any]] | {[key: string]: any}): {[key: string]: any} {
+        if(Array.isArray(arrayedParams)) {
+            return Stream.of(... arrayedParams).collect(new AssocArrayCollector());
+        }
+        return arrayedParams;
+    }
+
     function resolveGlobalConfig(): any {
         return  window?.[MYFACES]?.config ?? {};
     }

package/src/main/typescript/impl/PushImpl.ts

@@ -18,13 +18,14 @@
  * Typescript port of the faces\.push part in the myfaces implementation
  */
 import {MAX_RECONNECT_ATTEMPTS, REASON_EXPIRED, RECONNECT_INTERVAL} from "./core/Const";
+import {DQ} from "mona-dish";
 
 /**
  * Implementation class for the push functionality
  */
 export module PushImpl {
 
-    const URL_PROTOCOL = window.location.protocol.replace("http", "ws") + "//";
+    const URL_PROTOCOL = DQ.global().location.protocol.replace("http", "ws") + "//";
 
 
     // we expose the member variables for testing purposes
@@ -55,6 +56,7 @@ export module PushImpl {
      * @param channel the channel name/id
      * @param onopen The function to be invoked when the web socket is opened.
      * @param onmessage The function to be invoked when a message is received.
+     * @param onerror The function to be invoked when an error occurs.
      * @param onclose The function to be invoked when the web socket is closed.
      * @param behaviors functions which are invoked whenever a message is received
      * @param autoConnect Whether or not to automatically open the socket. Defaults to <code>false</code>.
@@ -64,12 +66,13 @@ export module PushImpl {
                          channel: string,
                          onopen: Function,
                          onmessage: Function,
+                         onerror: Function,
                          onclose: Function,
                          behaviors: any,
                          autoConnect: boolean) {
         onclose = resolveFunction(onclose);
 
-        if (!window.WebSocket) { // IE6-9.
+        if (!DQ.global().WebSocket) { // IE6-9.
             onclose(-1, channel);
             return;
         }
@@ -81,6 +84,7 @@ export module PushImpl {
                 'channelToken': channelToken,
                 'onopen': resolveFunction(onopen),
                 'onmessage' : resolveFunction(onmessage),
+                'onerror' : resolveFunction(onerror),
                 'onclose': onclose,
                 'behaviors': behaviors,
                 'autoconnect': autoConnect};
@@ -95,16 +99,16 @@ export module PushImpl {
         }
 
         if (autoConnect) {
-            (window?.faces ?? window?.jsf).push.open(socketClientId);
+            (DQ.global()?.faces ?? DQ.global()?.jsf).push.open(socketClientId);
         }
     }
 
     export function open(socketClientId: string) {
-        getSocket(components?.[socketClientId]?.channelToken).open();
+        getSocket(components[socketClientId]?.channelToken).open();
     }
 
     export function close(socketClientId: string) {
-        getSocket(components?.[socketClientId].channelToken).close();
+        getSocket(components[socketClientId].channelToken).close();
     }
 
     // Private helper classes
@@ -142,24 +146,45 @@ export module PushImpl {
                 let clientIds = clientIdsByTokens[this.channelToken];
                 for (let i = clientIds.length - 1; i >= 0; i--) {
                     let socketClientId = clientIds[i];
-                    components[socketClientId]['onopen'](this.channel);
+                    components[socketClientId]?.['onopen']?.(this.channel);
                 }
             }
             this.reconnectAttempts = 0;
         }
 
+        onerror(event: any) {
+            let message = JSON.parse(event.data);
+            //TODO replace this with a more readable Stream code
+            for (let i = clientIdsByTokens[this.channelToken].length - 1; i >= 0; i--) {
+                let socketClientId = clientIdsByTokens[this.channelToken][i];
+                if (document.getElementById(socketClientId)) {
+                    try {
+                        components[socketClientId]?.['onerror']?.(message, this.channel, event);
+                    } catch (e) {
+                        //Ignore
+                    }
+                } else {
+                    clientIdsByTokens[this.channelToken].splice(i, 1);
+                }
+            }
+            if (clientIdsByTokens[this.channelToken].length == 0) {
+                // tag disappeared
+                this.close();
+            }
+        }
+
         onmmessage(event: any) {
             let message = JSON.parse(event.data);
             for (let i = clientIdsByTokens[this.channelToken].length - 1; i >= 0; i--) {
                 let socketClientId = clientIdsByTokens[this.channelToken][i];
                 if (document.getElementById(socketClientId)) {
                     try {
-                        components[socketClientId]['onmessage'](message, this.channel, event);
+                        components[socketClientId]?.['onmessage']?.(message, this.channel, event);
                     } catch (e) {
                         //Ignore
                     }
-                    let behaviors = components[socketClientId]['behaviors'];
-                    let functions = behaviors[message];
+                    let behaviors = components?.[socketClientId]?.['behaviors'];
+                    let functions = behaviors?.[message];
                     if (functions && functions.length) {
                         for (let j = 0; j < functions.length; j++) {
                             try {
@@ -188,7 +213,7 @@ export module PushImpl {
                 let clientIds = clientIdsByTokens[this.channelToken];
                 for (let i = clientIds.length - 1; i >= 0; i--) {
                     let socketClientId = clientIds[i];
-                    components[socketClientId]['onclose'](event?.code, this?.channel, event);
+                    components?.[socketClientId]?.['onclose']?.(event?.code, this?.channel, event);
                 }
             } else {
                 setTimeout(this.open, RECONNECT_INTERVAL * this.reconnectAttempts++);
@@ -210,6 +235,7 @@ export module PushImpl {
             this.socket.onopen = (event: Event) => this.onopen(event);
             this.socket.onmessage = (event: Event) => this.onmmessage(event);
             this.socket.onclose = (event: Event) => this.onclose(event);
+            this.socket.onerror = (event: Event) => this.onerror(event);
         }
     }
 
@@ -217,7 +243,7 @@ export module PushImpl {
 
     function getBaseURL(url: string) {
         if (url.indexOf("://") < 0) {
-            let base = window.location.hostname + ":" + window.location.port;
+            let base = DQ.global().location.hostname + ":" + DQ.global().location.port;
             return URL_PROTOCOL + base + url;
         } else {
             return url;
@@ -242,7 +268,7 @@ export module PushImpl {
 
     function resolveFunction(fn: Function | string = () => {
     }): Function {
-        return <Function>((typeof fn !== "function") && (fn = window[fn]), fn);
+        return <Function>((typeof fn !== "function") && (fn = DQ.global()[fn]), fn);
     }
 
 }

package/src/main/typescript/impl/core/Const.ts

@@ -20,6 +20,7 @@
 export const P_PARTIAL_SOURCE = "jakarta.faces.source";
 export const PARTIAL_ID = "partialId";
 export const P_VIEWSTATE = "jakarta.faces.ViewState";
+export const P_CLIENT_WINDOW = "jakarta.faces.ClientWindow";
 export const P_VIEWROOT = "jakarta.faces.ViewRoot";
 export const P_VIEWHEAD = "jakarta.faces.ViewHead";
 export const P_VIEWBODY = "jakarta.faces.ViewBody";
@@ -33,7 +34,8 @@ export const EMPTY_FUNC = Object.freeze(() => {
 export const EMPTY_STR = "";
 export const EMPTY_MAP = Object.freeze({});
 
-export const HTML_VIEWSTATE = ["<input type='hidden'", "id='", P_VIEWSTATE, "' name='", P_VIEWSTATE, "' value='' />"].join(EMPTY_STR);
+export const HTML_VIEWSTATE = ["<input type='hidden'", "name='", P_VIEWSTATE, "' value='' />"].join(EMPTY_STR);
+export const HTML_CLIENT_WINDOW = ["<input type='hidden'", "' name='", P_CLIENT_WINDOW, "' value='' />"].join(EMPTY_STR);
 
 
 /*internal identifiers for options*/
@@ -47,7 +49,7 @@ export const P_AJAX = "jakarta.faces.partial.ajax";
 export const P_EXECUTE = "jakarta.faces.partial.execute";
 export const P_RENDER = "jakarta.faces.partial.render";
 export const P_EVT = "jakarta.faces.partial.event";
-export const P_CLIENT_WINDOW = "jakarta.faces.ClientWindow";
+
 export const P_RESET_VALUES = "jakarta.faces.partial.resetValues";
 export const P_WINDOW_ID = "jakarta.faces.windowId";
 
@@ -93,6 +95,8 @@ export const CTX_PARAM_SRC_FRM_ID = "_mfSourceFormId";
 export const CTX_PARAM_SRC_CTL_ID = "_mfSourceControlId";
 export const CTX_PARAM_TR_TYPE = "_mfTransportType";
 export const CTX_PARAM_PASS_THR = "passThrgh";
+export const CTX_PARAM_SPEC_PARAMS = "params";
+
 export const CTX_PARAM_DELAY = "delay";
 export const CTX_PARAM_TIMEOUT = "timeout";
 export const CTX_PARAM_RST = "resetValues";
@@ -116,9 +120,9 @@ export const MULTIPART = "multipart/form-data";
 export const NO_TIMEOUT = 0;
 export const STD_ACCEPT = "text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8";
 
-export const TAG_HEAD = "head";
-export const TAG_FORM = "form";
-export const TAG_BODY = "body";
+export const TAG_HEAD = "HEAD";
+export const TAG_FORM = "FORM";
+export const TAG_BODY = "BODY";
 export const TAG_BEFORE = "before";
 export const TAG_AFTER = "after";
 

package/src/main/typescript/impl/util/Assertions.ts

@@ -16,9 +16,6 @@
 import {Config, Lang, XMLQuery} from "mona-dish";
 
 import {DQ} from "mona-dish";
-import {ExtLang} from "./Lang";
-import getMessage = ExtLang.getMessage;
-import makeException = ExtLang.makeException;
 import {
     ATTR_URL,
     EMPTY_RESPONSE,
@@ -28,6 +25,8 @@ import {
     PHASE_PROCESS_RESPONSE,
     RESP_PARTIAL
 } from "../core/Const";
+import {ExtLang} from "./Lang";
+
 
 /**
  * a set of internal code assertions
@@ -36,6 +35,8 @@ import {
  */
 export module Assertions {
 
+
+
     export function assertRequestIntegrity(options: Config, elem: DQ): void | never {
         /*assert if the onerror is set and once if it is set it must be of type function*/
         assertFunction(options.getIf(ON_ERROR).value);
@@ -43,12 +44,12 @@ export module Assertions {
         assertFunction(options.getIf(ON_EVENT).value);
         //improve the error messages if an empty elem is passed
         //Assertions.assertElementExists(elem);
-        assert(elem.isPresent(), getMessage("ERR_MUST_BE_PROVIDED1", "{0}: source  must be provided or exist", "source element id"), "faces.ajax.request", "ArgNotSet",  )
+        assert(elem.isPresent(), ExtLang.getMessage("ERR_MUST_BE_PROVIDED1", "{0}: source  must be provided or exist", "source element id"), "faces.ajax.request", "ArgNotSet",  )
     }
 
     export function assertUrlExists(node: XMLQuery): void | never {
         if (node.attr(ATTR_URL).isAbsent()) {
-            throw Assertions.raiseError(new Error(), getMessage("ERR_RED_URL", null, "processRedirect"), "processRedirect");
+            throw Assertions.raiseError(new Error(), ExtLang.getMessage("ERR_RED_URL", null, "processRedirect"), "processRedirect");
         }
     }
 
@@ -79,7 +80,7 @@ export module Assertions {
         let finalMessage = message ?? EMPTY_STR;
 
         //TODO clean up the messy makeException, this is a perfect case for encapsulation and sane defaults
-        return makeException(error, finalTitle, finalName, "Response", caller || (((<any>arguments).caller) ? (<any>arguments).caller.toString() : "_raiseError"), finalMessage);
+        return ExtLang.makeException(error, finalTitle, finalName, "Response", caller || (((<any>arguments).caller) ? (<any>arguments).caller.toString() : "_raiseError"), finalMessage);
     }
 
     /*
@@ -103,6 +104,13 @@ export module Assertions {
     export function assertFunction(value: any, msg = EMPTY_STR, caller=EMPTY_STR, title="Assertion Error"): asserts value is Function {
         assertType(value, "function", msg, caller, title);
     }
+
+    export function assertDelay(value: any) {
+        if(!(value >= 0)) { // >= 0 abbreviation which covers all cases of non positive values,
+            // including NaN and non numeric strings, no type equality is deliberate here,
+            throw new Error("Invalid delay value: " + value);
+        }
+    }
 }
 
 

package/src/main/typescript/impl/util/AsyncQueue.ts

@@ -58,7 +58,7 @@ export class AsynchronousQueue<T extends AsyncRunnable<any>> {
         if (delay) {
             this.delayTimeout = setTimeout(() => {
                 this.appendElement(element);
-            });
+            }) as any;
         } else {
             this.appendElement(element);
         }

package/src/main/typescript/impl/util/ExtDomQuery.ts

@@ -235,7 +235,7 @@ export class ExtDomQuery extends DQ {
      * @param deep whether the search should go into embedded shadow dom elements
      * @return a DomQuery containing the found elements
      */
-    static byId(selector: string | DomQuery | Element, deep = false): DomQuery {
+    static byId(selector: string | DomQuery | Element, deep = false): ExtDomQuery {
         const ret = DomQuery.byId(selector, deep);
         return new ExtDomQuery(ret);
     }
@@ -244,6 +244,9 @@ export class ExtDomQuery extends DQ {
         return (curScript.getAsElem(0).value as HTMLElement)?.nonce ?? curScript.attr("nonce").value;
     }
 
+    filter(func: (item: DomQuery) => boolean): ExtDomQuery {
+        return new ExtDomQuery(super.filter(func));
+    }
 }
 
 export const ExtDQ = ExtDomQuery;

package/src/main/typescript/impl/xhrCore/IResponseProcessor.ts

@@ -32,7 +32,6 @@ export interface IResponseProcessor {
      */
     replaceHead(shadowHead: XMLQuery | DQ): void;
 
-
     /**
      * adds new elements to the head
      *
@@ -40,6 +39,14 @@ export interface IResponseProcessor {
      */
     addToHead(newElements: XMLQuery | DQ): void;
 
+
+    /**
+     * adds new elements to the head in a deferred manner
+     *
+     * @param newElements the elements which need addition
+     */
+    addToHeadDeferred(newElements: XMLQuery | DQ): void;
+
     /**
      * replace the body
      *

package/src/main/typescript/impl/xhrCore/RequestDataResolver.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import {Config, DomQuery, DQ} from "mona-dish";
+import {AssocArrayCollector, Config, DomQuery, DQ, Stream} from "mona-dish";
 import {
     CTX_PARAM_DELAY,
     CTX_PARAM_TIMEOUT,
@@ -28,6 +28,8 @@ import {
 import {XhrFormData} from "./XhrFormData";
 import {ExtLang} from "../util/Lang";
 import {ExtConfig, ExtDomQuery} from "../util/ExtDomQuery";
+import {Assertions} from "../util/Assertions";
+
 
 /**
  * Resolver functions for various aspects of the request data
@@ -91,7 +93,15 @@ export function resolveTimeout(options: Config): number {
 export function resolveDelay(options: Config): number {
     let getCfg = ExtLang.getLocalOrGlobalConfig;
 
-    return options.getIf(CTX_PARAM_DELAY).value ?? getCfg(options.value, CTX_PARAM_DELAY, 0);
+    // null or non undefined will automatically be mapped to 0 aka no delay
+    let ret = options.getIf(CTX_PARAM_DELAY).value ?? getCfg(options.value, CTX_PARAM_DELAY, 0);
+    // if delay === none, no delay must be used, aka delay 0
+    if('none' === ret) {
+        ret = 0;
+    }
+    // negative, or invalid values will automatically get a js exception
+    Assertions.assertDelay(ret);
+    return ret;
 }
 
 /**
@@ -138,7 +148,7 @@ export function getEventTarget(evt: Event): Element {
  * @param opts
  * @param el
  */
-export function resolveDefaults(event: Event, opts: any = {}, el: Element | string = null) {
+export function resolveDefaults(event: Event, opts: Options | [[string, any]] , el: Element | string = null) {
     //deep copy the options, so that further transformations to not backfire into the callers
     const resolvedEvent = event,
         options = new ExtConfig(opts).deepCopy,