<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title><%= htmlWebpackPlugin.options.title %></title>
    <link rel="stylesheet" href="mocha/mocha.css" />
    <script src="mocha/mocha.js"></script>
  </head>
  <body>
    <div id="mocha"></div>
    <script>
      function duplicateTests(suite, iterations) {
        suite.tests = suite.tests.flatMap(
          t => new Array(iterations).fill(t)
        )
        for (const childSuite of suite.suites) {
            duplicateTests(childSuite, iterations)
        }
      }

      const ui = "<%= MOCHA_UI %>";
      const reporter = "<%= MOCHA_REPORTER %>";
      const color = <%= MOCHA_COLOR %>;
      const timeout = <%= MOCHA_TIMEOUT %>;
      const grep = <%= MOCHA_GREP %>;
      const iterate = <%= MOCHA_ITERATE %>;

      mocha.setup({ ui, reporter, color, timeout, grep });

      const mochaStatus = {
        completed: 0,
        failed: 0,
        finished: false,
      };

      // save test status on window to access it with playwright
      window.mochaStatus = mochaStatus;

      window.addEventListener('DOMContentLoaded', () => {
          duplicateTests(mocha.suite, iterate)
          mocha
            .run()
            .on('test end', () => mochaStatus.completed++)
            .on('fail', () => mochaStatus.failed++)
            .on('end', () => {(mochaStatus.finished = true)});
      });
    </script>
  </body>
</html>
