jsf.js_next_gen 4.0.0-beta-19 → 4.0.0-beta-21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jsf.js_next_gen",
-  "version": "4.0.0-beta-19",
+  "version": "4.0.0-beta-21",
   "description": "A next generation typescript reimplementation of jsf.js",
   "main": "dist/window/faces.js",
   "scripts": {
@@ -23,17 +23,17 @@
     "@istanbuljs/nyc-config-typescript": "^1.0.2",
     "@types/chai": "^4.3.3",
     "@types/mocha": "^10.0.0",
-    "@types/node": "^18.11.0",
+    "@types/node": "^18.11.9",
     "@types/sinon": "^10.0.13",
     "babel-plugin-syntax-dynamic-import": "^6.18.0",
     "chai": "^4.3.6",
     "compression-webpack-plugin": "^10.0.0",
     "html-webpack-plugin": "^5.5.0",
     "http-server": "^14.1.1",
-    "jsdom": "^20.0.1",
+    "jsdom": "^20.0.2",
     "jsdom-global": "^3.0.2",
     "mocha": "^10.1.0",
-    "npm-check-updates": "^16.3.13",
+    "npm-check-updates": "^16.3.16",
     "nyc": "^15.1.0",
     "replace-in-file": "^6.3.5",
     "rxjs": "^7.5.7",
@@ -41,13 +41,13 @@
     "terser-webpack-plugin": "^5.3.6",
     "ts-loader": "^9.4.1",
     "ts-node": "^10.9.1",
-    "typedoc": "^0.23.17",
+    "typedoc": "^0.23.20",
     "typescript": "^4.8.4",
     "webpack": "^5.74.0",
     "webpack-cli": "^4.10.0",
     "webpack-dev-server": "^4.11.1"
   },
   "dependencies": {
-    "mona-dish": "0.22.19"
+    "mona-dish": "0.23.2"
   }
 }

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

@@ -24,6 +24,8 @@ export const P_VIEWROOT = "jakarta.faces.ViewRoot";
 export const P_VIEWHEAD = "jakarta.faces.ViewHead";
 export const P_VIEWBODY = "jakarta.faces.ViewBody";
 
+export const P_RESOURCE = "jakarta.faces.Resource";
+
 /*some useful definitions*/
 
 export const EMPTY_FUNC = Object.freeze(() => {
@@ -156,6 +158,10 @@ export const CMD_REDIRECT = "redirect";
 export const UPDATE_FORMS = "_updateForms";
 export const UPDATE_ELEMS = "_updateElems";
 
+//we want the head elements to be processed before we process the body
+//but after the inner html is done
+export const DEFERRED_HEAD_INSERTS = "_headElems";
+
 export const MYFACES = "myfaces";
 
 export const SEL_SCRIPTS_STYLES = "script, style, link";

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

@@ -13,8 +13,10 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import {Config, IValueHolder, Optional, DomQuery, DQ, Stream, ArrayCollector} from "mona-dish";
+import {Config, IValueHolder, Optional, DomQuery, DQ, Stream, ArrayCollector, Lang} from "mona-dish";
 import {$nsp, P_WINDOW_ID} from "../core/Const";
+import equalsIgnoreCase = Lang.equalsIgnoreCase;
+import trim = Lang.trim;
 
 
 
@@ -132,6 +134,8 @@ export class ExtDomquery extends DQ {
         return null;
     }
 
+
+
     private extractNonce(curScript: DomQuery) {
         return (curScript.getAsElem(0).value as HTMLElement)?.nonce ?? curScript.attr("nonce").value;
     }
@@ -160,18 +164,70 @@ export class ExtDomquery extends DQ {
         return new ExtDomquery(super.globalEval(code, nonce ?? this.nonce));
     }
 
+    globalEvalSticky(code: string, nonce ?: string): DQ {
+        return new ExtDomquery(super.globalEvalSticky(code, nonce ?? this.nonce));
+    }
+
     /**
      * decorated run scripts which takes our jsf extensions into consideration
      * (standard DomQuery will let you pass anything)
      * @param whilteListed
      */
-    runScripts(whilteListed?: (src: string) => boolean): DomQuery {
+    runScripts(sticky = false, whilteListed?: (src: string) => boolean): DomQuery {
         const whitelistFunc = (src: string): boolean => {
             return (whilteListed?.(src) ?? true) && !IS_FACES_SOURCE(src) && !IS_INTERNAL_SOURCE(src);
         };
-        return super.runScripts(whitelistFunc);
+        return super.runScripts(sticky, whitelistFunc);
+    }
+
+    /**
+     * adds the elements in this ExtDomQuery to the head
+     *
+     * @param newElements the elements which need addition
+     */
+    runHeadInserts(suppressDoubleIncludes = true): void {
+        let head = ExtDomquery.byId(document.head);
+        //automated nonce handling
+        let processedScripts = [];
+
+        // the idea is only to run head inserts on resources
+        // which do not exist already, that way
+        // we can avoid double includes on subsequent resource
+        // requests.
+        function resourceIsNew(element: DomQuery) {
+            if(!suppressDoubleIncludes) {
+                return true;
+            }
+            const tagName = element.tagName.value;
+            if(!tagName) {
+                // textnode
+                return true;
+            }
+            let href = element.attr("href").orElse(element.attr("src").value);
+
+            if (!href.isPresent()) {
+                return true;
+            }
+            return !head.querySelectorAll(`${tagName}[href='${href.value}']`).length &&
+                !head.querySelectorAll(`${tagName}[src='${href.value}']`).length;
+        }
+
+        this
+            .filter(resourceIsNew)
+            .each(element => {
+                if(element.tagName.value != "SCRIPT") {
+                    //we need to run runScripts properly to deal with the rest
+                    new ExtDomquery(...processedScripts).runScripts(true);
+                    processedScripts = [];
+                    head.append(element);
+                } else {
+                    processedScripts.push(element);
+                }
+            });
+        new ExtDomquery(...processedScripts).runScripts(true);
     }
 
+
     /**
      * byId producer
      *
@@ -183,6 +239,8 @@ export class ExtDomquery extends DQ {
         const ret = DomQuery.byId(selector, deep);
         return new ExtDomquery(ret);
     }
+
+
 }
 
 export const ExtDQ = ExtDomquery;

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

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

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

@@ -27,7 +27,8 @@ import {
     SOURCE,
     TAG_FORM,
     UPDATE_ELEMS,
-    UPDATE_FORMS
+    UPDATE_FORMS,
+    DEFERRED_HEAD_INSERTS
 } from "../core/Const";
 import {ExtConfig} from "../util/ExtDomQuery";
 
@@ -75,6 +76,7 @@ export function resolveContexts(context: { [p: string]: any }): any {
     /**
      * prepare storage for some deferred operations
      */
+    internalContext.assign(DEFERRED_HEAD_INSERTS).value = [];
     internalContext.assign(UPDATE_FORMS).value = [];
     internalContext.assign(UPDATE_ELEMS).value = [];
     return {externalContext, internalContext};

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

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import {Config, DQ, XMLQuery} from "mona-dish";
+import {DQ, XMLQuery} from "mona-dish";
 import {ResponseProcessor} from "./ResponseProcessor";
 
 import {IResponseProcessor} from "./IResponseProcessor";
@@ -28,7 +28,7 @@ import {
     CMD_EXTENSION,
     CMD_INSERT,
     CMD_REDIRECT,
-    CMD_UPDATE,
+    CMD_UPDATE, P_RESOURCE,
     P_VIEWBODY,
     P_VIEWHEAD,
     P_VIEWROOT,
@@ -205,6 +205,10 @@ export module Response {
                 responseProcessor.replaceBody(DQ.fromMarkup(cdataBlock));
                 break;
 
+            case $nsp(P_RESOURCE):
+                responseProcessor.addToHead(DQ.fromMarkup(cdataBlock))
+                break;
+
             default://htmlItem replacement
                 responseProcessor.update(node, cdataBlock);
                 break;

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

@@ -51,7 +51,8 @@ import {
     TAG_FORM,
     TAG_HEAD,
     UPDATE_ELEMS,
-    UPDATE_FORMS
+    UPDATE_FORMS,
+    DEFERRED_HEAD_INSERTS
 } from "../core/Const";
 import trim = Lang.trim;
 import {ExtConfig, ExtDomquery} from "../util/ExtDomQuery";
@@ -86,7 +87,7 @@ export class ResponseProcessor implements IResponseProcessor {
             return;
         }
 
-        let oldHead = DQ.querySelectorAll(TAG_HEAD);
+        let oldHead = ExtDomquery.querySelectorAll(TAG_HEAD);
 
         //delete all to avoid script and style overlays
         oldHead.querySelectorAll(SEL_SCRIPTS_STYLES).delete();
@@ -95,8 +96,17 @@ export class ResponseProcessor implements IResponseProcessor {
         // eval means the scripts will get attached (eval script attach method)
         // but this is done by DomQuery not in this code
         this.storeForEval(shadowHead);
+        //incoming either the outer head tag or its childs
+        //shadowHead = (shadowHead.tagName.value === "HEAD") ? shadowHead.childNodes : shadowHead;
+        //this.addToHead(shadowHead);
     }
 
+    addToHead(newElements: XMLQuery | DQ) {
+        this.internalContext.assign(DEFERRED_HEAD_INSERTS).value.push(newElements);
+    }
+
+
+
     /**
      * replaces the body in the expected manner
      * which means the entire body content is refreshed
@@ -114,7 +124,7 @@ export class ResponseProcessor implements IResponseProcessor {
 
         let shadowInnerHTML: string = <string>shadowBody.html().value;
 
-        let resultingBody = <DQ>DQ.querySelectorAll(TAG_BODY).html(shadowInnerHTML);
+        let resultingBody = <DQ>ExtDomquery.querySelectorAll(TAG_BODY).html(shadowInnerHTML);
         let updateForms = resultingBody.querySelectorAll(TAG_FORM);
 
         // main difference, we cannot replace the body itself, but only its content
@@ -130,7 +140,7 @@ export class ResponseProcessor implements IResponseProcessor {
      * @param node the node to eval
      */
     eval(node: XMLQuery) {
-        DQ.globalEval(node.cDATAAsString);
+        ExtDomquery.globalEval(node.cDATAAsString);
     }
 
     /**
@@ -303,8 +313,14 @@ export class ResponseProcessor implements IResponseProcessor {
      * generic global eval which runs the embedded css and scripts
      */
     globalEval() {
+        //  phase one, if we have head inserts, we build up those before going into the script eval phase
+        let insertHeadElems = new ExtDomquery(...this.internalContext.getIf(DEFERRED_HEAD_INSERTS).value);
+        insertHeadElems.runHeadInserts(true);
+
+        // phase 2 we run a script eval on all updated elements in the body
         let updateElems = new ExtDomquery(...this.internalContext.getIf(UPDATE_ELEMS).value);
         updateElems.runCss();
+        // phase 3, we do the same for the css
         updateElems.runScripts();
     }
 
@@ -433,6 +449,11 @@ export class ResponseProcessor implements IResponseProcessor {
         this.internalContext.assign(UPDATE_ELEMS).value.push(toBeEvaled);
     }
 
+    // head eval is always sticky
+    private storeForHeadEval(toBeEvaled: DQ, sticky) {
+        this.internalContext.assign(DEFERRED_HEAD_INSERTS).value.push(toBeEvaled);
+    }
+
     /**
      * check whether a given XMLQuery node is an explicit viewstate node
      *
@@ -463,4 +484,5 @@ export class ResponseProcessor implements IResponseProcessor {
         this.externalContext.getIf(ON_ERROR).orElse(this.internalContext.getIf(ON_ERROR).value).orElse(EMPTY_FUNC).value(errorData);
     }
 
+
 }