@instructure/outcomes-ui 2.1.3 → 2.1.5

package/es/translated/cy/components/FlashAlert/index.test.js

@@ -0,0 +1,90 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import React from 'react';
+import ReactDOM from 'react-dom';
+import sinon from 'sinon';
+import { expect } from 'chai';
+import { mount } from 'enzyme';
+import FlashAlert, { showFlashAlert, showFlashError, showFlashSuccess, defaultTimeout } from "../FlashAlert/index.js";
+describe('FlashAlert', function () {
+  var renderSpy;
+  var clock;
+  beforeEach(function () {
+    renderSpy = sinon.spy(ReactDOM, 'render');
+    clock = sinon.useFakeTimers();
+  });
+  afterEach(function () {
+    renderSpy.restore();
+    clock.restore();
+  });
+
+  var makeProps = function makeProps(props) {
+    return _objectSpread({
+      message: 'This is a test error message 123',
+      timeout: defaultTimeout,
+      error: new Error('This is a test error 321'),
+      variant: 'error',
+      onClose: sinon.spy(),
+      screenReaderOnly: false
+    }, props);
+  };
+
+  it('renders', function () {
+    var screen = mount( /*#__PURE__*/React.createElement(FlashAlert, makeProps({})));
+    expect(screen.text()).to.match(/This is a test error message 123/);
+    expect(screen.text()).to.match(/This is a test error 321/);
+  });
+  it('renders, but does not show loading chunk text', function () {
+    var screen = mount( /*#__PURE__*/React.createElement(FlashAlert, makeProps({
+      error: new Error('loading chunk 123')
+    })));
+    expect(screen.text()).to.match(/This is a test error message 123/);
+    expect(screen.text()).not.to.match(/loading chunk 123/);
+  });
+  it('renders Transition component', function () {
+    var screen = mount( /*#__PURE__*/React.createElement(FlashAlert, makeProps({})));
+    var transition = screen.find('Transition').first();
+    expect(transition).to.exist;
+    expect(transition.prop('transitionOnMount')).to.be.true;
+    expect(transition.prop('in')).to.be.true;
+    expect(transition.prop('type')).to.eq('fade');
+    clock.tick(defaultTimeout);
+    screen.update();
+    var transition2 = screen.find('Transition').at(1);
+    expect(transition2.prop('in')).to.be.false;
+  });
+  it('renders Alert component', function () {
+    var props = makeProps({});
+    var screen = mount( /*#__PURE__*/React.createElement(FlashAlert, props));
+    var alert = screen.find('Alert');
+    expect(alert).to.exist;
+    expect(alert.prop('variant')).to.eq(props.variant);
+    expect(alert.prop('renderCloseButtonLabel')).to.eq('Close');
+    expect(alert.prop('onDismiss')).to.not.be.undefined;
+    expect(alert.prop('margin')).to.eq('small auto');
+    expect(alert.prop('timeout')).to.eq(props.timeout);
+    expect(alert.prop('liveRegion')).to.not.be.undefined;
+    expect(alert.prop('transition')).to.eq('fade');
+    expect(alert.prop('screenReaderOnly')).to.eq(props.screenReaderOnly);
+  });
+  describe('showFlashAlert', function () {
+    it('calls render', function () {
+      var props = makeProps({});
+      showFlashAlert(_objectSpread({}, props));
+      expect(renderSpy).to.have.been.called;
+    });
+  });
+  describe('showFlashError', function () {
+    it('calls render', function () {
+      var showAlert = showFlashError();
+      showAlert();
+      expect(renderSpy).to.have.been.called;
+    });
+  });
+  describe('showFlashSuccess', function () {
+    it('calls render', function () {
+      var showAlert = showFlashSuccess();
+      showAlert();
+      expect(renderSpy).to.have.been.called;
+    });
+  });
+});

package/es/translated/cy/components/OutcomeDescription/__tests__/index.test.js

@@ -3,11 +3,16 @@ import React from 'react';
 import { shallow, mount } from 'enzyme';
 import OutcomeDescription from "../index.js";
 import checkA11y from "../../../test/checkA11y.js";
+import { ratings } from "../../../test/mockOutcomesData.js";
 describe('OutcomeDescription', function () {
   function makeProps() {
     var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
     return Object.assign({
-      description: 'Hello there'
+      description: 'Hello there',
+      truncated: true,
+      ratings: ratings,
+      calculationMethod: 'latest',
+      calculationInt: {}
     }, props);
   }
 
@@ -40,6 +45,97 @@ describe('OutcomeDescription', function () {
     var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
     expect(wrapper.text()).to.match(/Outcome labelHello there/);
   });
+  it('renders only the description if user cannot manage outcomes', function () {
+    var props = makeProps({
+      label: 'Outcome label'
+    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+    expect(wrapper.text()).to.match(/Hello there/);
+  });
+  it('renders a friendly description if there is one and if expanded', function () {
+    var props = makeProps({
+      friendlyDescription: 'Outcome Friendly Description',
+      truncated: false
+    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+    var text = wrapper.find('Text').at(1);
+    expect(text.text()).to.match(/Outcome Friendly Description/);
+  });
+  it('does not render a friendly description if not expanded', function () {
+    var props = makeProps({
+      friendlyDescription: 'Outcome Friendly Description'
+    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+    expect(wrapper.find('Text')).to.have.length(1);
+    var text = wrapper.find('Text').at(0);
+    expect(text.text()).not.to.match(/Outcome Friendly Description/);
+  });
+  it('renders the ratings if expanded', function () {
+    var props = makeProps({
+      truncated: false
+    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+    expect(wrapper.find('Ratings')).to.have.length(1);
+  });
+  it('does not render the ratings if not expanded', function () {
+    var props = makeProps();
+    var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+    expect(wrapper.find('Ratings')).to.have.length(0);
+  });
+  describe('renders proficiency calculation text correctly', function () {
+    it('for latest method', function () {
+      var props = makeProps({
+        truncated: false
+      });
+      var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+      var text = wrapper.find('Text').last();
+      expect(text.text()).to.match(/Most Recent Score/);
+    });
+    it('for highest method', function () {
+      var props = makeProps({
+        calculationMethod: 'highest',
+        truncated: false
+      });
+      var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+      var text = wrapper.find('Text').last();
+      expect(text.text()).to.match(/Highest Score/);
+    });
+    it('for n mastery method', function () {
+      var n_mastery = {
+        n_mastery_count: 3
+      };
+      var props = makeProps({
+        calculationMethod: 'n_mastery',
+        calculationInt: n_mastery,
+        truncated: false
+      });
+      var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+      var text = wrapper.find('Text').last();
+      expect(text.text()).to.match(/Achieve Mastery 3 times/);
+    });
+    it('for average method', function () {
+      var props = makeProps({
+        calculationMethod: 'average',
+        truncated: false
+      });
+      var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+      var text = wrapper.find('Text').last();
+      expect(text.text()).to.match(/Average/);
+    });
+    it('for decaying average method', function () {
+      var n_mastery = {
+        decaying_average_percent: 65
+      };
+      var props = makeProps({
+        calculationMethod: 'decaying_average',
+        calculationInt: n_mastery,
+        truncated: false
+      });
+      var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+      var text = wrapper.find('Text').last();
+      expect(text.text()).to.eq('Decaying Average - 65%/35%');
+    });
+  });
   it('meets a11y standards', function () {
     return checkA11y( /*#__PURE__*/React.createElement(OutcomeDescription, makeProps()));
   });

package/es/translated/cy/components/OutcomeDescription/index.js

@@ -1,13 +1,29 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import Ratings from "../Ratings/index.js";
+import t from 'format-message';
+import { algorithmDataShape, scoringTierShape } from "../../store/shapes.js";
+import { HIGHEST, LATEST, N_MASTERY, DECAYING_AVERAGE, AVERAGE, CALCULATION_METHODS } from "../../constants.js";
+import { Flex } from '@instructure/ui-flex';
 import { Text } from '@instructure/ui-text';
 import { TruncateText } from '@instructure/ui-truncate-text';
+import { View } from '@instructure/ui-view';
 
 var OutcomeDescription = function OutcomeDescription(_ref) {
   var label = _ref.label,
       description = _ref.description,
-      truncate = _ref.truncate,
-      maxLines = _ref.maxLines;
+      friendlyDescription = _ref.friendlyDescription,
+      shouldTruncateText = _ref.shouldTruncateText,
+      maxLines = _ref.maxLines,
+      calculationMethod = _ref.calculationMethod,
+      calculationInt = _ref.calculationInt,
+      masteryPercent = _ref.masteryPercent,
+      pointsPossible = _ref.pointsPossible,
+      ratings = _ref.ratings,
+      truncated = _ref.truncated,
+      isTray = _ref.isTray,
+      canManageOutcomes = _ref.canManageOutcomes;
+  var descriptionDisplay = !canManageOutcomes && friendlyDescription ? friendlyDescription : description;
 
   var stripHtmlTags = function stripHtmlTags(text) {
     var doc = new DOMParser().parseFromString(text, 'text/html');
@@ -23,23 +39,138 @@ var OutcomeDescription = function OutcomeDescription(_ref) {
 
   var renderText = function renderText(text, position) {
     var strippedText = stripHtmlTags(text);
-    var renderedText = truncate ? truncateText(strippedText, position) : strippedText;
+    var renderedText = truncated && shouldTruncateText ? truncateText(strippedText, position) : strippedText;
     return /*#__PURE__*/React.createElement(Text, null, renderedText);
   };
 
-  return /*#__PURE__*/React.createElement(React.Fragment, null, label && renderText(label, 'middle'), description && renderText(description, 'end'));
+  var formatCalculationMethodText = function formatCalculationMethodText() {
+    var method = '';
+
+    switch (calculationMethod) {
+      case HIGHEST:
+        {
+          method = t(CALCULATION_METHODS[HIGHEST]);
+          break;
+        }
+
+      case LATEST:
+        {
+          method = t(CALCULATION_METHODS[LATEST]);
+          break;
+        }
+
+      case N_MASTERY:
+        {
+          var n = calculationInt.n_mastery_count;
+          method = t(CALCULATION_METHODS[N_MASTERY], {
+            n: n
+          });
+          break;
+        }
+
+      case AVERAGE:
+        {
+          method = t(CALCULATION_METHODS[AVERAGE]);
+          break;
+        }
+
+      case DECAYING_AVERAGE:
+        {
+          var percent = calculationInt.decaying_average_percent;
+          var complement = 100 - percent;
+          method = t(CALCULATION_METHODS[DECAYING_AVERAGE], {
+            percent: percent,
+            complement: complement
+          });
+        }
+    }
+
+    return method;
+  };
+
+  var renderFriendlyDescription = function renderFriendlyDescription() {
+    return friendlyDescription && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
+      as: "div",
+      margin: "x-small small 0 0",
+      padding: "small small x-small small",
+      background: "secondary",
+      "data-automation": "outcomeDescription__friendly_description_header"
+    }, /*#__PURE__*/React.createElement(Text, {
+      weight: "bold"
+    }, "Disgrifiad Cyfeillgar")), /*#__PURE__*/React.createElement(View, {
+      as: "div",
+      margin: "0 small x-small 0",
+      padding: "0 small small small",
+      background: "secondary",
+      "data-automation": "outcomeDescription__friendly_description_expanded"
+    }, /*#__PURE__*/React.createElement(Text, {
+      wrap: "break-word"
+    }, friendlyDescription)));
+  };
+
+  var renderRatingsAndCalculation = function renderRatingsAndCalculation() {
+    return /*#__PURE__*/React.createElement(View, null, ratings.length > 0 && /*#__PURE__*/React.createElement(View, {
+      as: "div",
+      margin: "small none"
+    }, /*#__PURE__*/React.createElement(Ratings, {
+      ratings: ratings,
+      masteryPercent: masteryPercent,
+      pointsPossible: pointsPossible,
+      isTray: isTray
+    })), calculationMethod && calculationInt && /*#__PURE__*/React.createElement(Flex, {
+      wrap: "wrap",
+      padding: "none small small none"
+    }, /*#__PURE__*/React.createElement(Flex.Item, {
+      as: "div",
+      padding: "none xx-small none none"
+    }, /*#__PURE__*/React.createElement(View, {
+      as: "div"
+    }, /*#__PURE__*/React.createElement(Text, {
+      weight: "bold"
+    }, "Proficiency Calculation:"))), /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(Text, {
+      color: "primary",
+      weight: "normal"
+    }, formatCalculationMethodText()))));
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, label && canManageOutcomes && /*#__PURE__*/React.createElement(View, {
+    as: "div",
+    margin: "0 0 xx-small"
+  }, renderText(label, 'middle')), !truncated && canManageOutcomes && renderFriendlyDescription(), description && /*#__PURE__*/React.createElement(View, {
+    as: "div",
+    margin: canManageOutcomes ? 'xx-small 0' : '0',
+    "data-automation": "outcomeDescription__description"
+  }, renderText(descriptionDisplay, 'end')), !truncated && renderRatingsAndCalculation());
 };
 
 OutcomeDescription.propTypes = {
-  description: PropTypes.string,
   label: PropTypes.string,
-  truncate: PropTypes.bool,
-  maxLines: PropTypes.number
+  description: PropTypes.string,
+  friendlyDescription: PropTypes.string,
+  shouldTruncateText: PropTypes.bool,
+  maxLines: PropTypes.number,
+  calculationMethod: PropTypes.string,
+  calculationInt: algorithmDataShape,
+  masteryPercent: PropTypes.number,
+  pointsPossible: PropTypes.number,
+  ratings: PropTypes.arrayOf(scoringTierShape),
+  truncated: PropTypes.bool,
+  isTray: PropTypes.bool,
+  canManageOutcomes: PropTypes.bool
 };
 OutcomeDescription.defaultProps = {
-  description: '',
   label: '',
-  truncate: true,
-  maxLines: 1
+  description: '',
+  friendlyDescription: '',
+  shouldTruncateText: true,
+  maxLines: 1,
+  isTray: false,
+  calculationMethod: '',
+  calculationInt: null,
+  masteryPercent: null,
+  pointsPossible: null,
+  ratings: [],
+  truncated: true,
+  canManageOutcomes: true
 };
 export default OutcomeDescription;

package/es/translated/cy/components/OutcomeDescription/index.stories.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import { text } from '@storybook/addon-knobs';
+import { text, object, boolean, number } from '@storybook/addon-knobs';
+import { outcomeViewWithResults } from "../../../.storybook/constants.js";
 import OutcomeDescription from "./index.js";
 export default {
   title: 'OutcomeDescription'
@@ -7,6 +8,17 @@ export default {
 export var standard = function standard() {
   return /*#__PURE__*/React.createElement(OutcomeDescription, {
     label: text('Label', 'Example Label'),
-    description: text('Description', 'Example Description')
+    description: text('Description', 'Example Description'),
+    friendlyDescription: text('Friendly Description', 'Example Friendly Description'),
+    shouldTruncateText: boolean('Truncate Text?', true),
+    maxLines: number('Max Lines', 1),
+    calculationMethod: text('Calculation Method', outcomeViewWithResults.scoring_method.algorithm),
+    calculationInt: object('Calculation Int', outcomeViewWithResults.scoring_method.algorithm_data),
+    masteryPercent: number('Mastery Percent', outcomeViewWithResults.scoring_method.mastery_percent),
+    pointsPossible: number('Points Possible', outcomeViewWithResults.scoring_method.points_possible),
+    ratings: object('Ratings', outcomeViewWithResults.scoring_method.scoring_tiers),
+    truncated: boolean('Collapsed?', true),
+    isTray: boolean('Render in Tray?', false),
+    canManageOutcomes: boolean('User can manage outcomes', true)
   });
 };

package/es/translated/cy/components/OutcomeTray/OutcomeList/__tests__/index.test.js

@@ -4,15 +4,12 @@ import sinon from 'sinon';
 import { shallow } from 'enzyme';
 import checkA11y from "../../../../test/checkA11y.js";
 import OutcomeList from "../index.js";
+import { OUTCOME_1 } from "../../../../test/mockOutcomesData.js";
 describe('OutcomeList', function () {
   function makeProps() {
     var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
     return Object.assign({
-      outcomes: [{
-        id: '1',
-        label: 'foo',
-        title: 'bar'
-      }],
+      outcomes: [OUTCOME_1],
       setFocusedOutcome: sinon.spy(),
       isOutcomeSelected: sinon.spy(),
       selectOutcomeIds: sinon.spy(),

package/es/translated/cy/components/OutcomeTray/__tests__/index.test.js

@@ -37,7 +37,8 @@ describe('OutcomeTray', function () {
       resetOutcomePicker: sinon.spy(),
       closeOutcomePicker: sinon.spy(),
       setInitialSelectedOutcomes: sinon.spy(),
-      shouldModifyArtifact: false
+      shouldModifyArtifact: false,
+      showAlert: sinon.spy()
     }, props);
   }
 
@@ -127,6 +128,15 @@ describe('OutcomeTray', function () {
     expect(props.saveOutcomePickerAlignments).to.be.called;
     expect(props.saveOutcomePickerAlignments).to.be.calledWith(props.onUpdate, false);
   });
+  it('calls showAlert when confirm alignment button is clicked', function () {
+    var props = makeProps({
+      saveOutcomePickerAlignments: sinon.stub().resolves(),
+      showAlert: sinon.stub().resolves()
+    });
+    wrapper = mount( /*#__PURE__*/React.createElement(OutcomeTray, props));
+    wrapper.find('Button').last().prop('onClick')();
+    expect(props.saveOutcomePickerAlignments).to.be.called;
+  });
   it('syncs selected and aligned outcomes on open', function () {
     var props = makeProps({
       isOpen: false

package/es/translated/cy/components/OutcomeTray/index.js

@@ -137,19 +137,23 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
   }, {
     key: "handleSubmit",
     value: function handleSubmit() {
+      var _this = this;
+
       var _this$props5 = this.props,
           saveOutcomePickerAlignments = _this$props5.saveOutcomePickerAlignments,
           onUpdate = _this$props5.onUpdate,
           closeOutcomePicker = _this$props5.closeOutcomePicker,
           shouldModifyArtifact = _this$props5.shouldModifyArtifact;
       return saveOutcomePickerAlignments(onUpdate, shouldModifyArtifact).then(function () {
-        return closeOutcomePicker();
+        _this.props.showAlert("Outcome alignments have been successfully updated.");
+
+        closeOutcomePicker();
       });
     }
   }, {
     key: "renderActions",
     value: function renderActions() {
-      var _this = this;
+      var _this2 = this;
 
       var closeOutcomePicker = this.props.closeOutcomePicker;
       return /*#__PURE__*/React.createElement("div", {
@@ -162,7 +166,7 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
         margin: "xxx-small",
         variant: "primary",
         onClick: function onClick() {
-          return _this.handleSubmit();
+          return _this2.handleSubmit();
         }
       }, "Cadarnhau Cysoniadau ")));
     }
@@ -253,7 +257,8 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
   displayMasteryDescription: PropTypes.bool,
   displayMasteryPercentText: PropTypes.bool,
   shouldModifyArtifact: PropTypes.bool,
-  scope: PropTypes.string.isRequired
+  scope: PropTypes.string.isRequired,
+  showAlert: PropTypes.func
 }, _class2.defaultProps = {
   screenreaderNotification: null,
   liveRegion: null,
@@ -267,6 +272,7 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
   displayMasteryPercentText: false,
   shouldModifyArtifact: false,
   searchTotal: null,
-  listTotal: null
+  listTotal: null,
+  showAlert: function showAlert() {}
 }, _temp)) || _class);
 export { OutcomeTray as default };

package/es/translated/cy/components/OutcomeTray/index.stories.js

@@ -24,7 +24,8 @@ var defaultProps = {
   getOutcomesList: function getOutcomesList() {},
   updateSearchPage: function updateSearchPage() {},
   closeOutcomePicker: function closeOutcomePicker() {},
-  resetOutcomePicker: function resetOutcomePicker() {}
+  resetOutcomePicker: function resetOutcomePicker() {},
+  showAlert: function showAlert() {}
 };
 export var paginatedNoSearch = function paginatedNoSearch() {
   return /*#__PURE__*/React.createElement(OutcomeTray, Object.assign({}, defaultProps, {

package/es/translated/cy/components/OutcomesPerStudent/ExportCSVButton/__tests__/index.test.js

@@ -0,0 +1,83 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { expect } from 'chai';
+import React from 'react';
+import sinon from 'sinon';
+import { mount } from 'enzyme';
+import ExportCSVButton, { headers } from "../index.js";
+import checkA11y from "../../../../test/checkA11y.js";
+import { NOT_FETCHING } from "../../../../constants.js";
+describe('OutcomesPerStudent/ExportCSVButton', function () {
+  var clock;
+  beforeEach(function () {
+    clock = sinon.useFakeTimers();
+  });
+  afterEach(function () {
+    clock.restore();
+  });
+
+  var makeProps = function makeProps(props) {
+    return _objectSpread({
+      fetchCSVData: sinon.spy(),
+      formatCSVData: sinon.spy(),
+      fetchingStatus: NOT_FETCHING,
+      artifactId: 1
+    }, props);
+  };
+
+  it('renders the export CSV button', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+    expect(wrapper.text()).to.match(/Export CSV/);
+  });
+  it('export CSV button is enabled by default', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+    expect(wrapper.find('Flex Button').prop('interaction')).to.equal('enabled');
+  });
+  it('export CSV button color is primary', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+    expect(wrapper.find('Flex Button').prop('color')).to.equal('primary');
+  });
+  it('export CSV button has onClick', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+    expect(wrapper.find('Flex Button').prop('onClick')).to.be.not.undefined;
+  });
+  it('click export CSV calls fetchCSVData', function () {
+    var props = makeProps({});
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, props));
+    var button = wrapper.find('Flex Button');
+    button.simulate('click');
+    expect(props.fetchCSVData).to.have.been.called;
+  });
+  it('starting export changes the export CSV button to cancel export', function () {
+    var props = makeProps({});
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, props));
+    var button = wrapper.find('Flex Button');
+    button.simulate('click');
+    expect(wrapper.text()).not.to.match(/Export CSV/);
+    expect(wrapper.text()).to.match(/Cancel Export/);
+    expect(wrapper.find('Flex Button').prop('interaction')).to.equal('enabled');
+    expect(wrapper.find('Flex Button').prop('color')).to.equal('secondary');
+  });
+  it('starting export displays the ProgressBar', function () {
+    var props = makeProps({});
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, props));
+    var button = wrapper.find('Flex Button');
+    button.simulate('click');
+    expect(wrapper.text()).to.match(/Exporting/);
+    expect(wrapper.find('ProgressBar')).to.exist;
+  });
+  it('correct headers are passed into CSVLink', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+    expect(wrapper.find('Flex span CSVLink').prop('headers')).to.equal(headers);
+  });
+  it('CSVLink is initially passed in no row data', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+    expect(wrapper.find('Flex span CSVLink').prop('data')).to.be.empty;
+  });
+  it('CSVLink is not keyboard accessible', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+    expect(wrapper.find('Flex span CSVLink').prop('tabIndex')).to.equal(-1);
+  });
+  it('meets a11y standards', function () {
+    return checkA11y( /*#__PURE__*/React.createElement(ExportCSVButton, makeProps({})));
+  });
+});