Uploaded image for project: 'ZK'
  1. ZK
  2. ZK-4819

Chosenbox performance (with za11y.jar)

XMLWordPrintable

      Steps to Reproduce

      run chosenbox-frozen.zul
      focus the chosenbox
      start typing to search items (e.g. "ger" to select items for "Germany")

      Current Result

      the ui freezes while filtering the matching items (up to a point when the browser interrupts the JS execution)

      Expected Result

      no freezing

      Debug Information

      profiling reveals a long inner loop causing layout reflows

      a jquery visibility check in _hiliteOpt causes a reflow with each iteration

      Workaround

      rewrite the _hliteOpt function (avoiding the jquery 'visible' check)

          zk.afterLoad('zkmax.inp, za11y', function() {
              var xChosenbox = {};
              zk.override(zkmax.inp.Chosenbox.prototype, xChosenbox, {
                  _hliteOpt : function(target, highlight) {
                      //original function
                      var zcls = this.$s('option-hover');
                      if (highlight) {
                          // clear old first
                          var oldHlite = jq(this.$n('pp')).find('.' + zcls)[0];
                          if (oldHlite)
                              jq(oldHlite).removeClass(zcls);
                          jq(target).addClass(zcls);
                      } else {
                          jq(target).removeClass(zcls);
                      }
      
                      // za11y patch
                      var inputNode = this.getInputNode();
                      var activeDescendant = inputNode.getAttribute('aria-activedescendant');
                      if(!target) {
                          inputNode.removeAttribute('aria-activedescendant');
                      } else {
                          if(highlight) {
                              inputNode.setAttribute('aria-activedescendant', target.id);
                          } else if(activeDescendant == target.id) {
                              inputNode.removeAttribute('aria-activedescendant');
                          }
                      }
                  }
              });//zk.override
          });//zk.afterLoad
      
      

            DevChu DevChu
            cor3000 cor3000
            Votes:
            0 Vote for this issue
            Watchers:
            3 Start watching this issue

              Created:
              Updated:
              Resolved: