<!DOCTYPE html>
<html lang="en" style="overflow-y: scroll;">
<head>
  <meta charset="UTF-8">
  <title>{{browserTitle}}</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/styles/default.min.css">
  <link rel="stylesheet" href="https://cdn.datatables.net/v/bs4/dt-1.10.18/datatables.min.css"/>

<style>
code.renderMarkdown table, code.renderMarkdown th, code.renderMarkdown td {
    border: 1px solid black;
    width: max-content;
    padding: .75rem;
}

.theme-dark {
    --background-color: #222;
    --bg-card-deck: #444444;
    --text-color: #ccd2d8;
    --tab-border: solid 1px #444;
    --success: #3c9372;
    --failure: #c24a3f;
    --warning: #d28c23;
    --info: #4083b6;
    --badge-outline: #3c9372;
    --badge-bg: #cdd3db;
    --badge-text: #ccd2d9;
    --failure-row: #c24a3f;
    --warning-row: #d28c23;
    --card-bg: #444;
    --card-footer: #4f5758;
    --form-input: #ececb5;
    --hov-text: #d2dae5;
    --h4-text: #ccd1d9;
}

.theme-light {
    --tab-border: solid 1px #fff;
    --text-color: #000000;
    --success: #42a745;
    --failure: #dc3544;
    --warning: #f4c10b;
    --info: #49a1b8;
    --badge-outline: #040411;
    --badge-bg: #f8f9fa;
    --badge-text: #fff;
    --failure-row: #f5c6cb;
    --warning-row: #ffeeba;
    --card-bg: #f7f7f7;
    --hov-text: #fff;
    --h4-text: #ffffff;
}

body {
  padding-top:30px;
  background-color: var(--background-color)!important;
  color: var(--text-color);
}

#execution-data {
  padding: 10px;
  border: var(--tab-border);
  border-top: none;
}

.nav-tabs {
  padding-top: 10px;
  height: 105px;
  overflow-y: auto;
}

body.theme-dark .card-header {
    background-color: #444;
}

body.theme-light .card-header {
    background-color: #f7f7f7;
}

.card-footer {
    padding: .75rem 1.25rem;
    background-color: var(--card-footer);
}

.card-deck {
    background-color: var(--bg-card-deck)!important;
}
.form-control {
    background: var(--form-input);
}

.custom-tab {
  padding: 10px 15px;
  margin-right: 0px;
  height: 47px;
  width: 69px;
  text-align: center;
  border: var(--tab-border);
  border-bottom: none;
  cursor:pointer;
}

body.theme-dark .text-white {
    color: #ccd2d9!important;
}
h4 {
    color: var(--h4-text);
}

body.theme-dark h1 {
    color: #ccd2da;
}

body.theme-dark .bg-light>td {
    background: #4f5858!important;
}

body.theme-dark .hljs {
    background: #0a0a0ab0!important;
    color: #8d8787!important;
}

.bg-info {
    background-color: var(--info)!important;
}
.bg-success {
    background-color: var(--success)!important;
}

.alert-success {
    background-color: var(--success)!important;
}

.alert-warning {
    background-color: var(--warning)!important;
}

.alert-info {
    background-color: var(--info)!important;
}

.bg-warning {
    background-color: var(--warning)!important;
}

.badge-warning {
    color: var(--badge-text)!important;
    background-color: var(--warning)!important;
}

.table-warning>td {
    background-color: var(--warning-row);
}

.alert-danger {
    background-color: var(--failure)!important;
}

body.theme-dark .alert-dark {
    background-color: #636467!important;
}

body.theme-dark .text-dark {
    color: #d1dae4!important;
}

body.theme-dark .badge-light {
    color: #212529;
    background-color: #cdd3db;
}

body.theme-light .badge-light {
    color: #212529;
    background-color: #f8f9fa;
}
body.theme-light .bg-danger {
    background-color: var(--failure)!important;
}

body.theme-dark .bg-danger {
    background-color: var(--failure)!important;
}

.table-danger>td {
    background-color: var(--failure-row);
}

body.theme-dark .table .thead-light th {
    background-color: #4f5858!important;
    border-color: #dee2e6!important;
    color: #ccd2d8!important;
}

.itPassed {
  background: var(--success);
  color: white;
}
.itFailed {
  background: var(--failure);
  color: white;
}

.resultsInfoPass {
  color: var(--success);
  padding-top: 4px;
}

.resultsInfoFail {
  color: var(--failure);
  padding-top: 4px;
}

.badge-outline-success {
  color: var(--success);
  border: 1px solid var(--success);
  background-color: transparent;
}

.badge-outline {
  color: var(--badge-outline);
  border: 1px solid var(--badge-outline);
  background-color: transparent;
}

.btn-outline-success {
    color: var(--success)!important;
    border-color: var(--success)!important;
}

.backToTop:hover {
  background-color: var(--success);
  border-color: var(--success);
  color: var(--hov-text)!important;
}

.btn-outline-success:hover {
  background-color: var(--success);
  border-color: var(--success);
  color: var(--hov-text)!important;
}

.btn-outline-secondary {
  background-color: var(--success)!important;
  color: var(--hov-text)!important;
}

body.theme-dark .env-heading {
    color: #ccd2d9!important;
}

body, html {
  height:100%;
}

.card {
  overflow:hidden;
}

body.theme-dark .card-body {
    background-color: #444;
}

body.theme-light .card-body {
    background-color: #f7f7f7;
}

body.theme-dark .card-body .bg-danger {
    background-color: var(--failure)!important;
}

body.theme-light .card-body .bg-danger {
    background-color: var(--failure)!important;
}

.card-body .rotate {
  z-index: 8;
  float: right;
  height: 100%;
}

.card-body .rotate i {
  color: #14141426;
  position: absolute;
  left: 0;
  left: auto;
  right: -10px;
  bottom: 0;
  display: block;
  -webkit-transform: rotate(-44deg);
  -moz-transform: rotate(-44deg);
  -o-transform: rotate(-44deg);
  -ms-transform: rotate(-44deg);
  transform: rotate(-44deg);
}

.dyn-height {
  max-height:350px;
  overflow-y:auto;
}

.nav-pills .nav-link.active {
  background-color: transparent!important;
}

.backToTop {
  display: none;
  position: fixed;
  bottom: 10px;
  right: 20px;
  z-index: 99;
  font-size: 15px;
  outline: none;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

.card-header .fa {
  transition: .3s transform ease-in-out;
}
.card-header .collapsed .fa {
  transform: rotate(90deg);
}

.single-line-tabs {
  padding-top: 10px;
  height: 60px;
}

::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #888;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 20px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 0px;
  bottom: 4px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  box-shadow: 0 0px 15px #2020203d;
  background: white;
  background-repeat: no-repeat;
  background-position: center;
}

input:checked + .slider {
  background-color: #4083b6;
}

input:focus + .slider {
  box-shadow: 0 0 1px #4083b6;
}

input:checked + .slider:before {
  -webkit-transform: translateX(24px);
  -ms-transform: translateX(24px);
  transform: translateX(24px);
  background: white;
  background-repeat: no-repeat;
  background-position: center;
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

table.dataTable td, table.dataTable tr {
    vertical-align: middle;
}

body.theme-dark code {
    color: #ccd2d8!important;
}

body.theme-light code {
    color: #000000!important;
}

.text-wrap {
    word-wrap: break-word; 
    min-width: 600px; 
    max-width: 600px; 
    white-space: normal;
}

</style>
</head>
<body class="theme-dark">
<script>
    function setTheme(themeName) {
        localStorage.setItem('theme', themeName);
        document.body.className = themeName;
    }

    function toggleTheme() {
        if (localStorage.getItem('theme') === 'theme-light') {
            setTheme('theme-dark');
        } else {
            setTheme('theme-light');
        }
    }
</script>
  <div class="container">
        <div class="container">
            <label>Light</label>
            <label id="switch" class="switch">
                <input type="checkbox" onchange="toggleTheme()" id="slider">
                <span class="slider round"></span>
            </label>
            <label>Dark</label>
        </div>
        {{#with summary}}
        <div class="card">
        <div class="card-header">
            <ul class="nav nav-pills mb-3 nav-justified" id="pills-tab" role="tablist">
            <li class="nav-item bg-info active" data-toggle="tooltip" title="Click to view the Summary">
                <a class="nav-link text-white" id="pills-summary-tab" data-toggle="pill" href="#pills-summary" role="tab" aria-controls="pills-summary" aria-selected="true">Summary</a>
            </li>
            <li class="nav-item bg-success" data-toggle="tooltip" title="Click to view the Requests">
                <a class="nav-link text-white" id="pills-requests-tab" data-toggle="pill" href="#pills-requests" role="tab" aria-controls="pills-requests" aria-selected="false">Total Requests <span class="badge badge-light">{{stats.requests.total}}</span></a>
            </li>
            <li class="nav-item bg-danger" data-toggle="tooltip" title="Click to view the Failed Tests">
                <a class="nav-link text-white" id="pills-failed-tab" data-toggle="pill" href="#pills-failed" role="tab" aria-controls="pills-failed" aria-selected="false">Failed Tests <span class="badge badge-light">{{failures.length}}</span></a>
            </li>
            <li class="nav-item bg-warning" data-toggle="tooltip" title="Click to view the Skipped Tests">
                <a class="nav-link text-white" id="pills-skipped-tab" data-toggle="pill" href="#pills-skipped" role="tab" aria-controls="pills-skipped" aria-selected="false">Skipped Tests <span class="badge badge-light">{{#gt skippedTests.length 0}}{{skippedTests.length}}{{else}}0{{/gt}}</span></a>
            </li>
            </ul>
        {{/with}}
        <div class="tab-content" id="pills-tabContent">
            <div class="tab-pane fade show active" id="pills-summary" role="tabcard" aria-labelledby="pills-summary-tab">
<div class="row">
  <div class="col-md-9 col-lg-12 main">
   <h1 class="display-{{titleSize}} text-center">{{title}}</h1>
   <h5 class="text-center">{{timestamp}}</h5>
{{#with summary}}
   <div class="row">
    <div class="col-lg-3 col-md-6">
     <div class="card text-white card-success">
      <div class="card-body {{#gt failures.length 0}}bg-danger{{else}}bg-success{{/gt}}">
       <div class="rotate">
        <i class="fa fa-retweet fa-5x"></i>
       </div>
       <h6 class="text-uppercase">Total Iterations</h6>
       <h1 class="display-{{#gt stats.assertions.total 999 }}4{{else}}1{{/gt}}">{{stats.iterations.total}}</h1>
      </div>
     </div>
    </div>
    <div class="col-lg-3 col-md-6">
     <div class="card text-white card-danger">
      <div class="card-body bg-success">
       <div class="rotate">
        <i class="fa fa-list fa-4x"></i>
       </div>
       <h6 class="text-uppercase">Total Assertions</h6>
       <h1 class="display-{{#gt stats.assertions.total 999 }}4{{else}}1{{/gt}}">{{totalTests stats.assertions.total skippedTests.length}}</h1>
      </div>
     </div>
    </div>
    <div class="col-lg-3 col-md-6">
     <div class="card text-white card-info">
      <div class="card-body {{#gt failures.length 0}}bg-danger{{else}}bg-success{{/gt}}">
       <div class="rotate">
        <i class="fa fa-plus-circle fa-5x"></i>
       </div>
       <h6 class="text-uppercase">Total Failed Tests</h6>
       <h1 class="display-{{#gt stats.assertions.total 999 }}4{{else}}1{{/gt}}">{{failures.length}}</h1>
      </div>
     </div>
    </div>
    <div class="col-lg-3 col-md-6">
     <div class="card text-white card-warning">
      <div class="card-body {{#gt skippedTests.length 0}}bg-warning{{else}}bg-success{{/gt}}">
       <div class="rotate">
        <i class="fa fa-share fa-5x"></i>
       </div>
       <h6 class="text-uppercase">Total Skipped Tests</h6>
       <h1 class="display-{{#gt stats.assertions.total 999 }}4{{else}}1{{/gt}}">{{#gt skippedTests.length 0}}{{skippedTests.length}}{{else}}0{{/gt}}</h1>
      </div>
     </div>
    </div>
   </div>
   <hr>
    <div class="row">
    <div class="col">
        <div class="row">
        <div class="col-sm-12 mb-3">
            <div class="card border-info">
                <div class="card-body">
                <h5 class="card-title text-uppercase text-white text-center bg-info">File Information</h5>
                <span><i class="fas fa-file-code"></i></span><strong> Collection:</strong> {{collection.name}}<br>
                {{/with}}
                {{#if folders}}<span><i class="fas fa-folder"></i></span><strong> Specified Folders:</strong> {{folders}}<br>{{/if}}
                {{#with summary}}
                {{#if environment.name}}<span><i class="fas fa-file-code"></i></span><strong> Environment:</strong> {{environment.name}}<br>{{/if}}
                </div>
            </div>
        </div>
        </div>
        {{#if @root.showGlobalData}}
        {{#if globals.values.members.length}}
         <div class="row">
            <div class="col-sm-12 mb-3">
                <div class="card-deck">
                <div class="card border-info" style="width: 50rem;">
                    <h5 class="card-header bg-info text-center text-uppercase" style="height: 45px;">
                        <a data-toggle="collapse" href="#global-values" aria-expanded="true" aria-controls="collapse-example" id="global-heading" class="env-heading collapsed d-block" style="color: white;">
                            <i class="float-lg-right fa fa-chevron-down"></i>
                                Global Variables
                            </a>
                    </h5>
                    <div id="global-values" class="collapse" aria-labelledby="global-heading">
                    <div class="card-body">

                        <div class="table-responsive dyn-height">
                            <table class="table table-bordered">
                            <thead class="thead-light text-center"><tr><th>Variable Name</th><th>Variable Value</th></tr></thead>
                                <tbody>
                                    {{#each globals.values.members}}
                                    {{#isNotIn key @root.skipGlobalVars}}
                                    <tr>
                                        <td class="text-nowrap">{{key}}</td>
                                        <td>{{value}}</td>
                                    </tr>
                                    {{/isNotIn}}
                                    {{/each}}
                                </tbody>
                            </table>
                        </div>
                    </div>
                    </div>
                </div>
                </div>
            </div>
        </div>
        {{/if}}
        {{/if}}
        {{#if @root.showEnvironmentData}}
        {{#if environment.values.members.length}}
         <div class="row">
            <div class="col-sm-12 mb-3">
                <div class="card-deck">
                <div class="card border-info" style="width: 50rem;">
                    <h5 class="card-header bg-info text-center text-uppercase" style="height: 45px;">
                        <a data-toggle="collapse" href="#environment-values" aria-expanded="true" aria-controls="collapse-example" id="environment-heading" class="env-heading collapsed d-block" style="color: white;">
                            <i class="float-lg-right fa fa-chevron-down"></i>
                                Environment Variables
                            </a>
                    </h5>
                    <div id="environment-values" class="collapse" aria-labelledby="environment-heading">
                    <div class="card-body">

                        <div class="table-responsive dyn-height">
                            <table class="table table-bordered">
                            <thead class="thead-light text-center"><tr><th>Variable Name</th><th>Variable Value</th></tr></thead>
                                <tbody>
                                    {{#each environment.values.members}}
                                    {{#isNotIn key @root.skipEnvironmentVars}}
                                    <tr>
                                        <td class="text-nowrap">{{key}}</td>
                                        <td>{{value}}</td>
                                    </tr>
                                    {{/isNotIn}}
                                    {{/each}}
                                </tbody>
                            </table>
                        </div>
                    </div>
                    </div>
                </div>
                </div>
            </div>
        </div>
        {{/if}}
        {{/if}}
        {{#if collection.description}}
        <div class="row">
        <div class="col-sm-12 mb-3">
            <div class="card border-info">
                <div class="card-body">
                <h5 class="card-title text-uppercase text-white text-center bg-info">Collection Description</h5>
                <div class="dyn-height">
                    <code class="renderMarkdown">{{collection.description}}</code>
                </div>
                </div>
            </div>
        </div>
        </div>
        {{/if}}
        <div class="row">
        <div class="col-sm-12 mb-3">
            <div class="card border-info">
                <div class="card-body">
                <h5 class="card-title text-uppercase text-white text-center bg-info">Timings and Data</h5>
                <span><i class="fas fa-stopwatch"></i></span><strong> Total run duration:</strong> {{duration}}<br>
                <span><i class="fas fa-database"></i></span><strong> Total data received:</strong> {{responseTotal}}<br>
                <span><i class="fas fa-stopwatch"></i></span><strong> Average response time:</strong> {{responseAverage}}<br>
                </div>
            </div>
        </div>
        </div>
    {{/with}}
        <div class="row">
        <div class="col-sm-12 mb-3">
            <div class="table-responsive">
            <table class="table table-striped table-bordered">
                <thead class="thead-inverse">
                    <tr class="text-center">
                        <th class="text-uppercase">Summary Item</th>
                        <th class="text-uppercase">Total</th>
                        <th class="text-uppercase">Failed</th>
                    </tr>
                </thead>
                <tbody>
                {{#with summary.stats}}
                    <tr>
                        <td>Requests</td>
                        <td class="text-center">{{requests.total}}</td>
                        <td class="text-center">{{requests.failed}}</td>
                    </tr>
                    <tr>
                        <td>Prerequest Scripts</td>
                        <td class="text-center">{{prerequestScripts.total}}</td>
                        <td class="text-center">{{prerequestScripts.failed}}</td>
                    </tr>
                    <tr>
                        <td>Test Scripts</td>
                        <td class="text-center">{{testScripts.total}}</td>
                        <td class="text-center">{{testScripts.failed}}</td>
                    </tr>
                    {{/with}}
                    {{#with summary}}
                    <tr class="{{#gt failures.length 0}}table-danger{{/gt}}">
                        <td>Assertions</td>
                        <td class="text-center">{{totalTests stats.assertions.total skippedTests.length}}</td>
                        <td class="text-center">{{stats.assertions.failed}}</td>
                    </tr>
                    <tr class="{{#gt skippedTests.length 0}}table-warning{{/gt}}">
                        <td>Skipped Tests</td>
                        <td class="text-center">{{#gt skippedTests.length 0}}{{skippedTests.length}}{{else}}0{{/gt}}</td>
                        <td class="text-center">-</td>
                    </tr>
                    {{/with}}
                </tbody>
            </table>
            </div>
        </div>
        </div>
    <hr>
   </div>
   </div>
  </div>
 </div>
        </div>
            <div class="tab-pane fade" id="pills-failed" role="tabcard" aria-labelledby="pills-failed-tab">
                <button id="topOfFailuresScreen" class="btn btn-outline-success btn-sm backToTop" onclick="topFunction()">Go To Top</button>

                {{#if summary.failures.length}}
                    <div class="btn-group float-right" role="group" aria-label="Button Group">
                        <button id="openAllFailed" class="btn btn-outline-success btn-sm float-right" style="text-align: center; width: 185px;">Expand All Failed Tests</button>
                    </div>
                    <br>
                    <br>

                    {{#with summary}}
                    <div class="alert alert-danger text-uppercase text-center">
                        <h4>Showing {{failures.length}} {{#gt failures.length 1}}Failures{{else}}Failure{{/gt}}</h4>
                    </div>
                    {{/with}}
                    {{#each summary.failures}}
                    <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                        <div class="card border-danger">
                            <div class="card-header bg-danger">
                                <a data-toggle="collapse" href="#" data-target="#fails-collapse-{{error.id}}" aria-expanded="false" aria-controls="collapse" id="fails-{{error.id}}" class="collapsed text-white z-block">
                                    Iteration {{inc cursor.iteration}} - {{error.name}} - {{parent.name}} - {{source.name}} <i class="float-lg-right fa fa-chevron-down" style="padding-top:5px;"></i>
                                </a>
                            </div>
                            <div id="fails-collapse-{{error.id}}" class="collapse" aria-labelledby="fails-{{error.id}}">
                            <div class="card-body">
                                <h5 {{#if @root.showMarkdownLinks}}class="renderMarkdown"{{/if}}><strong>Failed Test:</strong> {{error.test}}</h5>
                            <hr>
                            <h5 class="card-title text-uppercase text-white text-center bg-danger">Assertion Error Message</h5>
                            <div>
                                <pre><code {{#if @root.showMarkdownLinks}}class="renderMarkdown"{{/if}}>{{error.message}}</code></pre>
                            </div>
                            </div>
                            </div>
                        </div>
                    </div>
                    </div>
                    {{/each}}
                {{else}}
                <div class="alert alert-success text-uppercase text-center">
                     <br><br><h1 class="text-center">There are no failed tests <span><i class="far fa-thumbs-up"></i></span></h1><br><br>
                </div>
                {{/if}}
            </div>

            <div class="tab-pane fade" id="pills-skipped" role="tabcard" aria-labelledby="pills-skipped-tab">
                <button id="topOfSkippedScreen" class="btn btn-outline-success btn-sm backToTop" onclick="topFunction()">Go To Top</button>

                {{#if summary.skippedTests.length}}
                    <div class="btn-group float-right" role="group" aria-label="Button Group">
                        <button id="openAllSkipped" class="btn btn-outline-success btn-sm float-right" style="text-align: center; width: 185px;">Expand All Skipped Tests</button>
                    </div>
                    <br>
                    <br>

                    {{#with summary}}
                    <div class="alert alert-warning text-uppercase text-center">
                        <h4>Showing {{skippedTests.length}} Skipped {{#gt skippedTests.length 1}}Tests{{else}}Test{{/gt}}</h4>
                    </div>
                    {{/with}}
                    {{#each summary.skippedTests}}
                    <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                        <div class="card border-warning">
                            <div class="card-header bg-warning text-white">
                                <a data-toggle="collapse" href="#" data-target="#skipped-collapse-{{cursor.ref}}" aria-expanded="false" aria-controls="collapse" id="skipped-{{cursor.ref}}" class="collapsed text-white z-block">
                                    Iteration {{inc cursor.iteration}} - {{assertion}} <i class="float-lg-right fa fa-chevron-down" style="padding-top:5px;"></i>
                                </a>
                            </div>
                            <div id="skipped-collapse-{{cursor.ref}}" class="collapse" aria-labelledby="skipped-{{cursor.ref}}">
                            <div class="card-body">
                                <h5><strong>Request Name:</strong> {{item.name}}</h5>
                            </div>
                            </div>
                        </div>
                    </div>
                    </div>
                    {{/each}}
                {{else}}
                <div class="alert alert-success text-uppercase text-center">
                    <br><br><h1 class="text-center">There are no skipped tests <span><i class="far fa-thumbs-up"></i></span></h1><br><br>
                </div>
                {{/if}}
            </div>
            <div class="tab-pane fade" id="pills-requests" role="tabcard" aria-labelledby="pills-requests-tab">

            <button id="topOfRequestsScreen" class="btn btn-outline-success btn-sm backToTop" onclick="topFunction()">Go To Top</button>

            <div class="btn-group float-right" role="group" aria-label="Button Group">
                {{#if summary.failures.length}}
                <button id="showOnlyFailures" class="btn btn-outline-success btn-sm float-right" style="text-align: center; width:160px;">Show Failed Iterations</button>
                {{/if}}
                <button id="openAll" class="btn btn-outline-success btn-sm float-right" style="text-align: center; width: 140px;">Expand Folders</button>
                <button id="openAllRequests" class="btn btn-outline-success btn-sm float-right" style="text-align: center; width: 140px;">Expand Requests</button>
            </div>

    <div class="text-uppercase" id="execution-menu">
        {{#with summary}}
        <h5>{{stats.iterations.total}} {{#gt stats.iterations.total 1}}Iterations{{else}}Iteration{{/gt}} available to view</h5>
        {{#gt stats.iterations.total 18}}<input class="form-control w-25" style="margin-bottom: 5px;" id="filterInput" type="number" min="1" placeholder="Filter Iterations">{{/gt}}
        {{/with}}
        <nav class="table-responsive">
        <ul class="nav {{#gt summary.stats.iterations.total 18}}nav-tabs{{else}}single-line-tabs{{/gt}}" id="iterationList">
        </ul>
        </nav>
    </div>
    <h6 class="text-uppercase text-muted" id="iterationSelected" style="padding-top: 10px;"></h6>
	<div class="tab-content" id="execution-data">
{{#each aggregations}}
    {{#isNotIn parent.name @root.skipFolders}}
    {{#if parent.name }}
        <div class="alert alert-dark text-uppercase text-center iteration-{{parent.iteration}}">
        <a data-toggle="collapse" href="#" data-target="#folder-collapse-{{parent.id}}-iteration-{{parent.iteration}}" aria-expanded="false" aria-controls="collapse" id="folder-{{parent.id}}-iteration-{{parent.iteration}}" class="collapsed text-dark z-block">
        <i class="fas fa-info-circle float-left resultsInfoPass" {{#each executions}}{{#if cumulativeTests.failed}} style="color: #c24a3f; padding-top: 4px;"{{/if}}{{/each}}></i>
            {{parent.name}} - {{executions.length}} {{#gt executions.length 1}}Requests{{else}}Request{{/gt}} in the folder<i class="float-lg-right fa fa-chevron-down" style="padding-top: 5px;"></i>
        </a>
        </div>
        <div id="folder-collapse-{{parent.id}}-iteration-{{parent.iteration}}" class="collapse" aria-labelledby="folder-{{parent.id}}">
        {{> aggregations}}
        </div>
        {{else}}
        {{> aggregations}}
    {{/if}}
    {{/isNotIn}}
{{/each}}
        </div>
    </div>
    </div>
    </div>
    </div>
    </div>

{{#*inline "aggregations"}}
{{#isNotIn parent.name @root.skipFolders}}
{{#if @root.showFolderDescription}}
{{#if parent.description.content}}

    <div class="row">
        <div class="col-sm-12 mb-3">
        <div class="card-deck">
            <div class="card border-info" style="width: 50rem;">
                <div class="card-body">
                <h5 class="card-title text-uppercase text-white text-center bg-info">Folder Description</h5>
                    <div class="dyn-height">
                        <code class="renderMarkdown">{{parent.description.content}}</code>
                    </div>
                </div>
            </div>
        </div>
        </div>
    </div>
{{/if}}
{{/if}}
{{#each executions}}
{{#isNotIn item.name @root.skipRequests}}
    <div id="folder-{{cursor.ref}}" class="card-deck iteration-{{cursor.iteration}}">
    <div class="row iteration-{{cursor.iteration}}">
        <div class="col-sm-12 mb-3 iteration-{{cursor.iteration}}">
        <div class="card iteration-{{cursor.iteration}}">
            <div class="card-header {{#if cumulativeTests.failed}} bg-danger{{else}} bg-success{{/if}} iteration-{{cursor.iteration}}">
                <a data-toggle="collapse" href="#" data-target="#collapse-{{cursor.ref}}" aria-expanded="false" aria-controls="collapse" id="requests-{{cursor.ref}}" class="collapsed text-white z-block">
            Iteration: {{inc cursor.iteration}} - {{item.name}} <i class="float-lg-right fa fa-chevron-down" style="padding-top: 5px;"></i>
        </a>
        {{#if cumulativeTests.skipped}}
        <span class="badge badge-warning text-white text-uppercase">{{cumulativeTests.skipped}} Skipped {{#gt cumulativeTests.skipped 1}}Tests{{else}}Test{{/gt}}</span>
        {{/if}}
            </div>
            <div id="collapse-{{cursor.ref}}" class="collapse" aria-labelledby="requests-{{cursor.ref}}">
            <div class="card-body">
                {{#with request}}
                {{#if description.content}}
                <div class="row">
                    <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                        <div class="card border-info" style="width: 50rem;">
                            <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Request Description</h5>
                                <div class="dyn-height">
                                    <code class="renderMarkdown">{{description.content}}</code>
                                </div>
                            </div>
                        </div>
                    </div>
                    </div>
                </div>
                {{/if}}
                {{/with}}
                <div class="row">
                    <div class="col-sm-12 mb-3">
                        <div class="card-deck">
                        <div class="card border-info" style="width: 50rem;">
                            <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Request Information</h5>
                            <span><i class="fas fa-info-circle"></i></span><strong> Request Method:</strong> <span class="badge-outline-success badge badge-success"> {{request.method}}</span><br>
                            <span><i class="fas fa-info-circle"></i></span><strong> Request URL:</strong> <a href="{{request.url}}" target="_blank">{{request.url}}</a><br>
                            </div>
                        </div>
                        <div class="card border-info" style="width: 50rem;">
                            <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Response Information</h5>
                            <span><i class="fas fa-info-circle"></i></span><strong> Response Code:</strong> <span class="float-right badge-outline badge badge-success"> {{response.code}} - {{response.status}}</span><br>
                            <span><i class="fas fa-stopwatch"></i></span><strong> Mean time per request:</strong> <span class="float-right badge-outline badge badge-success"> {{mean.time}}</span><br>
                            <span><i class="fas fa-database"></i></span><strong> Mean size per request:</strong> <span class="float-right badge-outline badge badge-success"> {{mean.size}}</span><br>
                            <hr>
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Test Pass Percentage</h5>
                            <div>
                                {{#if assertions.length}}
                                <div class="progress" style="height: 40px;">
                                    <div class="progress-bar {{#if cumulativeTests.failed}} bg-danger{{else}} bg-success{{/if}}" style="width: 100%" role="progressbar">
                                    <h5 style="padding-top:5px;"><strong>{{#gte cumulativeTests.passed 1}}{{percent cumulativeTests.passed cumulativeTests.failed}} %{{else}}0 %{{/gte}}</strong></h5>
                                    </div>
                                </div>
                                {{else}}
                                <div class="progress" style="height: 40px;">
                                    <div class="progress-bar bg-success" style="width: 100%" role="progressbar">
                                    <h5 class="text-uppercase text-white text-center" style="padding-top:5px;"><strong>No Tests for this request</strong></h5>
                                    </div>
                                </div>
                                {{/if}}
                            </div>
                            </div>
                        </div>
                    </div>
                    </div>
                </div>
                {{#with request}}
                {{#unless @root.omitHeaders}}
                {{#unless @root.skipSensitiveData}}
                <div class="row">
                    <div class="col-sm-12 mb-3">
                        <div class="card-deck">
                        <div class="card border-info" style="width: 50rem;">
                            <div class="card-body">
                                <h5 class="card-title text-uppercase text-white text-center bg-info">Request Headers</h5>
                                {{#if headers}}
                                <div class="table-responsive">
                                    <table class="table table-bordered">
                                    <thead class="thead-light text-center"><tr><th>Header Name</th><th>Header Value</th></tr></thead>
                                        <tbody>
                                            {{#each headers.members}}
                                            {{#isNotIn key @root.skipHeaders}}
                                            <tr>
                                                <td class="text-nowrap">{{key}}</td>
                                                <td class="text-wrap">{{value}}</td>
                                            </tr>
                                            {{/isNotIn}}
                                            {{/each}}
                                        </tbody>
                                    </table>
                                </div>
                                {{/if}}
                            </div>
                        </div>
                        </div>
                    </div>
                </div>
                {{/unless}}
                {{/unless}}
                {{/with}}
                {{#unless @root.skipSensitiveData}}
                {{#unless @root.omitRequestBodies}}
                {{#isNotIn item.name @root.hideRequestBody}}
                {{#with request}}
                {{#if body.raw}}
                <div class="row">
                <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                    <div class="card border-info" style="width: 50rem;">
                        <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Request Body</h5>
                                <div class="dyn-height">
                                    <pre><code id="copyReqText-{{@key}}" class="prettyPrint">{{body.raw}}</code></pre>
                                </div>
                                <div class="card-footer">
                                    <button class="btn btn-outline-secondary btn-sm copyButton" type="button" data-clipboard-action="copy" data-clipboard-target="#copyReqText-{{@key}}">Copy to Clipboard</button>
                                </div>
                        </div>
                    </div>
                    </div>
                </div>
                </div>
                {{/if}}
                {{/with}}
                {{/isNotIn}}
                {{/unless}}
                {{/unless}}
                {{#unless @root.skipSensitiveData}}
                {{#unless @root.omitRequestBodies}}
                {{#isNotIn item.name @root.hideRequestBody}}
                {{#with request}}
                {{#if body.formdata.members}}
                    <div class="row">
                        <div class="col-sm-12 mb-3">
                            <div class="card-deck">
                                <div class="card border-info" style="width: 50rem;">
                                    <div class="card-body">
                                        <h5 class="card-title text-uppercase text-white text-center bg-info">Request Body</h5>
                                        <div class="dyn-height">
                                            <pre><code id="copyReqText-{{@key}}" class="prettyPrint">{{formdata body.formdata.members}}</code></pre>
                                        </div>
                                        <div class="card-footer">
                                            <button class="btn btn-outline-secondary btn-sm copyButton" type="button" data-clipboard-action="copy" data-clipboard-target="#copyReqText-{{@key}}">Copy to Clipboard</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                {{/if}}
                {{/with}}
                {{/isNotIn}}
                {{/unless}}
                {{/unless}}
                {{#unless @root.skipSensitiveData}}
                {{#unless @root.omitRequestBodies}}
                {{#isNotIn item.name @root.hideRequestBody}}
                {{#with request}}
                {{#if body.urlencoded.members}}
                    <div class="row">
                        <div class="col-sm-12 mb-3">
                            <div class="card-deck">
                                <div class="card border-info" style="width: 50rem;">
                                    <div class="card-body">
                                        <h5 class="card-title text-uppercase text-white text-center bg-info">Request Body</h5>
                                        <div class="dyn-height">
                                            <pre><code id="copyReqText-{{@key}}" class="prettyPrint">{{formdata body.urlencoded.members}}</code></pre>
                                        </div>
                                        <div class="card-footer">
                                            <button class="btn btn-outline-secondary btn-sm copyButton" type="button" data-clipboard-action="copy" data-clipboard-target="#copyReqText-{{@key}}">Copy to Clipboard</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                {{/if}}
                {{/with}}
                {{/isNotIn}}
                {{/unless}}
                {{/unless}}
                {{#unless @root.skipSensitiveData}}
                {{#unless @root.omitRequestBodies}}
                {{#isNotIn item.name @root.hideRequestBody}}
                {{#with request}}
                {{#if body.graphql}}
                <div class="row">
                <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                    <div class="card border-info" style="width: 50rem;">
                        <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Request Body</h5>
                                <div class="dyn-height">
                                    <pre><code id="copyReqText-{{@key}}" class="prettyPrint">{{body.graphql.query}}</code></pre>
                                </div>
                                <div class="card-footer">
                                    <button class="btn btn-outline-secondary btn-sm copyButton" type="button" data-clipboard-action="copy" data-clipboard-target="#copyReqText-{{@key}}">Copy to Clipboard</button>
                                </div>
                                {{#if body.graphql.variables }}
                                <h6 class="card-title text-uppercase text-white text-center bg-info">Graphql Variables</h6>
                                <div class="dyn-height">
                                    <pre><code id="copyReqText-{{@key}}" class="prettyPrint">{{body.graphql.variables}}</code></pre>
                                </div>
                                {{/if}}
                        </div>
                    </div>
                    </div>
                </div>
                </div>
                {{/if}}
                {{/with}}
                {{/isNotIn}}
                {{/unless}}
                {{/unless}}
                {{#unless @root.omitHeaders}}
                {{#unless @root.skipSensitiveData}}
                <div class="row">
                <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                    <div class="card border-info" style="width: 50rem;">
                        <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Response Headers</h5>
                            {{#if response.header}}
                            <div class="table-responsive">
                                <table class="table table-bordered">
                                <thead class="thead-light text-center"><tr><th>Header Name</th><th>Header Value</th></tr></thead>
                                    <tbody>
                                        {{#each response.header}}
                                        {{#isNotIn key @root.skipHeaders}}
                                        <tr>
                                            <td class="text-nowrap">{{key}}</td>
                                            <td class="text-wrap">{{value}}</td>
                                        </tr>
                                        {{/isNotIn}}
                                        {{/each}}
                                    </tbody>
                                </table>
                            </div>
                            {{/if}}
                        </div>
                    </div>
                    </div>
                </div>
                </div>
                {{/unless}}
                {{/unless}}
                {{#unless @root.skipSensitiveData}}
                {{#unless @root.omitResponseBodies}}
                {{#isNotIn item.name @root.hideResponseBody}}
                <div class="row">
                <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                    <div class="card border-info" style="width: 50rem;">
                        <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Response Body</h5>
                            {{#if response.body}}
                                <div class="dyn-height">
                                        <pre><code id="copyText-{{item.id}}" class="prettyPrint">{{response.body}}</code></pre>
                                </div>
                                <div class="card-footer">
                                    <button class="btn btn-outline-secondary btn-sm copyButton" type="button" data-clipboard-action="copy" data-clipboard-target="#copyText-{{item.id}}">Copy to Clipboard</button>
                                </div>
                            {{else}}
                            <h5 class="alert alert-success text-uppercase text-center">No Response Body for this request</h5>
                            {{/if}}
                        </div>
                    </div>
                    </div>
                    </div>
                </div>
                {{/isNotIn}}
                {{/unless}}
                {{/unless}}
                {{#if consoleLogs.length}}
                <div class="row">
                <div class="col-sm-12 mb-3">
                    <div class="card-deck">
                    <div class="card border-info" style="width: 50rem;">
                        <div class="card-body">
                            <h5 class="card-title text-uppercase text-white text-center bg-info">Console Logs</h5>
                            <div class="dyn-height">
                            <div class="table-responsive">
                                <table class="table table-bordered">
                                <thead class="thead-light text-center"><tr><th>Log Messages</th></tr></thead>
                                    <tbody>
                                        {{#each consoleLogs}}
                                        <tr>
                                            <td style="word-wrap: break-word;min-width: 160px;max-width: 160px;"><pre><code class="prettyPrint">{{#each messages}}{{this}}{{/each}}</code></pre></td>
                                        </tr>
                                        {{/each}}
                                    </tbody>
                                </table>
                            </div>
                            </div>
                        </div>
                    </div>
                    </div>
                </div>
                </div>
                {{/if}}
                <div class="row">
                    <div class="card border-info">
                        <div class="card-body">
                        <h5 class="card-title text-uppercase text-white text-center bg-info">Test Information</h5>
                            {{#if assertions.length}}
                            <div class="table-responsive text-nowrap">
                                <table class="datatable table table-hover">
                                <thead><tr class="text-center"><th>Name</th><th>Passed</th><th>Failed</th><th>Skipped</th></tr></thead>
                                    <tbody>
                                        {{#each assertions}}
                                        <tr {{#if @root.showMarkdownLinks}}{{/if}}>
                                            <td {{#if @root.showMarkdownLinks}}class="renderMarkdown"{{/if}}>{{this.name}}</td>
                                            <td class="text-center {{#if this.passed}}bg-success{{/if}}">{{this.passed}}</td>
                                            <td class="text-center {{#if this.failed}}bg-danger{{/if}}">{{this.failed}}</td>
                                            <td class="text-center {{#if this.skipped}}bg-warning{{/if}}">{{this.skipped}}</td>
                                        </tr>
                                        {{/each}}
                                    </tbody>
                                    <tfoot>
                                        <tr class="bg-light">
                                            <td><strong>Total</strong></td>
                                            <td class="text-center">{{cumulativeTests.passed}}</td>
                                            <td class="text-center">{{cumulativeTests.failed}}</td>
                                            <td class="text-center">{{cumulativeTests.skipped}}</td>
                                        </tr>
                                    </tfoot>
                                </table>
                            </div>
                            <div class="row {{#lte cumulativeTests.failed 0}}d-none{{/lte}}">
                            <div class="col-sm-12 mb-3">
                                <div class="card-deck">
                                <div class="card border-danger" style="width: 50rem;">
                                    <div class="card-body">
                                        <h5 class="card-title text-uppercase text-white text-center bg-danger">Test {{#lte cumulativeTests.failed 1}}Failure{{else}}Failures{{/lte}}</h5>
                                        <div class="table-responsive">
                                            <table class="table table-hover">
                                            <thead><tr class="text-nowrap"><th>Test Name</th><th>Assertion Error</th></tr></thead>
                                                <tbody>
                                                    {{#each assertions}}
                                                    {{#isTheSame testFailure.test this.name}}
                                                    <tr>
                                                        <td class="w-45 text-nowrap {{#if @root.showMarkdownLinks}}renderMarkdown{{/if}}">{{testFailure.test}}</td>
                                                        <td class="w-55"><pre><code {{#if @root.showMarkdownLinks}}class="renderMarkdown"{{/if}}>{{testFailure.message}}</code></pre></td>
                                                    </tr>
                                                    {{/isTheSame}}
                                                    {{/each}}
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                </div>
                            </div>
                            </div>
                            {{else}}
                            <h5 class="alert alert-success text-uppercase text-center">No Tests for this request</h5>
                            {{/if}}
                        </div>
                    </div>
                </div>
            </div>
            </div>
        </div>
        </div>
    </div>
    </div>
{{/isNotIn}}
{{/each}}
{{/isNotIn}}
{{/inline}}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.datatables.net/v/bs4/dt-1.10.18/datatables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/remarkable/1.7.1/remarkable.min.js"></script>
{{#eq noSyntaxHighlighting false}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
{{/eq}}

<!-- Set slider initial position depending on the localstorage state -->

<script>
(function () {
  var sliderChecked = true;
  if (localStorage.getItem('theme') === 'theme-light') {
    setTheme('theme-light');
    sliderChecked = false;
  } else {
    setTheme('theme-dark');
    sliderChecked = true;
  }
  $(document).ready( function () {
    document.getElementById('slider').checked = sliderChecked;
  });
})();
</script>

<!-- Data Table Configuration -->

<script>
$(document).ready( function () {
    $('.datatable').DataTable({
        "retrieve": true,
        "paging": {{paging}},
        "info": false,
        "fixedColumns":   {
            "heightMatch": 'none'
        }
    });
});
</script>

<!-- Tooltip Configuration -->

<script>
$(document).ready(function() {
    $('[data-toggle="tooltip"]').tooltip({
        trigger : 'hover'
    })
})
</script>

<!-- Show/Hide The Folders -->

<script>
$('#openAll').on('click', function(e) {
let clickCount = $(this).data("clickCount") || 1
switch (clickCount){
    case 1:
        {{#each aggregations}}
            $('#folder-{{parent.id}}-iteration-{{parent.iteration}}').removeClass('collapsed')
            $('#folder-collapse-{{parent.id}}-iteration-{{parent.iteration}}').addClass('show')
        {{/each}}
        $('#openAll').html("Collapse Folders");
        break;
    case 2:
        {{#each aggregations}}
            $('#folder-{{parent.id}}-iteration-{{parent.iteration}}').addClass('collapsed')
            $('#folder-collapse-{{parent.id}}-iteration-{{parent.iteration}}').removeClass('show')
        {{/each}}
        $('#openAll').html("Expand Folders");
        break;
}
clickCount = clickCount > 1 ? 1 : ++clickCount;
$(this).data("clickCount", clickCount)
})
</script>

<!-- Show/Hide The Requests -->

<script>
$('#openAllRequests').on('click', function(e) {
let clickCount = $(this).data("clickCount") || 1
switch (clickCount){
    case 1:
        {{#each aggregations}}
        {{#each executions}}
            $('#requests-{{cursor.ref}}').removeClass('collapsed')
            $('#collapse-{{cursor.ref}}').removeClass('collapsed')
            $('#requests-{{cursor.ref}}').addClass('show')
            $('#collapse-{{cursor.ref}}').addClass('show')
        {{/each}}
        {{/each}}
        $('#openAllRequests').html("Collapse Requests");
        break;
    case 2:
        {{#each aggregations}}
        {{#each executions}}
            $('#requests-{{cursor.ref}}').addClass('collapsed')
            $('#collapse-{{cursor.ref}}').addClass('collapsed')
            $('#requests-{{cursor.ref}}').removeClass('show')
            $('#collapse-{{cursor.ref}}').removeClass('show')
        {{/each}}
        {{/each}}
        $('#openAllRequests').html("Expand Requests");
        break;
}
clickCount = clickCount > 1 ? 1 : ++clickCount;
$(this).data("clickCount", clickCount)
})
</script>

<!-- Show/Hide The Skipped Tests -->

<script>
$('#openAllSkipped').on('click', function(e) {
let clickCount = $(this).data("clickCount") || 1
switch (clickCount){
    case 1:
        {{#each aggregations}}
        {{#each executions}}
            $('#skipped-{{cursor.ref}}').removeClass('collapsed')
            $('#skipped-collapse-{{cursor.ref}}').removeClass('collapsed')
            $('#skipped-{{cursor.ref}}').addClass('show')
            $('#skipped-collapse-{{cursor.ref}}').addClass('show')
        {{/each}}
        {{/each}}
        $('#openAllSkipped').html("Collapse All Skipped Tests");
        break;
    case 2:
        {{#each aggregations}}
        {{#each executions}}
            $('#skipped-{{cursor.ref}}').addClass('collapsed')
            $('#skipped-collapse-{{cursor.ref}}').addClass('collapsed')
            $('#skipped-{{cursor.ref}}').removeClass('show')
            $('#skipped-collapse-{{cursor.ref}}').removeClass('show')
        {{/each}}
        {{/each}}
        $('#openAllSkipped').html("Expand All Skipped Tests");
        break;
}
clickCount = clickCount > 1 ? 1 : ++clickCount;
$(this).data("clickCount", clickCount)
})
</script>

<!-- Show/Hide The Failures -->

<script>
$('#openAllFailed').on('click', function(e) {
let clickCount = $(this).data("clickCount") || 1
let failedItemContent
let failedItemHeading
switch (clickCount){
    case 1:
        {{#each summary.failures}}
            failedItemHeading = $('#fails-{{error.id}}');
            failedItemContent = $("#fails-collapse-{{error.id}}");
            failedItemHeading.removeClass('collapsed')
            failedItemContent.removeClass('collapsed')
            failedItemHeading.addClass('show')
            failedItemContent.addClass('show')
        {{/each}}
        $('#openAllFailed').html("Collapse All Failed Tests");
        break;
    case 2:
        {{#each summary.failures}}
            failedItemHeading = $('#fails-{{error.id}}');
            failedItemContent = $("#fails-collapse-{{error.id}}");
            failedItemHeading.removeClass('show')
            failedItemContent.removeClass('show')
            failedItemHeading.addClass('collapsed')
            failedItemContent.addClass('collapsed')
        {{/each}}
        $('#openAllFailed').html("Expand All Failed Tests");
        break;
}
clickCount = clickCount > 1 ? 1 : ++clickCount;
$(this).data("clickCount", clickCount)
})
</script>

<!-- Pretty Print the Response Body-->

<script>
function isJSON(data)
{
    var ret = true;
    try {
            JSON.parse(data);
    }catch(e) {
            ret = false;
    }
    return ret;
}

function isXML(data)
{
    return (data.length > 0 && data[0] === '<');
}

// see https://gist.github.com/sente/1083506/d2834134cd070dbcc08bf42ee27dabb746a1c54d#gistcomment-2254622
function formatXML(data) {
    const PADDING = ' '.repeat(2); // set desired indent size here
    const reg = /(>)(<)(\/*)/g;
    let pad = 0;
    xml = data.replace(reg, '$1\r\n$2$3');

    return xml.split('\r\n').map((node, index) => {
        let indent = 0;
        if (node.match(/.+<\/\w[^>]*>$/)) {
            indent = 0;
        } else if (node.match(/^<\/\w/) && pad > 0) {
            pad -= 1;
        } else if (node.match(/^<\w[^>]*[^\/]>.*$/)) {
            indent = 1;
        } else {
            indent = 0;
        }

        pad += indent;
        return PADDING.repeat(pad - indent) + node;
    }).join('\r\n');
}

$(".prettyPrint").each(function () {
        var data = $(this).text();
        // Verify whether data is JSON
        if(isJSON(data))
        {
                obj = JSON.parse(data);
                data = JSON.stringify(obj, null, 2);
        }
        else if(isXML(data)) {
            data = formatXML(data);
        }
        $(this).text(data);
});
</script>


<!-- Copy Response Body To Clipboard -->

<script>
    var clipboard = new ClipboardJS('.copyButton');

    clipboard.on('success', function(e) {
        e.clearSelection();
        $(".copyButton").addClass("bg-success text-white")
        e.trigger.textContent = '✔ Copied!';
        window.setTimeout(function() {
            $(".copyButton").removeClass("bg-success text-white")
            e.trigger.textContent = 'Copy to Clipboard';
        }, 2000);
    });
    clipboard.on('error', function(e) {
        e.clearSelection();
        $(".copyButton").addClass("bg-danger text-white")
        e.trigger.textContent = '✗ Not Copied';
        window.setTimeout(function() {
            $(".copyButton").removeClass("bg-danger text-white")
            e.trigger.textContent = 'Copy to Clipboard';
        }, 2000);
    });

</script>

<!-- Render the Description Markdown and link in the test failures -->

<script>
    const remarkable = new Remarkable();

    const descriptions = document.querySelectorAll(".renderMarkdown");
    descriptions.forEach(description => {
        description.innerHTML = renderHtmlFromMarkdown(description.textContent);
    });
    function renderHtmlFromMarkdown(markdown) {
        return remarkable.render(trim(markdown));
    }
    function trim(string) {
        return string ? string.replace(/^ +| +$/gm, "") : string;
    }
</script>

<!-- Show/Hide The Toggles When Scrolling The Page -->

<script>
window.onscroll = function() {scrollFunction()};

function scrollFunction() {
  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
    document.getElementById("topOfRequestsScreen").style.display = "block";
    document.getElementById("topOfFailuresScreen").style.display = "block";
    document.getElementById("topOfSkippedScreen").style.display = "block";
    document.getElementById("openAll").style.display = "none";
    document.getElementById("openAllRequests").style.display = "none";

    {{#if summary.skippedTests.length}}
    document.getElementById("openAllSkipped").style.display = "none";
    {{/if}}

    {{#if summary.failures.length}}
    document.getElementById("showOnlyFailures").style.display = "none";
    document.getElementById("openAllFailed").style.display = "none";
    {{/if}}
  } else {
    document.getElementById("topOfRequestsScreen").style.display = "none";
    document.getElementById("topOfFailuresScreen").style.display = "none";
    document.getElementById("topOfSkippedScreen").style.display = "none";
    document.getElementById("openAll").style.display = "block";
    document.getElementById("openAllRequests").style.display = "block";

    {{#if summary.skippedTests.length}}
    document.getElementById("openAllSkipped").style.display = "block";
    {{/if}}
    {{#if summary.failures.length}}
    document.getElementById("showOnlyFailures").style.display = "block";
    document.getElementById("openAllFailed").style.display = "block";
    {{/if}}
  }
}

function topFunction() {
  document.body.scrollTop = 0;
  document.documentElement.scrollTop = 0;
}
</script>

<!-- Creates The Iteration Tabs -->

<script type="text/javascript">
    "use strict";

window.onload = function () {

  // set display for all blocks of response
  var allItems = document.querySelectorAll('[class*=iteration-]');
  allItems.forEach(function(elem){
    elem.style.display = 'block';
  });

  {{#with summary}} {{#with stats}}
  let totalIterations = {{iterations.total}};
  {{/with}} {{/with}}

  let menu = document.querySelector('#execution-menu .nav');

  for(var i = 0; i < totalIterations; i++)
  {
    let li = document.createElement('li');
    li.appendChild(document.createTextNode((i + 1)));
    li.setAttribute('id', 'iteration-' + i);
    li.classList.add("custom-tab");
    li.classList.add("itPassed");

    li.addEventListener('click', function() {
      //set display to none for all except row
      let allItems = document.querySelectorAll('[class*=iteration-]:not(.row)');
      allItems.forEach(function(elem) {
        elem.style.display = 'none';
      })

      let allMenus = document.querySelectorAll('[id*=iteration-]');
      allMenus.forEach(function(elem){
        elem.style.borderBottom = 'none';
      })

      this.style.borderBottom = 'solid 3px #032a33';

      let items = document.querySelectorAll("." + this.id + ':not(.row)');
      items.forEach(function(elem) {
        elem.style.display = elem.style.display == 'block' ? 'none' : 'block';
      })
    });
    menu.appendChild(li);
  }

  //shows first tab data
  document.getElementById('iteration-0').click();
  document.getElementById('iterationSelected').innerHTML = `Iteration ${document.getElementById('iteration-0').innerHTML} selected`

  {{#each aggregations}}
  {{#each executions}}
  {{#if cumulativeTests.failed}}
    $("#iteration-{{cursor.iteration}}").removeClass('itPassed').addClass('itFailed')
  {{/if}}
  {{/each}}
  {{/each}}
}
</script>

<!-- Create the Selected Iteration Label -->

<script>
$(document).ready(function(){
    $(function() {
        $("#iterationList li").click(function() {
            document.getElementById('iterationSelected').innerHTML = "Iteration " + this.innerHTML + " selected"
        });
    });
});
</script>

<!-- Filter Action for the Iterations -->

<script>
$("#filterInput").on("input paste", function() {
    var value = $(this).val();
    $("#iterationList li").filter(function() {
	    $("#showOnlyFailures").data("clickCount") ? $("#showOnlyFailures").click():null;
        $(this).toggle($(this).text().indexOf(value) > -1)
    });
});
</script>

<!-- Showing the Failed Interations -->

<script>
$('#showOnlyFailures').on('click', function(e) {
    let clickCount = $(this).data("clickCount") || 1
	$("#filterInput").val()!="" && clickCount==1 ? $("#filterInput").val('').trigger('input'): null;
    let selectedIteration = $('#iterationList li').filter(function () {
        return $(this).css('border-bottom').indexOf("solid") > -1 && $(this).hasClass('itFailed');
    });
    selectedIteration.length || clickCount > 1 ? null : $("#iterationList li.itFailed")[0].click()
    $("#iterationList li.itPassed").toggle()
    $("div.bg-success [id*=requests]").parents('[class^="row iteration-"]').toggle();
    clickCount = clickCount > 1 ? 1 : ++clickCount;
    clickCount > 1 ? $("#showOnlyFailures").html("Show All Iterations") : $("#showOnlyFailures").html("Show Failed Iterations");
    $(this).data("clickCount", clickCount)
})
</script>
</body>
</html>
