Select to view content in your preferred language

WAB Developer - Launchpad Theme, AnchorBarController Bug

1169
6
Jump to solution
01-30-2022 05:42 AM
Labels (2)
LanceCole
MVP Regular Contributor

We are in the final stages of deploying a custom WAB site, and during final testing, a bug was found in the Launchpad Theme. During testing, it was noted that when you use the application, opening and closing docked widgets becomes slower and eventually significantly lags the application. A browsers refresh clears the issue but reoccurs with continued use. We use WAB v2.23 and have confirmed that the issue occurs in the default configuration from a fresh download.

While monitoring the application, it was found that each time a docked widget is closed, either from the AnchorBarController or the close widget button, the _onNodeClick event is fired an additional time. For example, the first time a widget is closed, the event fires once, the second time the event twice, etc. If you open another widget, the same occurs starting at once the first time it is opened and incrementing after that.

The issue can be demonstrated by placing a counsel.log at line 168 of the setOpened function of the BaseIconItems.js script in the Launchpad Theme, AnchorBarController widget.

 

setOpened: function(value){
      console.log("BaseIconItem.setOpened")
      // console.trace()
      if(value){
        if(this.iconItemStatus){
          domClass.add(this.iconItemStatus, 'selected');
        }
        if(this.iconItemNode){
          domClass.add(this.iconItemNode, 'selected');
        }

        this.isOpen = true;
      }else{
        if(this.iconItemStatus){
          domClass.remove(this.iconItemStatus, 'selected');
        }
        if(this.iconItemNode){
          domClass.remove(this.iconItemNode, 'selected');
        }
        this.isOpen = false;
        this.panelIndex = -1;
      }
    },

 

Below is a console.trace() from the setOpened function on the first time closing widget button in the AnchorBarController.

LanceCole_0-1643549612358.png

We were planning on releasing our new website this week, and any help would be appreciated.  I am NOT a developer and only know enough JavaScript to get myself into trouble.  @DerekLaw or @RobertScheitlin__GISP  any ideas or suggestions?

Thanks.

0 Kudos
1 Solution

Accepted Solutions
LanceCole
MVP Regular Contributor

After working with ESRI support the past week, they confirmed this is a bug in v2.22 and v2.23. Bug Number: BUG-000146795 

View solution in original post

0 Kudos
6 Replies
H__DanielRamos_Mendoza
New Contributor III

It is recommended to use the penultimate published version. Use  WAB v2.22

0 Kudos
LanceCole
MVP Regular Contributor

Daniel, thanks for the reply.

We also checked WAB v2.22 and the issue occurs in that version as well for the Launchpad Theme.

0 Kudos
LanceCole
MVP Regular Contributor

I narrowed the issue down to the _OnDockableNodeClick function in the AnchorBarController - Widget.js file starting at line 630. The following original code creates and shows a panel, in particular lines 30-40. Unfortunately, this loads a panel even when one already exists and the lang.hitch and aspect.after were adding additional ‘onClose’ events each time a panel was opened. 

 

    _onDockableNodeClick: function(dockableItem){
      var panelId, panelConfig;
      if(dockableItem.config.inPanel === false){
        if(dockableItem.isOpen){
          this.widgetManager.loadWidget(dockableItem.config).then(
              lang.hitch(this, function(widget) {
            this._addToOpenedIds(dockableItem.config.id);

            var position = this._getOffPanelPosition(dockableItem,
                this.widgetManager.getWidgetMarginBox(widget));
            position.zIndex = 100;
            widget.setPosition(position, this.containerNode);
            this.widgetManager.openWidget(widget);

            this.own(aspect.after(widget, 'onClose', lang.hitch(this, function() {
              dockableItem.setOpened(false);
              this._removeFromOpenedIds(dockableItem.config.id);
              dockableItem.iconItemNode.focus();
            })));
          }));
        }else{
          this.widgetManager.closeWidget(dockableItem.config.id);
          this._removeFromOpenedIds(dockableItem.config.id);
        }
      }else{
        panelId = dockableItem.config.id + '_panel';
        if(dockableItem.isOpen){
          dockableItem.setPanelIndex(this._calPanelIndex());
          panelConfig = dockableItem.getConfigForPanel();

          this.panelManager.showPanel(panelConfig).then(lang.hitch(this, function(panel){
            panel.setPosition(panelConfig.panel.position);
            aspect.after(panel, 'onClose', lang.hitch(this, function(){
              dockableItem.setOpened(false);
              this._removeFromOpenedIds(dockableItem.config.id);
              if(dockableItem.iconItemNode){
                dockableItem.iconItemNode.focus();
              }
            }));
          }));

          if(this.popupMore){
            this.popupMore.hide();
          }
          this._addToOpenedIds(dockableItem.config.id);
        }else{
          this.panelManager.closePanel(panelId);
          this._removeFromOpenedIds(dockableItem.config.id);
        }
      }
    },

 

I added a conditional (Lines 30-32) to only to create the panel if the panel ID does not exist, which seems to have resolved the issue.  I also comment out line 37 as the panel.setPosition is being called twice.  I am not a programmer, so please provide some feedback.  I also did not look at the upper portion, which deals with off Panel widgets.  This revision also does not reset the panel position/size for existing panels or the panelIndex.

 

_onDockableNodeClick: function(dockableItem){
      var panelId, panelConfig;

      if(dockableItem.config.inPanel === false){
        if(dockableItem.isOpen){
          this.widgetManager.loadWidget(dockableItem.config).then(
              lang.hitch(this, function(widget) {
            this._addToOpenedIds(dockableItem.config.id);

            var position = this._getOffPanelPosition(dockableItem,
                this.widgetManager.getWidgetMarginBox(widget));
            position.zIndex = 100;
            widget.setPosition(position, this.containerNode);
            this.widgetManager.openWidget(widget);

            this.own(aspect.after(widget, 'onClose', lang.hitch(this, function() {
              dockableItem.setOpened(false);
              this._removeFromOpenedIds(dockableItem.config.id);
              dockableItem.iconItemNode.focus();
            })));
          }));
        }else{
          this.widgetManager.closeWidget(dockableItem.config.id);
          this._removeFromOpenedIds(dockableItem.config.id);
        }
      }else{
        panelId = dockableItem.config.id + '_panel';
        if(dockableItem.isOpen){
// CHANGES --- 
          if(this.panelManager.getPanelById(panelId)){
            this.panelManager.openPanel(panelId);
          } else {
// CHANGES ---
            dockableItem.setPanelIndex(this._calPanelIndex());
            panelConfig = dockableItem.getConfigForPanel();
            this.panelManager.showPanel(panelConfig).then(lang.hitch(this, function(panel){
// CHANGES ---  // panel.setPosition(panelConfig.panel.position); 
              aspect.after(panel, 'onClose', lang.hitch(this, function(){
                dockableItem.setOpened(false);
                this._removeFromOpenedIds(dockableItem.config.id);
                if(dockableItem.iconItemNode){
                  dockableItem.iconItemNode.focus();
                }
              }));
            }));
          } // CHANGES ---

 

0 Kudos
DerekLaw
Esri Esteemed Contributor

Hi @LanceCole,

Unfortunately, I am not a developer so I'm unable to help with your issue. Sorry. Also, I haven't worked closely with the ArcGIS WebAppBuilder team in several years. Please contact Esri tech support and open a ticket - they are the best folks to check if this might be a bug. 

Best,

0 Kudos
LanceCole
MVP Regular Contributor

Thanks, Derek.  I have a ticket in with ESRI and they are looking into the issue.

0 Kudos
LanceCole
MVP Regular Contributor

After working with ESRI support the past week, they confirmed this is a bug in v2.22 and v2.23. Bug Number: BUG-000146795 

0 Kudos