@instructure/outcomes-ui 2.1.2 → 2.1.3

package/es/translated/vi/store/shapes.js

@@ -0,0 +1,55 @@
+import PropTypes from 'prop-types';
+export var scoringMethodShape = PropTypes.shape({
+  algorithm: PropTypes.isRequired,
+  algorithm_data: PropTypes.object,
+  mastery_percent: PropTypes.number,
+  points_possible: PropTypes.number
+});
+export var outcomeShape = PropTypes.shape({
+  id: PropTypes.string.isRequired,
+  guid: PropTypes.string,
+  label: PropTypes.string,
+  title: PropTypes.string.isRequired,
+  friendly_description: PropTypes.string,
+  description: PropTypes.string,
+  scoring_method: scoringMethodShape,
+  group: PropTypes.bool
+});
+export var outcomeResultShape = PropTypes.shape({
+  averageScore: PropTypes.number.isRequired,
+  childArtifactCount: PropTypes.number.isRequired,
+  count: PropTypes.number.isRequired,
+  masteryCount: PropTypes.number.isRequired,
+  outcomeId: PropTypes.string.isRequired,
+  usesBank: PropTypes.bool
+});
+export var scoringTierShape = PropTypes.shape({
+  description: PropTypes.string.isRequired,
+  percent: PropTypes.number.isRequired,
+  count: PropTypes.number
+});
+export var individualResultShape = PropTypes.shape({
+  outcome: outcomeShape.isRequired,
+  outcome_id: PropTypes.number.isRequired,
+  outcome_rollup: PropTypes.shape({
+    average_score: PropTypes.number.isRequired
+  }).isRequired,
+  percent_score: PropTypes.number.isRequired
+});
+export var outcomeCalculationMethodShape = PropTypes.shape({
+  calculation_method: PropTypes.string.isRequired,
+  calculation_int: PropTypes.number
+});
+export var outcomeProficiencyRatingShape = PropTypes.shape({
+  color: PropTypes.string.isRequired,
+  mastery: PropTypes.bool.isRequired,
+  points: PropTypes.number.isRequired,
+  description: PropTypes.string.isRequired
+});
+export var outcomeProficiencyShape = PropTypes.shape({
+  outcome_proficiency_ratings: PropTypes.arrayOf(outcomeProficiencyRatingShape).isRequired
+});
+export var contextShape = PropTypes.shape({
+  outcome_calculation_method: outcomeCalculationMethodShape,
+  outcome_proficiency: outcomeProficiencyShape
+});

package/es/translated/vi/store/utils/paginationReducer.js

@@ -0,0 +1,20 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { handleActions } from 'redux-actions';
+import { combineReducers } from 'redux-immutable';
+
+var paginationReducer = function paginationReducer(actionRoot) {
+  var SET_PAGE = "SET_".concat(actionRoot, "_PAGE");
+  var SET_TOTAL = "SET_".concat(actionRoot, "_TOTAL");
+  var page = handleActions(_defineProperty({}, SET_PAGE, function (_state, action) {
+    return action.payload;
+  }), 1);
+  var total = handleActions(_defineProperty({}, SET_TOTAL, function (_state, action) {
+    return action.payload;
+  }), null);
+  return combineReducers({
+    page: page,
+    total: total
+  });
+};
+
+export default paginationReducer;

package/es/translated/vi/test/__tests__/checkA11y.test.js

@@ -0,0 +1,15 @@
+import checkA11y from "../checkA11y.js";
+describe('checkA11y', function () {
+  // The three lines of the browser check are enough to drop our file coverage
+  // below 90%
+  it('has full line coverage', function () {
+    var prior = process.title;
+    process.title = void 0; // eslint-disable-line immutable/no-mutation
+
+    try {
+      return checkA11y();
+    } finally {
+      process.title = prior; // eslint-disable-line immutable/no-mutation
+    }
+  });
+});

package/es/translated/vi/test/checkA11y.js

@@ -0,0 +1,48 @@
+import { mount } from 'enzyme';
+import axe from 'axe-core';
+import { expect } from 'chai';
+export default function checkA11y(reactElement) {
+  var options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+
+  // We can't run aXe outside the browser
+  if (process && process.title !== 'browser') {
+    return Promise.resolve();
+  }
+
+  var ignores = options.ignores || [];
+  var wrapper = mount(reactElement, {
+    attachTo: document.getElementById('testbed')
+  });
+  var node = wrapper.getDOMNode(); // eslint-disable-line react/no-find-dom-node
+
+  document.querySelectorAll('*[aria-labelledby]').forEach(function (el) {
+    el.getAttribute('aria-labelledby').split(' ').forEach(function (id) {
+      var message = 'aria-labelledby cannot reference parent';
+      expect(document.getElementById(id).contains(el), message).to.be.false;
+    });
+  });
+  var axeConfig = {
+    runOnly: {
+      type: 'tag',
+      values: ['wcag2a', 'wcag2aa', 'section508', 'best-practice']
+    },
+    rules: {
+      'color-contrast': {
+        enabled: false
+      } // TODO: high contrast mode
+
+    }
+  };
+  return axe.run(node, axeConfig).then(function (result) {
+    wrapper.unmount();
+    var violations = result.violations.filter(function (violation) {
+      return !ignores.includes(violation.id);
+    });
+
+    if (violations.length > 0) {
+      throw new Error(JSON.stringify(violations));
+    }
+
+    return result;
+  });
+}

package/es/translated/vi/test/createMockStore.js

@@ -0,0 +1,36 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import configureStore from 'redux-mock-store';
+import thunkMiddleware from 'redux-thunk';
+import sinon from 'sinon';
+import { Map } from 'immutable';
+import serviceMiddleware from '@instructure/redux-service-middleware';
+import { wrapAction, wrapDispatch } from 'multireducer';
+var mockService = {
+  loadOutcomes: sinon.stub().returns(Promise.resolve([])),
+  getAlignments: sinon.stub().returns(Promise.resolve([])),
+  getContext: sinon.stub().returns(Promise.resolve({})),
+  createAlignmentSet: sinon.stub().returns(Promise.resolve({
+    guid: 'newguid'
+  })),
+  outcomePickerState: 'closed'
+};
+export default function createMockStore() {
+  var state = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : Map();
+  var outcomesService = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : mockService;
+  var scope = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 'scopeForTest';
+  var baseStore = configureStore([thunkMiddleware, serviceMiddleware({
+    outcomes: outcomesService
+  })])(state);
+  return _objectSpread(_objectSpread({}, baseStore), {}, {
+    dispatch: wrapDispatch(baseStore.dispatch, scope)
+  });
+}
+export function scopeActions(actions) {
+  var scope = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 'scopeForTest';
+  return Object.keys(actions).reduce(function (set, key) {
+    return Object.assign(set, _defineProperty({}, key, function (arg) {
+      return wrapAction(actions[key](arg), scope);
+    }));
+  }, {});
+}

package/es/translated/vi/test/mocha-bootstrap.js

@@ -0,0 +1,39 @@
+import chai from 'chai';
+import crypto from 'crypto';
+import sinonChai from 'sinon-chai';
+import { JSDOM } from 'jsdom';
+import register from 'ignore-styles'; // By default, ignore-styles just returns an empty object. Unfortunately, many
+// of our tests select elements with a specific style name. We need to return
+// unique style names so our tests and files can properly use imported names.
+//
+// We could get even fancier here and verify the styles exist in the css file,
+// but that's a lot of work. Any problems should be caught in the karma tests
+// anyway.
+
+register(void 0, function (module, filename) {
+  var fileHash = crypto.createHash('sha256').update(filename).digest('hex').slice(0, 8);
+  var styleHandler = {
+    get: function get(target, name) {
+      // Ugh, babel import magic means we have to specify this, see
+      // https://github.com/babel/babel/issues/5079
+      if (name === '__esModule') {
+        return false;
+      } else if (typeof name === 'string') {
+        return "".concat(fileHash, "-").concat(name);
+      }
+    }
+  }; // eslint-disable-next-line no-param-reassign
+
+  module.exports = new Proxy({
+    fake: true
+  }, styleHandler);
+});
+chai.use(sinonChai); // Many tests require the global document / window objects, which we need to
+// fake
+
+var dom = new JSDOM('<!doctype html><html><body></body></html>');
+global.window = dom.window; // eslint-disable-line immutable/no-mutation
+
+global.document = dom.window.document; // eslint-disable-line immutable/no-mutation
+
+global.navigator = dom.window.navigator; // eslint-disable-line immutable/no-mutation

package/es/translated/vi/util/__tests__/debounceLatestPromise.test.js

@@ -0,0 +1,49 @@
+import { expect } from 'chai';
+import sinon from 'sinon';
+import debounceLatestPromise from "../debouceLatestPromise.js";
+describe('debounceLatestPromise', function () {
+  var dispatch = sinon.stub().resolves(function () {
+    return 'resolved';
+  });
+  var clock = null;
+  beforeEach(function () {
+    clock = sinon.useFakeTimers();
+  });
+  afterEach(function () {
+    clock.restore();
+    dispatch.resetHistory();
+  });
+  it('correctly debounces', function () {
+    var debounced = debounceLatestPromise(function () {
+      return dispatch.apply(void 0, arguments);
+    }, 500);
+    debounced('search #1');
+    clock.tick(400);
+    expect(dispatch).to.not.be.called;
+    clock.tick(100);
+    expect(dispatch).to.be.called.once;
+    expect(dispatch).to.be.calledWith('search #1');
+  });
+  it('correctly debounces the latest promise', function () {
+    var debounced = debounceLatestPromise(function () {
+      return dispatch.apply(void 0, arguments);
+    }, 500);
+    debounced('search #1');
+    debounced('search #2');
+    clock.tick(500);
+    expect(dispatch).to.be.called.once;
+    expect(dispatch).to.be.calledWith('search #2');
+  });
+  it('calls the function again after the timeout passes', function () {
+    var debounced = debounceLatestPromise(function () {
+      return dispatch.apply(void 0, arguments);
+    }, 500);
+    debounced('search #1');
+    clock.tick(500);
+    debounced('search #2');
+    clock.tick(500);
+    expect(dispatch).to.be.called.calledTwice;
+    expect(dispatch).to.be.calledWith('search #1');
+    expect(dispatch).to.be.calledWith('search #2');
+  });
+});

package/es/translated/vi/util/__tests__/proficienciesUtils.test.js

@@ -0,0 +1,140 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { expect } from 'chai';
+import { contextConfiguredWithProficiencies, getMasteryPercent, getScoringMethodFromContext, getScoringTiersFromContext } from "../proficienciesUtils.js";
+var contextWithProficiencies = {
+  id: 1,
+  outcome_proficiency: {
+    outcome_proficiency_ratings: [{
+      color: 'FF00FF',
+      mastery: false,
+      points: 5.0,
+      description: 'Exceeds Expectations'
+    }, {
+      color: 'FF00FF',
+      mastery: true,
+      points: 3.0,
+      description: 'Meets Expectations.'
+    }, {
+      color: 'FF00FF',
+      mastery: false,
+      points: 0.0,
+      description: 'Does Not Meet Expectations'
+    }]
+  },
+  outcome_calculation_method: {
+    calculation_method: 'highest',
+    calculation_int: null
+  }
+};
+var contextWithoutProficiencies = {
+  id: 1
+};
+describe('contextConfiguredWithProficiencies', function () {
+  it('returns true when context has proficiencies', function () {
+    expect(contextConfiguredWithProficiencies(contextWithProficiencies)).to.be.true;
+  });
+  it('returns false when context doesnt have proficiencies', function () {
+    expect(contextConfiguredWithProficiencies(contextWithoutProficiencies)).to.be.false;
+  });
+});
+describe('getMasteryPercent', function () {
+  it('returns correct mastery percent', function () {
+    expect(getMasteryPercent(contextWithProficiencies)).to.be.equal(0.6);
+  });
+  it('returns undefined when can not calculate', function () {
+    expect(getMasteryPercent(contextWithoutProficiencies)).to.be.undefined;
+  });
+});
+describe('getScoringMethodFromContext', function () {
+  it('returns correct scoring method for highest', function () {
+    expect(getScoringMethodFromContext(contextWithProficiencies)).to.be.deep.equal({
+      algorithm: 'highest',
+      algorithm_data: {},
+      mastery_percent: 0.6,
+      points_possible: 5
+    });
+  });
+  it('returns correct scoring method for decaying_average', function () {
+    expect(getScoringMethodFromContext(_objectSpread(_objectSpread({}, contextWithProficiencies), {}, {
+      outcome_calculation_method: {
+        calculation_method: 'decaying_average',
+        calculation_int: 65
+      }
+    }))).to.be.deep.equal({
+      algorithm: 'decaying_average',
+      algorithm_data: {
+        decaying_average_percent: 0.65
+      },
+      mastery_percent: 0.6,
+      points_possible: 5
+    });
+  });
+  it('returns correct scoring method for n_mastery', function () {
+    expect(getScoringMethodFromContext(_objectSpread(_objectSpread({}, contextWithProficiencies), {}, {
+      outcome_calculation_method: {
+        calculation_method: 'n_mastery',
+        calculation_int: 5
+      }
+    }))).to.be.deep.equal({
+      algorithm: 'n_mastery',
+      algorithm_data: {
+        n_mastery_count: 5
+      },
+      mastery_percent: 0.6,
+      points_possible: 5
+    });
+  });
+});
+describe('getScoringTiersFromContext', function () {
+  it('returns correct scoring method for highest', function () {
+    expect(getScoringTiersFromContext(contextWithProficiencies)).to.have.deep.members([{
+      description: 'Does Not Meet Expectations',
+      percent: 0
+    }, {
+      description: 'Meets Expectations.',
+      percent: 0.6
+    }, {
+      description: 'Exceeds Expectations',
+      percent: 1
+    }]);
+  });
+  it('returns undefined when context doesnt have proficiencies', function () {
+    expect(getScoringTiersFromContext(contextWithoutProficiencies)).to.be.undefined;
+  });
+  it('translates default description keys', function () {
+    var context = {
+      id: 1,
+      outcome_proficiency: {
+        outcome_proficiency_ratings: [{
+          color: 'FF00FF',
+          mastery: false,
+          points: 4.0,
+          description: 'DEFAULT_EXCEEDS_MASTERY'
+        }, {
+          color: 'FF00FF',
+          mastery: true,
+          points: 3.0,
+          description: 'DEFAULT_MASTERY'
+        }, {
+          color: 'FF00FF',
+          mastery: true,
+          points: 2.0,
+          description: 'DEFAULT_NEAR_MASTERY'
+        }, {
+          color: 'FF00FF',
+          mastery: true,
+          points: 1.0,
+          description: 'DEFAULT_BELOW_MASTERY'
+        }, {
+          color: 'FF00FF',
+          mastery: false,
+          points: 0.0,
+          description: 'DEFAULT_NO_EVIDENCE'
+        }]
+      }
+    };
+    expect(getScoringTiersFromContext(context).map(function (tier) {
+      return tier.description;
+    })).to.eql(['Exceeds Mastery', 'Mastery', 'Near Mastery', 'Below Mastery', 'No Evidence']);
+  });
+});

package/es/translated/vi/util/debouceLatestPromise.js

@@ -0,0 +1,26 @@
+import debounce from 'lodash/debounce';
+export default (function (f, ms) {
+  var waiting = null;
+
+  var ready = function ready() {
+    var old = waiting;
+    f.apply(void 0, arguments).then(function (r) {
+      return old.resolve(r);
+    }).catch(function (e) {
+      return old.reject(e);
+    });
+    waiting = null;
+  };
+
+  var debouncedThunk = debounce(ready, ms);
+  return function () {
+    var promise = new Promise(function (resolve, reject) {
+      return waiting = {
+        resolve: resolve,
+        reject: reject
+      };
+    });
+    debouncedThunk.apply(void 0, arguments);
+    return promise;
+  };
+});

package/es/translated/vi/util/proficienciesUtils.js

@@ -0,0 +1,85 @@
+export var contextConfiguredWithProficiencies = function contextConfiguredWithProficiencies(context) {
+  return !!(context !== null && context !== void 0 && context.outcome_proficiency && context !== null && context !== void 0 && context.outcome_calculation_method);
+};
+
+var getMaxPoints = function getMaxPoints(outcomeProficiencyRatings) {
+  var _outcomeProficiencyRa;
+
+  return (_outcomeProficiencyRa = outcomeProficiencyRatings.sort(function (r1, r2) {
+    return r1.points - r2.points;
+  }).reverse()[0]) === null || _outcomeProficiencyRa === void 0 ? void 0 : _outcomeProficiencyRa.points;
+};
+
+export var getMasteryPercent = function getMasteryPercent(context) {
+  var _context$outcome_prof, _outcomeProficiencyRa2;
+
+  var outcomeProficiencyRatings = (context === null || context === void 0 ? void 0 : (_context$outcome_prof = context.outcome_proficiency) === null || _context$outcome_prof === void 0 ? void 0 : _context$outcome_prof.outcome_proficiency_ratings) || [];
+  var masteryPoints = (_outcomeProficiencyRa2 = outcomeProficiencyRatings.find(function (r) {
+    return r.mastery;
+  })) === null || _outcomeProficiencyRa2 === void 0 ? void 0 : _outcomeProficiencyRa2.points;
+  var maxPoints = getMaxPoints(outcomeProficiencyRatings);
+
+  if (masteryPoints !== void 0 && ![0, void 0].includes(maxPoints)) {
+    return masteryPoints / maxPoints;
+  }
+};
+export var getScoringMethodFromContext = function getScoringMethodFromContext(context) {
+  var _context$outcome_calc = context.outcome_calculation_method,
+      calculation_method = _context$outcome_calc.calculation_method,
+      calculation_int = _context$outcome_calc.calculation_int,
+      outcome_proficiency_ratings = context.outcome_proficiency.outcome_proficiency_ratings;
+  var algorithm_data = {};
+
+  if (calculation_method === 'decaying_average') {
+    algorithm_data.decaying_average_percent = calculation_int / 100.0;
+  } else if (calculation_method === 'n_mastery') {
+    algorithm_data.n_mastery_count = calculation_int;
+  }
+
+  return {
+    algorithm: context.outcome_calculation_method.calculation_method,
+    algorithm_data: algorithm_data,
+    mastery_percent: getMasteryPercent(context),
+    points_possible: getMaxPoints(outcome_proficiency_ratings)
+  };
+};
+
+var translateDefaultRatingDescriptions = function translateDefaultRatingDescriptions(description) {
+  switch (description) {
+    case 'DEFAULT_EXCEEDS_MASTERY':
+      return "V\u01B0\u1EE3t M\u1EE9c Th\xE0nh Th\u1EA1o";
+
+    case 'DEFAULT_MASTERY':
+      return "Th\xE0nh Th\u1EA1o";
+
+    case 'DEFAULT_NEAR_MASTERY':
+      return "G\u1EA7n Th\xE0nh Th\u1EA1o";
+
+    case 'DEFAULT_BELOW_MASTERY':
+      return "D\u01B0\u1EDBi Th\xE0nh Th\u1EA1o";
+
+    case 'DEFAULT_NO_EVIDENCE':
+      return "Kh\xF4ng C\xF3 B\u1EB1ng Ch\u1EE9ng";
+
+    default:
+      return description;
+  }
+};
+
+export var getScoringTiersFromContext = function getScoringTiersFromContext(context) {
+  var _context$outcome_prof2;
+
+  var outcomeProficiencyRatings = context === null || context === void 0 ? void 0 : (_context$outcome_prof2 = context.outcome_proficiency) === null || _context$outcome_prof2 === void 0 ? void 0 : _context$outcome_prof2.outcome_proficiency_ratings;
+
+  if (!outcomeProficiencyRatings) {
+    return;
+  }
+
+  var maxPoints = getMaxPoints(outcomeProficiencyRatings);
+  return outcomeProficiencyRatings.map(function (rating) {
+    return {
+      description: translateDefaultRatingDescriptions(rating.description),
+      percent: rating.points / maxPoints
+    };
+  });
+};

package/es/translated/zh-Hans/components/AlignmentButton/__tests__/index.test.js

@@ -39,20 +39,20 @@ describe('AlignmentButton', function () {
     var wrapper = shallow( /*#__PURE__*/React.createElement(AlignmentButton, makeProps()), {
       disableLifecycleMethods: true
     });
-    expect(wrapper.find('Button')).to.have.length(1);
+    expect(wrapper.find('Button[data-automation="alignmentButton__button"]')).to.have.length(1);
     expect(wrapper.find('AccessibleContent')).to.have.length(1);
   });
-  it('does not render an alignment button if readOnly is true', function () {
+  it('does not render an alignment button if canManageOutcomes is false', function () {
     var wrapper = shallow( /*#__PURE__*/React.createElement(AlignmentButton, makeProps({
-      readOnly: true
+      canManageOutcomes: false
     })), {
       disableLifecycleMethods: true
     });
-    expect(wrapper.find('Button')).to.have.length(0);
+    expect(wrapper.find('Button[data-automation="alignmentButton__button"]')).to.have.length(0);
   });
-  it('does not render header if readOnly is true and no outcomes are aligned', function () {
+  it('does not render header if canManageOutcomes is false and no outcomes are aligned', function () {
     var wrapper = shallow( /*#__PURE__*/React.createElement(AlignmentButton, makeProps({
-      readOnly: true,
+      canManageOutcomes: false,
       alignedOutcomes: []
     })), {
       disableLifecycleMethods: true
@@ -61,16 +61,45 @@ describe('AlignmentButton', function () {
     expect(wrapper.find('IconOutcomesLine')).to.have.length(0);
     expect(wrapper.find('AlignmentCount')).to.have.length(0);
   });
+  it('disables the expansion toggle button if no outcomes are aligned', function () {
+    var wrapper = shallow( /*#__PURE__*/React.createElement(AlignmentButton, makeProps({
+      alignedOutcomes: []
+    })), {
+      disableLifecycleMethods: true
+    });
+    var buttonStyle = wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').props('style');
+    expect(buttonStyle.interaction).to.equal('disabled');
+  });
+  it('renders the alignment list collapsed by default', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, makeProps()));
+    expect(wrapper.find('AlignmentItem')).to.have.length(0);
+  });
+  it('expansion toggle click is correctly handled', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, makeProps()));
+    wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').simulate('click');
+    expect(wrapper.find('AlignmentItem')).to.have.length(3);
+    expect(wrapper.find('ScreenReaderContent').at(0).text()).to.eq('Collapse the list of aligned Outcomes');
+    expect(wrapper.find('IconArrowOpenDownLine')).to.have.length(1);
+  });
+  it('collapse toggle button click is correctly handled', function () {
+    var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, makeProps()));
+    wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').simulate('click');
+    wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').simulate('click');
+    expect(wrapper.find('AlignmentItem')).to.have.length(0);
+    expect(wrapper.find('ScreenReaderContent').at(0).text()).to.eq('Expand the list of aligned Outcomes');
+    expect(wrapper.find('IconArrowOpenEndLine')).to.have.length(1);
+  });
   it('calls openOutcomePicker when the button is pressed', function () {
     var props = makeProps();
     var wrapper = shallow( /*#__PURE__*/React.createElement(AlignmentButton, props), {
       disableLifecycleMethods: true
     });
-    wrapper.find('Button').simulate('click');
+    wrapper.find('Button[data-automation="alignmentButton__button"]').simulate('click');
     expect(props.openOutcomePicker.calledOnce).to.be.true;
   });
   it('renders AlignmentItems for each aligned outcome', function () {
     var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, makeProps()));
+    wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').simulate('click');
     expect(wrapper.find('AlignmentItem')).to.have.length(3);
   });
   it('renders an AlignmentCount object', function () {
@@ -84,6 +113,7 @@ describe('AlignmentButton', function () {
     it('calls the removeAlignment action with shouldUpdateArtifact equal to true', function () {
       var props = makeProps();
       var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, props));
+      wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').simulate('click');
       var first = wrapper.find('AlignmentItem').at(0);
       var remove = first.prop('removeAlignment');
       var outcome = first.prop('outcome');
@@ -92,23 +122,19 @@ describe('AlignmentButton', function () {
     });
     it('focuses on the previous alignment when the second alignment deleted', function () {
       var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, makeProps()));
-      var first = wrapper.find('AlignmentItem').at(0);
+      wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').simulate('click');
       var next = wrapper.find('AlignmentItem').at(1);
-      var focus = sinon.spy(first.instance(), 'focus');
       var remove = next.prop('removeAlignment');
       remove();
-      expect(focus.calledOnce).to.be.true;
-      expect(focus.calledWith()).to.be.true;
+      expect(wrapper.state().focusedItem).to.eq(0);
     });
     it('focuses on the next alignment when first alignment deleted', function () {
       var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, makeProps()));
+      wrapper.find('IconButton[data-automation="alignmentButton__collapseButton"]').simulate('click');
       var first = wrapper.find('AlignmentItem').at(0);
-      var next = wrapper.find('AlignmentItem').at(1);
       var remove = first.prop('removeAlignment');
-      var focus = sinon.spy(next.instance(), 'focus');
       remove();
-      expect(focus.calledOnce).to.be.true;
-      expect(focus.calledWith()).to.be.true;
+      expect(wrapper.state().focusedItem).to.eq(1);
     });
   });
   describe('componentDidUpdate', function () {
@@ -121,12 +147,12 @@ describe('AlignmentButton', function () {
         }]
       };
       var wrapper = mount( /*#__PURE__*/React.createElement(AlignmentButton, makeProps(outcomes)));
-      var trigger = wrapper.find('button').last();
+      var trigger = wrapper.find('Button[data-automation="alignmentButton__button"]').last();
       var focus = sinon.spy(trigger.instance(), 'focus');
       wrapper.setProps({
         alignedOutcomes: []
       }, function () {
-        expect(wrapper.find('button')).to.have.length(1);
+        expect(wrapper.find('Button[data-automation="alignmentButton__button"]')).to.have.length(1);
         expect(focus.calledOnce).to.be.true;
         expect(focus.calledWith()).to.be.true;
         done();