Bug 2007637 Comment 11 Edit History

Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.

The list is loaded, it's just that the right CSS class is not added to the container. https://js.klevu.com/theme/default/v2/quick-landing-search-theme.js

```js
e.dom.helpers.initializeTabSelection = function (t, a, s, n) {
    var o;
    e.each(
      e.dom.find('.kuTab', s),
      (
        function (a, s) {
          var r = n.getElement('active');
          if (
            s.classList.remove('kuTabSelected'),
            r &&
            s.dataset &&
            s.dataset.section &&
            r == s.dataset.section
          ) {
            s.classList.add('kuTabSelected');
            var i = e.dom.helpers.getClosest(s, '.klevuWrap');
            if (null === i) return;
            t.context.activeQueryId = s.dataset.section,
            t.context.section = s.dataset.section,
            i.classList.add(s.dataset.section + 'Active'),
            o = !0
          }
        }
      )
    ),
```

This adds `productListActive` to `klevuWrap` and makes the list visible. The call stack is:

```
initializeTabSelection quick-landing-search-theme.js:formatted:770
    ee klevu.js:1
    initializeTabSelection quick-landing-search-theme.js:formatted:765
    getStorageAndTarget quick-landing-search-theme.js:formatted:4552
    fire quick-landing-search-theme.js:formatted:12969
    a klevu.js:1
    fireWith klevu.js:1
    fire klevu.js:1
    fire klevu.js:1
    a klevu.js:1
    fireWith klevu.js:1
    fire klevu.js:1
    success klevu.js:1
    r klevu.js:1
    anonymous unknown:0
```

The event is fired in: https://js.klevu.com/core/v2/klevu.js

```js
  t.getScope().chains.request.fetch.send.add({
    name: 'sendRequest',
    fire: function (t, n) {
      'searchAjax' !== t.context.eventAction &&
      (
        t.scope = n,
        t.context.doSearch ? (
          t.context.requestObject = {
            url: t.request.settings.url,
            type: 'FETCH',
            method: 'POST',
            mimeType: 'application/json; charset=UTF-8',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            crossDomain: !0,
            success: function (t, n, s, o) {
              var a = e.getObjectPath(n.scope.kScope, 'chains.response.success');
              e.isUndefined(a) ||
              0 === a.list().length ||
              (
                a.setScope(n.scope.kElem),
                e.setObjectPath(n, 'response.data', t),
                e.setObjectPath(n, 'context.status', s),
                e.setObjectPath(n, 'context.isSuccess', o),
                a.setData(n),
                a.fire()
              )
            },
            error: function (t, n, s) {
              var o = e.getObjectPath(t.scope.kScope, 'chains.response.fail');
              e.isUndefined(o) ||
              0 === o.list().length ||
              (
                o.setScope(t.scope.kElem),
                e.setObjectPath(t, 'response.data', {
                }),
                e.setObjectPath(t, 'context.status', n),
                e.setObjectPath(t, 'context.isSuccess', s),
                o.setData(t),
                o.fire()
              )
            },
            data: JSON.stringify(t.request.settings.object)
          },
          t.context.requestDetails = e.extend(!0, {
          }, t)
        ) : e.support.hook(
          ['core.logger'],
          (
            function () {
              e.logger.log(
                'search.core',
                'warn',
                'Fetch makeRequest - Request object is not present or request was forced stopped.'
              ),
              e.logger.log('search.core', 'debug', t)
            }
          )
        )
      )
    }
  }),
```

But even if `a.fire()` is called, it doesn't seem to always reach to the listener, even though the listener is always added before it dispatches.
The list is loaded, it's just that the right CSS class is not added to the container. https://js.klevu.com/theme/default/v2/quick-landing-search-theme.js

```js
e.dom.helpers.initializeTabSelection = function (t, a, s, n) {
    var o;
    e.each(
      e.dom.find('.kuTab', s),
      (
        function (a, s) {
          var r = n.getElement('active');
          if (
            s.classList.remove('kuTabSelected'),
            r &&
            s.dataset &&
            s.dataset.section &&
            r == s.dataset.section
          ) {
            s.classList.add('kuTabSelected');
            var i = e.dom.helpers.getClosest(s, '.klevuWrap');
            if (null === i) return;
            t.context.activeQueryId = s.dataset.section,
            t.context.section = s.dataset.section,
            i.classList.add(s.dataset.section + 'Active'),
            o = !0
          }
        }
      )
    ),
```

This adds `productListActive` to `klevuWrap` and makes the list visible. The call stack is:

```
initializeTabSelection quick-landing-search-theme.js:formatted:770
    ee klevu.js:1
    initializeTabSelection quick-landing-search-theme.js:formatted:765
    getStorageAndTarget quick-landing-search-theme.js:formatted:4552
    fire quick-landing-search-theme.js:formatted:12969
    a klevu.js:1
    fireWith klevu.js:1
    fire klevu.js:1
    fire klevu.js:1
    a klevu.js:1
    fireWith klevu.js:1
    fire klevu.js:1
    success klevu.js:1
    r klevu.js:1
    anonymous unknown:0
```

The event is fired in: https://js.klevu.com/core/v2/klevu.js

```js
  t.getScope().chains.request.fetch.send.add({
    name: 'sendRequest',
    fire: function (t, n) {
      'searchAjax' !== t.context.eventAction &&
      (
        t.scope = n,
        t.context.doSearch ? (
          t.context.requestObject = {
            url: t.request.settings.url,
            type: 'FETCH',
            method: 'POST',
            mimeType: 'application/json; charset=UTF-8',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            crossDomain: !0,
            success: function (t, n, s, o) {
              var a = e.getObjectPath(n.scope.kScope, 'chains.response.success');
              e.isUndefined(a) ||
              0 === a.list().length ||
              (
                a.setScope(n.scope.kElem),
                e.setObjectPath(n, 'response.data', t),
                e.setObjectPath(n, 'context.status', s),
                e.setObjectPath(n, 'context.isSuccess', o),
                a.setData(n),
                a.fire()
              )
            },
            error: function (t, n, s) {
              var o = e.getObjectPath(t.scope.kScope, 'chains.response.fail');
              e.isUndefined(o) ||
              0 === o.list().length ||
              (
                o.setScope(t.scope.kElem),
                e.setObjectPath(t, 'response.data', {
                }),
                e.setObjectPath(t, 'context.status', n),
                e.setObjectPath(t, 'context.isSuccess', s),
                o.setData(t),
                o.fire()
              )
            },
            data: JSON.stringify(t.request.settings.object)
          },
          t.context.requestDetails = e.extend(!0, {
          }, t)
        ) : e.support.hook(
          ['core.logger'],
          (
            function () {
              e.logger.log(
                'search.core',
                'warn',
                'Fetch makeRequest - Request object is not present or request was forced stopped.'
              ),
              e.logger.log('search.core', 'debug', t)
            }
          )
        )
      )
    }
  }),
```

But even if `a.fire()` is called, it doesn't seem to always reach to the listener, even though the listener is always added before it dispatches. (It's not standard DOM event, fwiw)

Back to Bug 2007637 Comment 11