

<script src="/lib/lodash/dist/lodash.js"></script>
<script src="/lib/platform/platform.js"></script>
<script src="/lib/benchmark/benchmark.js"></script>
<script src="/js/testrunner.js?v=ImfK1qgtc2LKT4gKMLUI-b6qqQ3IM406XxL3sHagCO8"></script>


<div id="validation-html-preparation"></div>

<script type="text/javascript">
    (function () {
        // #139: for stored benchmarks the preparation HTML is loaded from the
        // dedicated route and injected into this frame's document. It is skipped
        // entirely for top-level visits, so the markup only ever executes inside
        // the sandboxed runner frame (framing by other sites is blocked by the
        // global X-Frame-Options: SAMEORIGIN policy).
        var benchmarkId = 11648;
        if (benchmarkId <= 0 || window.self === window.top) {
            window._preparationReady = Promise.resolve();
            return;
        }
        var holder = document.getElementById('validation-html-preparation');
        // #164: injected <script src> tags load asynchronously; the runner
        // awaits this promise before starting the benchmark so code depending
        // on them (e.g. Pyodide's loadPyodide()) can't race the script load.
        window._preparationReady = fetch('/Benchmarks/HtmlPreparationCode/11648')
            .then(function (r) { return r.ok ? r.text() : ''; })
            .then(function (html) {
                if (!html || !holder) { return; }
                // innerHTML does not execute <script> elements; re-insert them so
                // the executed code matches what the server-rendered page ran.
                return window._applyPreparationScripts(holder, html);
            })
            .catch(function () { /* preparation code is optional */ });
    })();
</script>

<script type="text/javascript">
    pageController = new TestRunnerController();
</script>
<textarea id="benchmark_definition_json" style="display:none">
    {&quot;ScriptPreparationCode&quot;:&quot;function setSelectWidget() {\r\n  var self = this;\r\n\r\n  $(\u0022.select-widget\u0022).click(function() {\r\n    if (!$(this).hasClass(\u0022active\u0022)) {\r\n      $(\u0022.select-widget.active\u0022).removeClass(\u0022active\u0022);\r\n\r\n      $(this).addClass(\u0022active\u0022);\r\n\r\n      $(this).find(\u0022.fa-angle-up\u0022).unbind();\r\n      $(this).find(\u0022.fa-angle-up\u0022).click(function(e) {\r\n        e.stopPropagation();\r\n\r\n        $(this).parent().parent().removeClass(\u0022active\u0022);\r\n        $(this).parent().find(\u0022input\u0022).val(\u0022\u0022);\r\n        $(this).parent().parent().find(\u0022.select-widget-body span\u0022).show();\r\n      });\r\n\r\n      $(this).find(\u0022input\u0022).keyup(function() {\r\n        var val = $(this).val().toString().toLowerCase();\r\n\r\n        $(this).parent().parent().find(\u0022.select-widget-body \u003E span\u0022).each(function() {\r\n          var data = $(this).text().toString().toLowerCase();\r\n\r\n          if (data.search(val) \u003C 0)\r\n            $(this).hide();\r\n          else\r\n            $(this).show();\r\n        });\r\n      });\r\n\r\n      $(this).find(\u0022.select-widget-body \u003E span\u0022).unbind();\r\n      $(this).find(\u0022.select-widget-body \u003E span\u0022).click(function(e) {\r\n        e.stopPropagation();\r\n\r\n        $(this).parent().parent().find(\u0022.select-widget-head \u003E span \u003E em\u0022).text($(this).text().replace(\u0027-\u002B\u0027, \u0027\u0027));\r\n        $(this).parent().parent().find(\u0022.select-widget-head \u003E span\u0022).attr(\u0022data\u0022, $(this).attr(\u0022data\u0022));\r\n        $(this).parent().parent().removeClass(\u0022active\u0022);\r\n\r\n        $(this).parent().parent().find(\u0022.select-widget-head input\u0022).val(\u0022\u0022);\r\n        $(this).parent().find(\u0022span\u0022).show();\r\n        $(this).parent().find(\u0027span\u0027).removeClass(\u0027active\u0027).removeClass(\u0027inactive\u0027);\r\n        $(this).addClass(\u0027active\u0027);\r\n\r\n        //self.selectChanged($(this).parent().parent().attr(\u0022class\u0022).replace(\u0022select-widget\u0022, \u0022\u0022).trim());\r\n      });\r\n\r\n      $(this).find(\u0022.select-widget-body \u003E span \u003E em._btn.plus\u0022).unbind();\r\n      $(this).find(\u0022.select-widget-body \u003E span \u003E em._btn.plus\u0022).click(function(e) {\r\n        e.stopPropagation();\r\n\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-head \u003E span \u003E em\u0022).text($(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).first().text().replace(\u0027-\u002B\u0027, \u0027\u0027));\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-head \u003E span\u0022).attr(\u0022data\u0022, $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).first().attr(\u0022data\u0022));\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-head input\u0022).val(\u0022\u0022);\r\n\r\n        if ($(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.active\u0022).length || $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.inactive\u0022).length) {\r\n          if (!$(this).parent().hasClass(\u0027active\u0027)) {\r\n            if ($(this).parent().hasClass(\u0027inactive\u0027)) {\r\n              if ($(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.inactive\u0022).length == 1) {\r\n                $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.active\u0022).removeClass(\u0027active\u0027);\r\n                $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.inactive\u0022).removeClass(\u0027inactive\u0027);\r\n              } else\r\n                $(this).parent().removeClass(\u0027inactive\u0027).addClass(\u0027active\u0027);\r\n            } else {\r\n              if ($(this).parent().parent().find(\u0027span._default\u0027).hasClass(\u0027active\u0027)) {\r\n                $(this).parent().parent().find(\u0027span._default\u0027).removeClass(\u0027active\u0027);\r\n                $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).addClass(\u0027inactive\u0027);\r\n              }\r\n\r\n              $(this).parent().removeClass(\u0027inactive\u0027).addClass(\u0027active\u0027);\r\n              $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).not(\u0027.active\u0027).addClass(\u0027inactive\u0027);\r\n            }\r\n          }\r\n        } else {\r\n          $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).addClass(\u0027inactive\u0027);\r\n          $(this).parent().removeClass(\u0027inactive\u0027).addClass(\u0027active\u0027);\r\n        }\r\n\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span._default\u0022).removeClass(\u0027active\u0027).removeClass(\u0027inactive\u0027);\r\n\r\n        if (!$(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.active\u0022).length \u0026\u0026 !$(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.inactive\u0022).length)\r\n          $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span._default\u0022).addClass(\u0027active\u0027);\r\n\r\n        //self.selectChanged($(this).parent().parent().parent().attr(\u0022class\u0022).replace(\u0022select-widget\u0022, \u0022\u0022).replace(\u0022active\u0022, \u0022\u0022).trim());\r\n      });\r\n\r\n      $(this).find(\u0022.select-widget-body \u003E span \u003E em._btn.minus\u0022).unbind();\r\n      $(this).find(\u0022.select-widget-body \u003E span \u003E em._btn.minus\u0022).click(function(e) {\r\n        e.stopPropagation();\r\n\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-head \u003E span \u003E em\u0022).text($(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).first().text().replace(\u0027-\u002B\u0027, \u0027\u0027));\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-head \u003E span\u0022).attr(\u0022data\u0022, $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).first().attr(\u0022data\u0022));\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-head input\u0022).val(\u0022\u0022);\r\n\r\n        if ($(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.active\u0022).length || $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.inactive\u0022).length) {\r\n          if (!$(this).parent().hasClass(\u0027inactive\u0027)) {\r\n            if ($(this).parent().hasClass(\u0027active\u0027)) {\r\n              if ($(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.active\u0022).length == 1) {\r\n                $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.active\u0022).removeClass(\u0027active\u0027);\r\n                $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.inactive\u0022).removeClass(\u0027inactive\u0027);\r\n              } else\r\n                $(this).parent().removeClass(\u0027active\u0027).addClass(\u0027inactive\u0027);\r\n            } else {\r\n              if ($(this).parent().parent().find(\u0027span._default\u0027).hasClass(\u0027active\u0027)) {\r\n                $(this).parent().parent().find(\u0027span._default\u0027).removeClass(\u0027active\u0027);\r\n                $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).addClass(\u0027active\u0027);\r\n              }\r\n\r\n              $(this).parent().removeClass(\u0027active\u0027).addClass(\u0027inactive\u0027);\r\n              $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).not(\u0027.inactive\u0027).addClass(\u0027active\u0027);\r\n            }\r\n          }\r\n        } else {\r\n          $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span\u0022).addClass(\u0027active\u0027);\r\n          $(this).parent().removeClass(\u0027active\u0027).addClass(\u0027inactive\u0027);\r\n        }\r\n\r\n        $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span._default\u0022).removeClass(\u0027active\u0027).removeClass(\u0027inactive\u0027);\r\n\r\n        if (!$(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.active\u0022).length \u0026\u0026 !$(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span.inactive\u0022).length)\r\n          $(this).parent().parent().parent().find(\u0022.select-widget-body \u003E span._default\u0022).addClass(\u0027active\u0027);\r\n\r\n        //self.selectChanged($(this).parent().parent().parent().attr(\u0022class\u0022).replace(\u0022select-widget\u0022, \u0022\u0022).replace(\u0022active\u0022, \u0022\u0022).trim());\r\n      });\r\n    }\r\n  });\r\n}\r\n\r\nfunction setSelectWidget2() {\r\n  var self = this;\r\n\r\n  $(\u0022.select-widget\u0022).click(function() {\r\n    var $selectWidget = $(this);\r\n\r\n    if (!$selectWidget.hasClass(\u0022active\u0022)) {\r\n      $(\u0022.select-widget.active\u0022).removeClass(\u0022active\u0022);\r\n\r\n      var $selectWidgetHead = $selectWidget.find(\u0022.select-widget-head\u0022);\r\n      var $selectWidgetBody = $selectWidget.find(\u0022.select-widget-body\u0022);\r\n      var $closeIcon = $selectWidgetHead.find(\u0022i.fa-angle-up\u0022);\r\n      var $searchInput = $selectWidgetHead.find(\u0022input\u0022);\r\n      var $selectWidgetHeadItems = $selectWidgetHead.children(\u0022span\u0022);\r\n      var $selectWidgetHeadItemsKeys = $selectWidgetHeadItems.children(\u0022em\u0022);\r\n      var $selectWidgetBodyItems = $selectWidgetBody.children(\u0022span\u0022);\r\n      var $selectWidgetBodyDefaultItem = $selectWidgetBodyItems.filter(\u0022._default\u0022);\r\n      var $selectWidgetBodyItemsKeys = $selectWidgetBodyItems.children(\u0022em\u0022);\r\n      var $selectWidgetBodyAddItemBtn = $selectWidgetBodyItemsKeys.filter(\u0022.plus\u0022);\r\n      var $selectWidgetBodyRemoveItemBtn = $selectWidgetBodyItemsKeys.filter(\u0022.minus\u0022);\r\n\r\n      $selectWidget.addClass(\u0022active\u0022);\r\n\r\n      $closeIcon.off(\u0022click\u0022).on(\u0022click\u0022, function(e) {\r\n        e.stopPropagation();\r\n\r\n        $selectWidget.removeClass(\u0022active\u0022);\r\n        $searchInput.val(\u0022\u0022);\r\n        $selectWidgetBodyItems.show();\r\n      });\r\n\r\n      $searchInput.keyup(function() {\r\n        var val = $(this).val().toString().toLowerCase();\r\n\r\n        $selectWidgetBodyItems.each(function() {\r\n          var data = $(this).text().toString().toLowerCase();\r\n\r\n          if (data.search(val) \u003C 0)\r\n            $(this).hide();\r\n          else\r\n            $(this).show();\r\n        });\r\n      });\r\n\r\n      $selectWidgetBodyItems.off(\u0022click\u0022).on(\u0022click\u0022, function(e) {\r\n        e.stopPropagation();\r\n\r\n        $selectWidgetHeadItems.children(\u0022em\u0022).text($(this).text().replace(\u0027-\u002B\u0027, \u0027\u0027));\r\n        $selectWidgetHeadItems.attr(\u0022data\u0022, $(this).attr(\u0022data\u0022));\r\n        $selectWidgetBody.removeClass(\u0022active\u0022);\r\n\r\n        $searchInput.val(\u0022\u0022);\r\n        $selectWidgetBodyItems.show().removeClass(\u0027active inactive\u0027);\r\n        $(this).addClass(\u0027active\u0027);\r\n\r\n        //self.selectChanged($(this).parent().parent().attr(\u0022class\u0022).replace(\u0022select-widget\u0022, \u0022\u0022).trim());\r\n      });\r\n\r\n      $selectWidgetBodyAddItemBtn.off(\u0022click\u0022).on(\u0022click\u0022, function(e) {\r\n        e.stopPropagation();\r\n\r\n        var $currentItem = $(this).parent();\r\n        var $activeItems = $selectWidgetBodyItems.filter(\u0022.active\u0022);\r\n        var $inactiveItems = $selectWidgetBodyItems.filter(\u0022.inactive\u0022);\r\n\r\n        var activeItemsLength = $activeItems.length;\r\n        var inactiveItemsLength = $inactiveItems.length;\r\n\r\n        $selectWidgetHeadItemsKeys.text($selectWidgetBodyItems.first().text().replace(\u0027-\u002B\u0027, \u0027\u0027));\r\n        $selectWidgetHeadItems.attr(\u0022data\u0022, $selectWidgetBodyItems.first().attr(\u0022data\u0022));\r\n        $searchInput.val(\u0022\u0022);\r\n\r\n        if (activeItemsLength || inactiveItemsLength) {\r\n          if (!$currentItem.hasClass(\u0027active\u0027)) {\r\n            if ($currentItem.hasClass(\u0027inactive\u0027)) {\r\n              if (inactiveItemsLength == 1) {\r\n                $activeItems.removeClass(\u0027active\u0027);\r\n                $inactiveItems.removeClass(\u0027inactive\u0027);\r\n              } else\r\n                $currentItem.removeClass(\u0027inactive\u0027).addClass(\u0027active\u0027);\r\n            } else {\r\n              if ($selectWidgetBodyDefaultItem.hasClass(\u0027active\u0027)) {\r\n                $selectWidgetBodyDefaultItem.removeClass(\u0027active\u0027);\r\n                $selectWidgetBodyItems.addClass(\u0027inactive\u0027);\r\n              }\r\n\r\n              $currentItem.removeClass(\u0027inactive\u0027).addClass(\u0027active\u0027);\r\n              $selectWidgetBodyItems.not(\u0027.active\u0027).addClass(\u0027inactive\u0027);\r\n            }\r\n          }\r\n        } else {\r\n          $selectWidgetBodyItems.addClass(\u0027inactive\u0027);\r\n          $currentItem.removeClass(\u0027inactive\u0027).addClass(\u0027active\u0027);\r\n        }\r\n\r\n        $selectWidgetBodyDefaultItem.removeClass(\u0027active inactive\u0027);\r\n\r\n        if (!activeItemsLength \u0026\u0026 !inactiveItemsLength)\r\n          $selectWidgetBodyDefaultItem.addClass(\u0027active\u0027);\r\n\r\n        //self.selectChanged($(this).parent().parent().parent().attr(\u0022class\u0022).replace(\u0022select-widget\u0022, \u0022\u0022).replace(\u0022active\u0022, \u0022\u0022).trim());\r\n      });\r\n\r\n      $selectWidgetBodyRemoveItemBtn.off(\u0022click\u0022).on(\u0022click\u0022, function(e) {\r\n        e.stopPropagation();\r\n\r\n        var $currentItem = $(this).parent();\r\n        var $activeItems = $selectWidgetBodyItems.filter(\u0022.active\u0022);\r\n        var $inactiveItems = $selectWidgetBodyItems.filter(\u0022.inactive\u0022);\r\n\r\n        var activeItemsLength = $activeItems.length;\r\n        var inactiveItemsLength = $inactiveItems.length;\r\n\r\n        $selectWidgetHeadItemsKeys.text($selectWidgetBodyItems.first().text().replace(\u0027-\u002B\u0027, \u0027\u0027));\r\n        $selectWidgetHeadItems.attr(\u0022data\u0022, $selectWidgetBodyItems.first().attr(\u0022data\u0022));\r\n        $searchInput.val(\u0022\u0022);\r\n\r\n        if (activeItemsLength || inactiveItemsLength) {\r\n          if (!$currentItem.hasClass(\u0027inactive\u0027)) {\r\n            if ($currentItem.hasClass(\u0027active\u0027)) {\r\n              if (activeItemsLength == 1) {\r\n                $activeItems.removeClass(\u0027active\u0027);\r\n                $inactiveItems.removeClass(\u0027inactive\u0027);\r\n              } else\r\n                $currentItem.removeClass(\u0027active\u0027).addClass(\u0027inactive\u0027);\r\n            } else {\r\n              if ($selectWidgetBodyDefaultItem.hasClass(\u0027active\u0027)) {\r\n                $selectWidgetBodyDefaultItem.removeClass(\u0027active\u0027);\r\n                $selectWidgetBodyItems.addClass(\u0027active\u0027);\r\n              }\r\n\r\n              $currentItem.removeClass(\u0027active\u0027).addClass(\u0027inactive\u0027);\r\n              $selectWidgetBodyItems.not(\u0027.inactive\u0027).addClass(\u0027active\u0027);\r\n            }\r\n          }\r\n        } else {\r\n          $selectWidgetBodyItems.addClass(\u0027active\u0027);\r\n          $currentItem.removeClass(\u0027active\u0027).addClass(\u0027inactive\u0027);\r\n        }\r\n\r\n        $selectWidgetBodyDefaultItem.removeClass(\u0027active inactive\u0027);\r\n\r\n        if (!activeItemsLength \u0026\u0026 !inactiveItemsLength)\r\n          $selectWidgetBodyDefaultItem.addClass(\u0027active\u0027);\r\n\r\n        //self.selectChanged($(this).parent().parent().parent().attr(\u0022class\u0022).replace(\u0022select-widget\u0022, \u0022\u0022).replace(\u0022active\u0022, \u0022\u0022).trim());\r\n      });\r\n    }\r\n  });\r\n}&quot;,&quot;TestCases&quot;:[{&quot;Name&quot;:&quot;Before refactor&quot;,&quot;Code&quot;:&quot;setSelectWidget();\r\n\r\n$(\u0027.select-widget.stores\u0027).click();\r\n$(\u0027.select-widget-body span[data=\u0022750\u0022]\u0027).click();\r\n$(\u0027.select-widget-body span[data=\u0022751\u0022] \u003E ._plus\u0027).click();\r\n$(\u0027.select-widget-body span[data=\u002210\u0022] \u003E ._minus\u0027).click();\r\n$(\u0027.select-widget-head .fa-angle-up\u0027).click();&quot;,&quot;IsDeferred&quot;:false},{&quot;Name&quot;:&quot;After refactor&quot;,&quot;Code&quot;:&quot;setSelectWidget2();\r\n\r\n$(\u0027.select-widget.stores\u0027).click();\r\n$(\u0027.select-widget-body span[data=\u0022750\u0022]\u0027).click();\r\n$(\u0027.select-widget-body span[data=\u0022751\u0022] \u003E ._plus\u0027).click();\r\n$(\u0027.select-widget-body span[data=\u002210\u0022] \u003E ._minus\u0027).click();\r\n$(\u0027.select-widget-head .fa-angle-up\u0027).click();&quot;,&quot;IsDeferred&quot;:false}],&quot;UseTinyBench&quot;:false}
</textarea>