@qooxdoo/framework 7.0.0 → 7.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qooxdoo/framework",
-  "version": "7.0.0",
+  "version": "7.1.0",
   "description": "The JS Framework for Coders",
   "author": "The qooxdoo project",
   "keywords": [
@@ -74,6 +74,7 @@
     "app-module-path": "^2.2.0",
     "async": "^2.6.3",
     "better-ajv-errors": "^1.1.1",
+    "browserify": "^17.0.0",
     "chokidar": "^3.5.1",
     "cldr": "^7.1.1",
     "columnify": "^1.5.4",

package/source/class/qx/tool/cli/api/AbstractApi.js

@@ -86,7 +86,10 @@ qx.Class.define("qx.tool.cli.api.AbstractApi", {
      */
     loadNpmModule(module) {
       const { execSync } = require("child_process");
-      let s = `npm install --no-save --no-package-lock ${module}`;
+      // since npm 7 --no-save deletes the node_modules folder
+      // see https://github.com/npm/cli/pull/3907
+//       let s = `npm install --no-save --no-package-lock ${module}`;
+      let s = `npm install --no-package-lock ${module}`;
       qx.tool.compiler.Console.info(s);
       execSync(s, {
         stdio: "inherit"

package/source/class/qx/tool/cli/commands/Compile.js

@@ -915,6 +915,7 @@ Framework: v${await this.getQxVersion()} in ${await this.getQxPath()}`);
        */
       let targetOutputPaths = {};
       let makers = [];
+
       targetConfigs.forEach(targetConfig => {
         if (!targetConfig.appConfigs) {
           qx.tool.compiler.Console.print(

package/source/class/qx/tool/cli/commands/Lint.js

@@ -157,13 +157,23 @@ qx.Class.define("qx.tool.cli.commands.Lint", {
         }
         if (report.errorCount > 0 || report.warningCount > 0) {
           let outputFormat = this.argv.format || "codeframe";
-
-          // If there are too many errors, the pretty formatter is appallingly slow
-          if (report.errorCount + report.warningCount > 150) {
-            outputFormat = "compact";
-          }
           const formatter = await linter.loadFormatter(outputFormat);
           const s = formatter.format(report);
+          // If there are too many errors, the pretty formatter is appallingly slow so if the
+          // user has not specified a format, change to compact mode
+          const maxDefaultFormatErrorCount = 150;
+          if (report.errorCount + report.warningCount > maxDefaultFormatErrorCount) {
+            if (!this.argv.format) {
+              qx.tool.compiler.Console.info(
+                `Total errors and warnings exceed ${maxDefaultFormatErrorCount}, switching to "compact" style report`
+              );
+              outputFormat = "compact";
+            } else {
+              qx.tool.compiler.Console.info(
+                `Total errors and warnings exceed ${maxDefaultFormatErrorCount}, the report may take some time to generate.`
+              );
+            }
+          }
           if (this.argv.outputFile) {
             if (this.argv.verbose) {
               qx.tool.compiler.Console.info(

package/source/class/qx/tool/compiler/ClassFile.js

@@ -223,6 +223,7 @@ qx.Class.define("qx.tool.compiler.ClassFile", {
     };
 
     this.__externals = [];
+    this.__commonjsModules = {};
 
     this.__taskQueueDrains = [];
     this.__taskQueue = async.queue(function (task, cb) {
@@ -281,6 +282,7 @@ qx.Class.define("qx.tool.compiler.ClassFile", {
     __privates: null,
     __blockedPrivates: null,
     __externals: null,
+    __commonjsModules: null,
 
     _onTaskQueueDrain() {
       var cbs = this.__taskQueueDrain;
@@ -496,6 +498,7 @@ qx.Class.define("qx.tool.compiler.ClassFile", {
       delete dbClassInfo.translations;
       delete dbClassInfo.markers;
       delete dbClassInfo.fatalCompileError;
+      delete dbClassInfo.commonjsModules;
       for (var key in this.__dbClassInfo) {
         dbClassInfo[key] = this.__dbClassInfo[key];
       }
@@ -667,6 +670,14 @@ qx.Class.define("qx.tool.compiler.ClassFile", {
         dbClassInfo.fatalCompileError = true;
       }
 
+      // CommonJS modules
+      if (Object.keys(this.__commonjsModules).length > 0) {
+        dbClassInfo.commonjsModules = {};
+        for (let moduleName in this.__commonjsModules) {
+          dbClassInfo.commonjsModules[moduleName] = [ ...this.__commonjsModules[moduleName] ];
+        }
+      }
+
       return dbClassInfo;
     },
 
@@ -1648,6 +1659,52 @@ qx.Class.define("qx.tool.compiler.ClassFile", {
               }
             }
 
+            // Are we looking at the Identifier `require`, and is it a
+            // function call (identified by having
+            // `path.node.arguments`? If so, we'll add the discovered
+            // module to the list of modules that must be browserified
+            // if the application is destined for the browser.
+            let scope;
+            let applicationTypes = t.__analyser.getApplicationTypes();
+
+            if (path.node.callee.type == "Identifier" &&
+                path.node?.callee?.name == "require" &&
+                path.node.arguments?.length == 1 &&
+                applicationTypes.includes("browser")) {
+
+              // See if this is a reference to global `require` or
+              // something in the scope chain
+              for (scope = t.__scope; scope; scope = scope.parent) {
+                if (scope.vars["require"]) {
+                  // It's in the scope chain. Ignore it.
+                  break;
+                }
+              }
+              // Did we reach top level without finding it in a local scope?
+              if (! scope) {
+                // Yup. It's the global one we're looking for. Ensure the argument is valid.
+                let arg = path.node.arguments[0];
+                if (types.isLiteral(arg)) {
+                  if (typeof arg.value != "string") {
+                    log.error(
+                      `${t.__className}: ` +
+                        "Only literal string arguments to require() are supported: " +
+                        arg.value
+                    );
+                  } else {
+                    qx.tool.compiler.Console.log(
+                      `${t.__className}:${path.node.loc.start.line}:` +
+                        ` automatically detected \'require(${arg.value})\``);
+                    t.addCommonjsModule(arg.value, t.__className, path.node.loc.start.line);
+
+                    // Don't show "unresolved" error for `require` since the
+                    // browserified code defines it as a global
+                    t.addIgnore("require");
+                  }
+                }
+              }
+            }
+
             if (
               types.isMemberExpression(path.node.callee) ||
               (es6ClassDeclarations == 0 &&
@@ -2506,6 +2563,19 @@ qx.Class.define("qx.tool.compiler.ClassFile", {
       }
     },
 
+    /**
+     * Adds a CommonJS module to be browserified
+     *
+     * @param name {String} name of the module
+     */
+    addCommonjsModule(moduleName, className, linenum) {
+      if (! this.__commonjsModules[moduleName]) {
+        this.__commonjsModules[moduleName] = new Set();
+      }
+
+      this.__commonjsModules[moduleName].add(`${className}:${linenum}`);
+    },
+
     /**
      * Adds an ignored symbol
      * @param name {String} name of the symbol

package/source/class/qx/tool/compiler/TargetError.js

@@ -0,0 +1,27 @@
+/* ************************************************************************
+ *
+ *    qooxdoo-compiler - node.js based replacement for the Qooxdoo python
+ *    toolchain
+ *
+ *    https://github.com/qooxdoo/qooxdoo-compiler
+ *
+ *    Copyright:
+ *      3033 Derrell Lipman
+ *
+ *    License:
+ *      MIT: https://opensource.org/licenses/MIT
+ *
+ *      This software is provided under the same licensing terms as Qooxdoo,
+ *      please see the LICENSE file in the Qooxdoo project's top-level directory
+ *      for details.
+ *
+ *    Authors:
+ *      * Derrell Lipman (@derrell)
+ *
+ * ************************************************************************/
+
+qx.Class.define("qx.tool.compiler.TargetError",
+{
+//  extend : qx.type.BaseError
+  extend : Error
+});

package/source/class/qx/tool/compiler/targets/Target.js

@@ -432,6 +432,12 @@ qx.Class.define("qx.tool.compiler.targets.Target", {
         new qx.tool.compiler.targets.meta.PolyfillJs(appMeta)
       );
 
+      // Add browserified CommonJS modules, if any
+      if (appMeta.getEnvironmentValue("qx.compiler.applicationType") == "browser") {
+        bootPackage.addJavascriptMeta(
+          new qx.tool.compiler.targets.meta.Browserify(appMeta));
+      }
+
       /*
        * Assemble the Parts
        */

package/source/class/qx/tool/compiler/targets/meta/AbstractJavascriptMeta.js

@@ -26,7 +26,7 @@ const sourceMap = require("source-map");
 
 /**
  * An AbstractJavascriptMeta provides an abstraction of some source code, and might be
- * compromised of a number of input files which are merged together as required.
+ * comprised of a number of input files which are merged together as required.
  *
  * This object could represent a file which already exists on disk (eg a transpiled
  * source file), or something that is generated on the fly (such as a index.js), or

package/source/class/qx/tool/compiler/targets/meta/Browserify.js

@@ -0,0 +1,143 @@
+/* ************************************************************************
+ *
+ *    qooxdoo-compiler - node.js based replacement for the Qooxdoo python
+ *    toolchain
+ *
+ *    https://github.com/qooxdoo/qooxdoo-compiler
+ *
+ *    Copyright:
+ *      2022 Derrell Lipman
+ *
+ *    License:
+ *      MIT: https://opensource.org/licenses/MIT
+ *
+ *      This software is provided under the same licensing terms as Qooxdoo,
+ *      please see the LICENSE file in the Qooxdoo project's top-level directory
+ *      for details.
+ *
+ *    Authors:
+ *      * Derrell Lipman (@derrell)
+ *
+ * ************************************************************************/
+
+const fs = qx.tool.utils.Promisify.fs;
+const path = require("upath");
+
+/**
+ * 
+ */
+qx.Class.define("qx.tool.compiler.targets.meta.Browserify", {
+  extend: qx.tool.compiler.targets.meta.AbstractJavascriptMeta,
+
+  construct(appMeta) {
+    super(appMeta, `${appMeta.getApplicationRoot()}commonjs-browserify.js`);
+    this.__appMeta = appMeta;
+    this.setNeedsWriteToDisk(true);
+  },
+
+  members: {
+    __appMeta : null,
+
+    /**
+     * @Override
+     */
+    async writeSourceCodeToStream(ws) {
+      let hasCommonjsModules = false;
+      let commonjsModules = new Set();
+      let references = {};
+      const db = this.__appMeta.getAnalyser().getDatabase();
+
+      // Get a Set of unique `require`d CommonJS module names from all classes
+      for (let className in db.classInfo) {
+        let classInfo = db.classInfo[className];
+        if (classInfo.commonjsModules) {
+          Object.keys(classInfo.commonjsModules).forEach(
+            moduleName =>
+            {
+              // Add this module name to the set of module names
+              commonjsModules.add(moduleName);
+
+              // Add the list of references from which this module was require()d
+              if (! references[moduleName]) {
+                references[moduleName] = new Set();
+              }
+              references[moduleName].add([ ...classInfo.commonjsModules[moduleName] ]);
+
+              // There is at least one module
+              hasCommonjsModules = true;
+            });
+        }
+      }
+
+      // If there are any CommonJS modules required, browserify them
+      if (hasCommonjsModules) {
+        await this.__browserify(
+          commonjsModules,
+          references,
+          ws
+        );
+      }
+
+      await new Promise(resolve => {
+        ws.write("\n", resolve);
+      });
+    },
+
+    async __browserify(commonjsModules, references, ws) {
+      let b;
+      const browserify = require("browserify");
+      const builtins = require("browserify/lib/builtins.js");
+
+      // For some reason, `process` is not require()able, but `_process` is.
+      // Make them equivalent.
+      builtins.process = builtins._process;
+
+      // Convert the Set of CommonJS module names to an array
+      commonjsModules = [...commonjsModules];
+
+      return new Promise(resolve =>
+        {
+          b = browserify(
+            [],
+            {
+              builtins      : builtins,
+              ignoreMissing : true,
+              insertGlobals : true,
+              detectGlobals : true
+            });
+          b._mdeps.on("missing", (id, parent) => {
+              let message = [];
+
+              message.push(`ERROR: could not locate require()d module: "${id}"`);
+              message.push("  required from:");
+              [ ...references[id] ].forEach(refs => {
+                refs.forEach(ref =>
+                  {
+                    message.push(`    ${ref}`);
+                  });
+              });
+
+              qx.tool.compiler.Console.error(message.join("\n"));
+            });
+          b.require(commonjsModules);
+          b.bundle((e, output) => {
+            if (e) {
+              // We've already handled the case of missing module. This is something else.
+              qx.tool.compiler.Console.error(`Failed: ${e}`);
+              throw(e);
+            }
+
+            ws.write(output);
+            resolve(null);
+          });
+        });
+    },
+
+    /**
+     * @Override
+     */
+    async getSourceMap() {
+      return null;
+    }
+  }
+});

package/source/class/qx/ui/form/AbstractSelectBox.js

@@ -210,7 +210,10 @@ qx.Class.define("qx.ui.form.AbstractSelectBox", {
      * Hides the list popup.
      */
     close() {
-      this.getChildControl("popup").hide();
+      var popup = this.getChildControl("popup", true);
+      if (popup && popup.isVisible()) {
+        popup.hide();
+      }
     },
 
     /**

package/source/class/qx/ui/form/DateField.js

@@ -312,7 +312,10 @@ qx.Class.define("qx.ui.form.DateField", {
      * Hides the date chooser popup.
      */
     close() {
-      this.getChildControl("popup").hide();
+      var popup = this.getChildControl("popup", true);
+      if (popup && popup.isVisible()) {
+        popup.hide();
+      }
     },
 
     /**

package/source/class/qx/ui/progressive/renderer/table/Row.js

@@ -284,7 +284,8 @@ qx.Class.define("qx.ui.progressive.renderer.table.Row", {
           element: element,
           dataIndex: i,
           cellData: data[i],
-          height: height
+          height: height,
+          rowRenderer: this     // useful, e.g., for getting default row height
         };
 
         // Render this cell

package/source/class/qx/ui/progressive/renderer/table/cell/Boolean.js

@@ -28,13 +28,13 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Boolean", {
   construct() {
     super();
 
-    this.__resolveImages();
+    this._resolveImages();
 
     // dynamic theme switch
     if (qx.core.Environment.get("qx.dyntheme")) {
       qx.theme.manager.Meta.getInstance().addListener(
         "changeTheme",
-        this.__resolveImages,
+        this._resolveImages,
         this
       );
     }
@@ -53,19 +53,13 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Boolean", {
   },
 
   members: {
-    __iconUrlTrue: null,
-    __iconUrlFalse: null,
-    __numericAllowed: null,
-    __conditions: null,
-    __defaultTextAlign: null,
-    __defaultColor: null,
-    __defaultFontStyle: null,
-    __defaultFontWeight: null,
+    _iconUrlTrue: null,
+    _iconUrlFalse: null,
 
     /**
      * Resolve the boolean images using the alias and resource manager.
      */
-    __resolveImages() {
+    _resolveImages() {
       var aliasManager = qx.util.AliasManager.getInstance();
       var resourceManager = qx.util.ResourceManager.getInstance();
       var boolTrueImg = aliasManager.resolve(
@@ -76,25 +70,29 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Boolean", {
         "decoration/table/boolean-false.png"
       );
 
-      this.__iconUrlTrue = resourceManager.toUri(boolTrueImg);
-      this.__iconUrlFalse = resourceManager.toUri(boolFalseImg);
+      this._iconUrlTrue = resourceManager.toUri(boolTrueImg);
+      this._iconUrlFalse = resourceManager.toUri(boolFalseImg);
     },
 
-    // overridden
-    _identifyImage(cellInfo) {
-      var imageData = {
+    _getDefaultImageData(cellInfo) {
+      return {
         imageWidth: 11,
         imageHeight: 11
       };
+    },
+
+    // overridden
+    _identifyImage(cellInfo) {
+      var imageData = this._getDefaultImageData(cellInfo);
 
       switch (cellInfo.cellData) {
         case true:
-          imageData.url = this.__iconUrlTrue;
+          imageData.url = this._iconUrlTrue;
           imageData.extras = "celldata='1' ";
           break;
 
         case false:
-          imageData.url = this.__iconUrlFalse;
+          imageData.url = this._iconUrlFalse;
           imageData.extras = "celldata='0' ";
           break;
 
@@ -115,7 +113,7 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Boolean", {
 
         if (
           qx.core.Environment.get("css.alphaimageloaderneeded") &&
-          /\.png$/i.test(this.__iconUrlTrue)
+          /\.png$/i.test(this._iconUrlTrue)
         ) {
           imageData.extras +=
             "  this.src='" +
@@ -124,18 +122,18 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Boolean", {
             "  var loader = 'DXImageTransform.Microsoft.AlphaImageLoader'; " +
             "  var filters = this.filters.item(loader); " +
             "  filters.src='" +
-            this.__iconUrlTrue +
+            this._iconUrlTrue +
             "'; " +
             "  filters.sizingMethod = 'scale'; ";
         } else {
-          imageData.extras += "  this.src='" + this.__iconUrlTrue + "'; ";
+          imageData.extras += "  this.src='" + this._iconUrlTrue + "'; ";
         }
 
         imageData.extras += "  node.nodeValue='1'; " + "} " + "else " + "{";
 
         if (
           qx.core.Environment.get("css.alphaimageloaderneeded") &&
-          /\.png$/i.test(this.__iconUrlFalse)
+          /\.png$/i.test(this._iconUrlFalse)
         ) {
           imageData.extras +=
             "  this.src='" +
@@ -144,11 +142,11 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Boolean", {
             "  var loader = 'DXImageTransform.Microsoft.AlphaImageLoader'; " +
             "  var filters = this.filters.item(loader); " +
             "  filters.src='" +
-            this.__iconUrlFalse +
+            this._iconUrlFalse +
             "'; " +
             "  filters.sizingMethod = 'scale'; ";
         } else {
-          imageData.extras += "  this.src='" + this.__iconUrlFalse + "'; ";
+          imageData.extras += "  this.src='" + this._iconUrlFalse + "'; ";
         }
 
         imageData.extras += "  node.nodeValue='0'; " + "}";
@@ -176,13 +174,13 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Boolean", {
   },
 
   destruct() {
-    this.__iconUrlTrue = this.__iconUrlFalse = null;
+    this._iconUrlTrue = this._iconUrlFalse = null;
 
     // remove dynamic theme listener
     if (qx.core.Environment.get("qx.dyntheme")) {
       qx.theme.manager.Meta.getInstance().removeListener(
         "changeTheme",
-        this.__resolveImages,
+        this._resolveImages,
         this
       );
     }

package/source/class/qx/ui/progressive/renderer/table/cell/Icon.js

@@ -21,6 +21,8 @@
 
 /**
  * Abstract Icon cell renderer.
+ *
+ * @asset(qx/static/blank.gif)
  */
 qx.Class.define("qx.ui.progressive.renderer.table.cell.Icon", {
   type: "abstract",
@@ -34,14 +36,14 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Icon", {
     var resourceManager = qx.util.ResourceManager.getInstance();
     var blankImg = aliasManager.resolve("qx/static/blank.gif");
 
-    this.__imageBlank = resourceManager.toUri(blankImg);
+    this._imageBlank = resourceManager.toUri(blankImg);
   },
 
   members: {
     /**
      * A blank image for use as a spacer in place of another image
      */
-    __imageBlank: null,
+    _imageBlank: null,
 
     /**
      * Retrieve the URI for a blank image
@@ -50,7 +52,7 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Icon", {
      *   The URI of the blank image.
      */
     getBlankImage() {
-      return this.__imageBlank;
+      return this._imageBlank;
     },
 
     /**
@@ -118,7 +120,7 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Icon", {
     // overridden
     _getContentHtml(cellInfo) {
       var html = [];
-      var imageData = this.__getImageData(cellInfo);
+      var imageData = this._getImageData(cellInfo);
 
       // Start the image tag
       html.push("<img ");
@@ -130,7 +132,7 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Icon", {
       ) {
         html.push(
           'src="',
-          this.__imageBlank,
+          this._imageBlank,
           '" style="filter:',
           "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='",
           imageData.url,
@@ -192,7 +194,7 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Icon", {
      * @return {Map}
      *   See {@link #_identifyImage}
      */
-    __getImageData(cellInfo) {
+    _getImageData(cellInfo) {
       // Query the subclass about image and tooltip
       var imageData = this._identifyImage(cellInfo);
 
@@ -206,7 +208,7 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Icon", {
 
       // If subclass gave null as url, replace with url to empty image
       if (imageData.url == null) {
-        imageData.url = this.__imageBlank;
+        imageData.url = this._imageBlank;
       }
 
       return imageData;

package/source/class/qx/ui/progressive/renderer/table/cell/Image.js

@@ -34,31 +34,34 @@ qx.Class.define("qx.ui.progressive.renderer.table.cell.Image", {
   construct(width, height) {
     super();
 
-    if (width === undefined) {
-      this.__imageWidth = width;
+    if (width !== undefined) {
+      this._imageWidth = width;
     } else {
-      this.__imageWidth = 16;
+      this._imageWidth = 16;
     }
 
-    if (height === undefined) {
-      this.__imageHeight = height;
+    if (height !== undefined) {
+      this._imageHeight = height;
     } else {
-      this.__imageHeight = 16;
+      this._imageHeight = 16;
     }
   },
 
   members: {
-    __imageWidth: null,
-    __imageHeight: null,
+    _imageWidth: null,
+    _imageHeight: null,
 
-    // overridden
-    _identifyImage(cellInfo) {
-      var imageData = {
-        imageWidth: this.__imageWidth,
-        imageHeight: this.__imageHeight
+    _getDefaultImageData(cellInfo) {
+      return {
+        imageWidth: this._imageWidth,
+        imageHeight: this._imageHeight
       };
+    },
 
+    // overridden
+    _identifyImage(cellInfo) {
       var height;
+      var imageData = this._getDefaultImageData(cellInfo);
 
       // String data is the unresolved url for the image.
       // Object data is a map containing the url, tooltip, and a height

package/source/class/qx/ui/table/Table.js

@@ -2193,7 +2193,6 @@ qx.Class.define("qx.ui.table.Table", {
       );
     }
 
-    this._cleanUpMetaColumns(0);
     this.getTableColumnModel().dispose();
     this._disposeObjects(
       "__selectionManager",