Merge branch 'master' into dev

packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js

@@ -568,56 +568,6 @@
                 done(labelWidth);
             }
         },
-        _resize: function() {
-            var that = this;
-            if (this.uiWidth !== null) {
-                this.uiSelect.width(this.uiWidth);
-            }
-            var type = this.typeMap[this.propertyType];
-            if (type && type.hasValue === false) {
-                this.selectTrigger.addClass("red-ui-typedInput-full-width");
-            } else {
-                this.selectTrigger.removeClass("red-ui-typedInput-full-width");
-                this._getLabelWidth(this.selectTrigger, function(labelWidth) {
-                    that.elementDiv.css('left',labelWidth+"px");
-                    that.valueLabelContainer.css('left',labelWidth+"px");
-                    if (that.optionExpandButton.shown) {
-                        that.elementDiv.css('right',"22px");
-                        that.valueLabelContainer.css('right',"22px");
-                    } else {
-                        that.elementDiv.css('right','0');
-                        that.valueLabelContainer.css('right','0');
-                        that.input.css({
-                            'border-top-right-radius': '4px',
-                            'border-bottom-right-radius': '4px'
-                        });
-                    }
-                    if (that.optionSelectTrigger) {
-                        if (type && type.options && type.hasValue === true) {
-                            that.optionSelectLabel.css({'left':'auto'})
-                            that._getLabelWidth(that.optionSelectLabel, function(lw) {
-                                that.optionSelectTrigger.css({'width':(23+lw)+"px"});
-                                that.elementDiv.css('right',(23+lw)+"px");
-                                that.input.css({
-                                    'border-top-right-radius': 0,
-                                    'border-bottom-right-radius': 0
-                                });
-                            });
-                        } else {
-                            that.optionSelectLabel.css({'left':'0'})
-                            that.optionSelectTrigger.css({'width':'calc( 100% - '+labelWidth+'px )'});
-                            if (!that.optionExpandButton.shown) {
-                                that.elementDiv.css({'right':0});
-                                that.input.css({
-                                    'border-top-right-radius': '4px',
-                                    'border-bottom-right-radius': '4px'
-                                });
-                            }
-                        }
-                    }
-                });
-            }
-        },
         _updateOptionSelectLabel: function(o) {
             var opt = this.typeMap[this.propertyType];
             this.optionSelectLabel.empty();
@@ -645,7 +595,6 @@
                 }
                 if (opt.hasValue) {
                     this.optionValue = o.value;
-                    this._resize();
                     this.input.trigger('change',this.propertyType,this.value());
                 }
             } else {
@@ -685,11 +634,12 @@
                 this.propertyType = null;
                 this.type(currentType);
             }
-            setTimeout(function() {that._resize();},0);
         },
         width: function(desiredWidth) {
             this.uiWidth = desiredWidth;
-            this._resize();
+            if (this.uiWidth !== null) {
+                this.uiSelect.width(this.uiWidth);
+            }
         },
         value: function(value) {
             var that = this;
@@ -760,8 +710,6 @@
                         }
                         else if (opt.icon.indexOf("/") !== -1) {
                             image = new Image();
-                            image.onload = function() { that._resize(); }
-                            image.onerror = function() { that._resize(); }
                             image.name = opt.icon;
                             image.src = mapDeprecatedIcon(opt.icon);
                             $('<img>',{src:mapDeprecatedIcon(opt.icon),style:"margin-right: 4px;height: 18px;"}).prependTo(this.selectLabel);
@@ -773,6 +721,12 @@
                     if (opt.hasValue === false || (opt.showLabel !== false && !opt.icon)) {
                         this.selectLabel.text(opt.label);
                     }
+                    if (opt.hasValue === false) {
+                        this.selectTrigger.addClass("red-ui-typedInput-full-width");
+                    } else {
+                        this.selectTrigger.removeClass("red-ui-typedInput-full-width");
+                    }
+
                     if (this.optionMenu) {
                         this.optionMenu.remove();
                         this.optionMenu = null;
@@ -966,9 +920,6 @@
                         this._trigger("typechange",null,this.propertyType);
                         this.input.trigger('change',this.propertyType,this.value());
                     }
-                    if (!image) {
-                        this._resize();
-                    }
                 }
             }
         },
@@ -995,7 +946,6 @@
         },
         show: function() {
             this.uiSelect.show();
-            this._resize();
         },
         hide: function() {
             this.uiSelect.hide();

packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss

@@ -18,7 +18,7 @@
     border: 1px solid $form-input-border-color;
     border-radius: 4px;
     height: 34px;
-    display: inline-block;
+    display: inline-flex;
     padding: 0;
     margin: 0;
     vertical-align: middle;
@@ -26,12 +26,7 @@
     overflow:visible;
     position: relative;
     .red-ui-typedInput-input-wrap {
-        position: absolute;
+        flex-grow: 1;
-        left:0;
-        right:0;
-        top:0;
-        bottom:0;
-        outline: red;
     }
     input.red-ui-typedInput-input {
         width: 100%;
@@ -49,7 +44,7 @@
         border-color: $form-input-focus-color !important;
     }
     .red-ui-typedInput-value-label {
-        position: absolute;
+        flex-grow: 1;
         display: inline-block;
         height: 32px;
         box-sizing: border-box;
@@ -107,12 +102,11 @@ button.red-ui-typedInput-option-trigger
  {
     text-align: left;
     border: none;
-    position: absolute;
+    flex-basis: auto;
     box-sizing: border-box;
     border-top-left-radius: 4px;
     border-bottom-left-radius: 4px;
     padding: 0 1px 0 5px;
-    display:inline-block;
     background: $form-button-background;
     height: 32px;
     line-height: 30px;
@@ -154,7 +148,7 @@ button.red-ui-typedInput-option-trigger
         text-decoration: none;
     }
     &.red-ui-typedInput-full-width {
-        width: 100%;
+        flex-grow: 1;
         border-top-right-radius: 4px;
         border-bottom-right-radius: 4px;
     }
@@ -170,7 +164,6 @@ button.red-ui-typedInput-option-expand {
     border-bottom-right-radius: 4px;
     border-top-left-radius: 0;
     border-bottom-left-radius: 0;
-    right: 0;
 }
 
 button.red-ui-typedInput-option-trigger {
@@ -179,8 +172,8 @@ button.red-ui-typedInput-option-trigger {
     border-top-right-radius: 4px;
     border-bottom-right-radius: 4px;
     padding: 0 0 0 0;
-    position:absolute;
+    position:relative;
-    right: 0;
+    flex-grow: 1;
     .red-ui-typedInput-option-label {
         background:$form-button-background;
         color: $form-text-color;

packages/node_modules/@node-red/runtime/lib/nodes/flows/Flow.js

@@ -571,15 +571,18 @@ function stopNode(node,removed) {
     Log.trace("Stopping node "+node.type+":"+node.id+(removed?" removed":""));
     const start = Date.now();
     const closePromise = node.close(removed);
+    let closeTimer = null;
     const closeTimeout = new Promise((resolve,reject) => {
-        setTimeout(() => {
+        closePromise = setTimeout(() => {
             reject("Close timed out");
         }, nodeCloseTimeout);
     });
     return Promise.race([closePromise,closeTimeout]).then(() => {
+        clearTimeout(closeTimer);
         var delta = Date.now() - start;
         Log.trace("Stopped node "+node.type+":"+node.id+" ("+delta+"ms)" );
     }).catch(err => {
+        clearTimeout(closeTimer);
         node.error(Log._("nodes.flows.stopping-error",{message:err}));
         Log.debug(err.stack);
     })