<!DOCTYPE html>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
<script src="../node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
<script src="../bower_components/web-component-tester/browser.js"></script>

<title>gr-checks-item</title>

<test-fixture id="basic">
  <template>
    <gr-checks-item></gr-checks-item>
  </template>
</test-fixture>

<script type="module">
  import '../test/common-test-setup.js';
  import './gr-checks-item.js';
  const CHECKS_ITEM = {
    MESSAGE: 1,
    NAME: 2,
    BLOCKING: 3,
    STATUS: 4,
    START_TIME: 5,
    DURATION: 6,
    DETAILS: 7,
    RERUN: 8,
    DESCRIPTION: 9,
  };
  suite('gr-checks-item tests', () => {
    let element;
    let sandbox;
    let retryCheckSpy;

    setup(done => {
      sandbox = sinon.sandbox.create();
      retryCheckSpy = sinon.stub();
      retryCheckSpy.returns(Promise.resolve());

      element = fixture('basic');
      element.retryCheck = retryCheckSpy;
      element.check = {
        checkId: 'test-check-id',
        url: 'http://example.com/test-log-url',
        started: '2019-02-06T22:25:19.269Z',
        finished: '2019-02-06T22:25:44.574Z',
      };
      flush(done);
    });

    teardown(() => { sandbox.restore(); });

    test('renders the status', () => {
      const idx = CHECKS_ITEM.STATUS;
      const status = element.shadowRoot
          .querySelector(`td:nth-of-type(${idx}) > gr-checks-status`);
      assert.isOk(status);
    });

    test('renders the start time', () => {
      assert.equal(element._startTime, '2019-02-06T22:25:19.269Z');
    });

    suite('duration', () => {
      test('renders the run duration', () => {
        const idx = CHECKS_ITEM.DURATION;
        const name = element.$$(`td:nth-of-type(${idx})`);
        assert.equal(name.textContent.trim(), '25 sec');
      });

      test('renders 0 sec when the start and end time are the same', () => {
        element.check = {
          checkId: 'test-check-id',
          url: 'http://example.com/test-log-url',
          started: '2019-02-06T22:25:19.269Z',
          finished: '2019-02-06T22:25:19.269Z',
        };
        const idx = CHECKS_ITEM.DURATION;
        const name = element.shadowRoot
            .querySelector(`td:nth-of-type(${idx})`);
        assert.equal(name.textContent.trim(), '0 sec');
      });
    });

    test('renders a link to the log', () => {
      const idx = CHECKS_ITEM.DETAILS;
      const logLink = element.shadowRoot
          .querySelector(`td:nth-of-type(${idx}) > a`);
      assert.equal(logLink.getAttribute('href'),
          'http://example.com/test-log-url');
      assert.equal(logLink.textContent.trim(), 'Details');
    });
  });
</script>