"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _d3Array = require("d3-array");

var _ScreenReaderContent = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/ScreenReaderContent"));

var _presenter = _interopRequireDefault(require("../presenter"));

var _Distribution = _interopRequireDefault(require("../../Distribution"));

var distributionStyles = {
  componentId: 'bIUJn',
  template: function template(theme) {
    return "\n\n.Distribution__styles__bar {\n  fill: ".concat(theme.barFillColor || 'inherit', ";\n}\n\n.Distribution__styles__barStar {\n  fill: ").concat(theme.barStarFillColor || 'inherit', ";\n}\n\n.Distribution__styles__barContainer {\n}\n\n.Distribution__styles__xAxis {\n  color: ").concat(theme.xAxisColor || 'inherit', ";\n}\n\n.Distribution__styles__barLabel {\n  color: ").concat(theme.barLabelColor || 'inherit', ";\n  font-family: ").concat(theme.barLabelFontFamily || 'inherit', ";\n  font-size: ").concat(theme.barLabelFontSize || 'inherit', ";\n  text-anchor: middle;\n}\n");
  },
  'bar': 'Distribution__styles__bar',
  'barStar': 'Distribution__styles__barStar',
  'barContainer': 'Distribution__styles__barContainer',
  'xAxis': 'Distribution__styles__xAxis',
  'barLabel': 'Distribution__styles__barLabel'
};
describe('CentileDistribution', function () {
  var testbed = createTestbed(_presenter.default, {
    animateDelay: null,
    animateDuration: null,
    visualDistribution: (0, _d3Array.range)(100)
  });
  shouldRenderComponent(testbed, {}, _presenter.default);
  it('should render ticks at 10% intervals', function () {
    testbed.render();
    var ticks = testbed.findChildrenBySelector(".".concat(distributionStyles.xAxis, " g.tick"));
    expect(ticks.length).to.eq(11);
    ticks.forEach(function (t, i) {
      expect(t.textContent).to.eq("".concat(i * 10, "%"));
      expect(t.attributes.transform.value).to.match(/translate\(\d+(\.\d+)?,0\)/);
    });
  });
  it('renders a table containing the raw chart data', function () {
    testbed.render();
    var tbody = testbed.findChildByTagName('tbody');
    var tableRows = tbody.querySelectorAll('tr');
    expect(tableRows).to.have.length(100);
    tableRows.forEach(function (tableRow, index) {
      var columns = tableRow.querySelectorAll('td');
      expect(testbed.getText(columns[0])).to.eq("".concat(index, "%"));
      expect(testbed.getText(columns[1])).to.eq("".concat(index));
    });
  });
  context('with starred score', function () {
    it('includes starred score in summary', function () {
      testbed.render({
        starScore: 0.96
      });
      var srNode = testbed.findChildrenByType(_ScreenReaderContent.default)[0];
      expect(testbed.getText(srNode)).to.include('You scored 96%');
    });
    it('passes the correct star index to the underlying distribution', function () {
      testbed.render({
        starScore: 0.42
      });
      var distribution = testbed.findChildByType(_Distribution.default);
      expect(distribution.props.starIndex).to.eq(42);
    });
    it('clamps the star index when star score is above 100%', function () {
      testbed.render({
        starScore: 1.1
      });
      var distribution = testbed.findChildByType(_Distribution.default);
      expect(distribution.props.starIndex).to.eq(99);
    });
    it('clamps the star index when star score is at 0%', function () {
      testbed.render({
        starScore: 0.0
      });
      var distribution = testbed.findChildByType(_Distribution.default);
      expect(distribution.props.starIndex).to.eq(0);
    });
  });
});