add enter grades as to assignment column options menu

closes GRADE-49

test plan:
 1. Select or create a course with New Gradebook enabled.
 2. Ensure an assignment exists for each grading type:
    a. Points
    b. Percentage
    c. Complete/Incomplete
    d. Letter Grade
    e. GPA Scale
    f. Not Graded
 3. Visit Gradebook.
 4. Confirm that the "Points" assignment:
    a. has the "Enter Grades as" menu
    b. has the "Points" and "Percentage" options
    c. defaults to the "Points" option
 5. Confirm that the "Percentage" assignment:
    a. has the "Enter Grades as" menu
    b. has the "Points" and "Percentage" options
    c. defaults to the "Percentage" option
 6. Confirm that the "Letter Grade" assignment:
    a. has the "Enter Grades as" menu
    b. has the "Points" "Percentage" and "Grading Scheme" options
    c. defaults to the "Grading Scheme" option
 7. Confirm that the "GPA Scale" assignment:
    a. has the "Enter Grades as" menu
    b. has the "Points" "Percentage" and "Grading Scheme" options
    c. defaults to the "Grading Scheme" option
 8. Confirm that the "Complete/Incomplete" assignment does not
    have the "Enter Grades as" menu.
 9. Confirm that changing the setting for any assignment persists
    through a page refresh.

Change-Id: Iac3274254e6a350b2889e2c7c56b9fe29a9add71
Reviewed-on: https://gerrit.instructure.com/123350
Reviewed-by: Spencer Olson <solson@instructure.com>
Tested-by: Jenkins
QA-Review: Indira Pai <ipai@instructure.com>
Product-Review: Matt Goodwin <mattg@instructure.com>

app/coffeescripts/gradezilla/Gradebook.coffee

@@ -46,6 +46,7 @@ define [
   'compiled/util/natcompare'
   'convert_case'
   'str/htmlEscape'
+  'jsx/gradezilla/shared/EnterGradesAsSetting'
   'jsx/gradezilla/shared/SetDefaultGradeDialogManager'
   'jsx/gradezilla/default_gradebook/CurveGradesDialogManager'
   'jsx/gradezilla/default_gradebook/apis/GradebookApi'
@@ -98,7 +99,7 @@ define [
   GradingPeriodsApi, GradingPeriodSetsApi, InputFilterView, i18nObj, I18n, GRADEBOOK_TRANSLATIONS,
   CourseGradeCalculator, EffectiveDueDates, GradeFormatHelper, UserSettings, Spinner, AssignmentMuter,
   GradeDisplayWarningDialog, PostGradesFrameDialog,
-  NumberCompare, natcompare, ConvertCase, htmlEscape, SetDefaultGradeDialogManager,
+  NumberCompare, natcompare, ConvertCase, htmlEscape, EnterGradesAsSetting, SetDefaultGradeDialogManager,
   CurveGradesDialogManager, GradebookApi, CellEditorFactory, CellFormatterFactory, ColumnHeaderRenderer, GridSupport,
   studentRowHeaderConstants, AssignmentRowCellPropFactory,
   GradebookMenu, ViewOptionsMenu, ActionMenu, AssignmentGroupFilter, GradingPeriodFilter, ModuleFilter, SectionFilter,
@@ -167,6 +168,7 @@ define [
 
     {
       colors
+      enterGradesAs: settings.enter_grades_as || {}
       filterColumnsBy
       filterRowsBy
       selectedPrimaryInfo
@@ -1770,6 +1772,7 @@ define [
       selectedViewOptionsFilters.push('') unless selectedViewOptionsFilters.length > 0
       data =
         gradebook_settings:
+          enter_grades_as: @gridDisplaySettings.enterGradesAs
           filter_columns_by: ConvertCase.underscore(@gridDisplaySettings.filterColumnsBy)
           selected_view_options_filters: selectedViewOptionsFilters
           show_concluded_enrollments: showConcludedEnrollments
@@ -2375,6 +2378,25 @@ define [
         selectedFilters.push filter if filters[filter]
       selectedFilters
 
+    setEnterGradesAsSetting: (assignmentId, setting) =>
+      @gridDisplaySettings.enterGradesAs[assignmentId] = setting
+
+    getEnterGradesAsSetting: (assignmentId) =>
+      gradingType = @getAssignment(assignmentId).grading_type
+      options = EnterGradesAsSetting.optionsForGradingType(gradingType)
+      return null unless options.length
+
+      setting = @gridDisplaySettings.enterGradesAs[assignmentId]
+      return setting if options.includes(setting)
+
+      EnterGradesAsSetting.defaultOptionForGradingType(gradingType)
+
+    updateEnterGradesAsSetting: (assignmentId, value) =>
+      @setEnterGradesAsSetting(assignmentId, value)
+      @saveSettings({}, =>
+        @gridSupport.columns.updateColumnHeaders([@getAssignmentColumnId(assignmentId)])
+      )
+
     ## Gradebook Content Access Methods
 
     setSections: (sections) =>

app/controllers/gradebook_settings_controller.rb

@@ -36,7 +36,7 @@ class GradebookSettingsController < ApplicationController
   private
 
   def gradebook_settings_params
-    params.require(:gradebook_settings).permit(
+    gradebook_settings_params = params.require(:gradebook_settings).permit(
       {
         filter_columns_by: [
           :context_module_id,
@@ -48,6 +48,7 @@ class GradebookSettingsController < ApplicationController
         ],
         selected_view_options_filters: []
       },
+      :enter_grades_as,
       :show_concluded_enrollments,
       :show_inactive_enrollments,
       :show_unpublished_assignments,
@@ -58,6 +59,8 @@ class GradebookSettingsController < ApplicationController
       :sort_rows_by_direction,
       { colors: [ :late, :missing, :resubmitted, :dropped, :excused ] }
     )
+    gradebook_settings_params[:enter_grades_as] = params[:gradebook_settings][:enter_grades_as]
+    gradebook_settings_params.permit!
   end
 
   def nilify_strings(hash)

app/jsx/gradezilla/default_gradebook/components/AssignmentColumnHeader.js

@@ -116,6 +116,7 @@ class AssignmentColumnHeader extends ColumnHeader {
   }
 
   bindAssignmentLink = (ref) => { this.assignmentLink = ref };
+  bindEnterGradesAsMenuContent = (ref) => { this.enterGradesAsMenuContent = ref };
 
   curveGrades = () => { this.invokeAndSkipFocus(this.props.curveGradesAction) };
   setDefaultGrades = () => { this.invokeAndSkipFocus(this.props.setDefaultGradeAction) };
@@ -148,6 +149,10 @@ class AssignmentColumnHeader extends ColumnHeader {
     return ColumnHeader.prototype.handleKeyDown.call(this, event);
   };
 
+  onEnterGradesAsSettingSelect = (_event, values) => {
+    this.props.enterGradesAsSetting.onSelect(values[0]);
+  }
+
   showMessageStudentsWhoDialog = () => {
     this.setState({ skipFocusOnClose: true });
     const settings = MessageStudentsWhoHelper.settings(this.props.assignment, this.activeStudentDetails());
@@ -309,6 +314,36 @@ class AssignmentColumnHeader extends ColumnHeader {
           </span>
         </MenuItem>
 
+        { !this.props.enterGradesAsSetting.hidden && <MenuItemSeparator /> }
+
+        {
+          !this.props.enterGradesAsSetting.hidden && (
+            <MenuItemFlyout contentRef={this.bindEnterGradesAsMenuContent} label={I18n.t('Enter Grades as')}>
+              <MenuItemGroup
+                label={<ScreenReaderContent>{I18n.t('Enter Grades as')}</ScreenReaderContent>}
+                onSelect={this.onEnterGradesAsSettingSelect}
+                selected={[this.props.enterGradesAsSetting.selected]}
+              >
+                <MenuItem value="points">
+                  { I18n.t('Points') }
+                </MenuItem>
+
+                <MenuItem value="percent">
+                  { I18n.t('Percentage') }
+                </MenuItem>
+
+                {
+                  this.props.enterGradesAsSetting.showGradingSchemeOption && (
+                    <MenuItem value="gradingScheme">
+                      { I18n.t('Grading Scheme') }
+                    </MenuItem>
+                  )
+                }
+              </MenuItemGroup>
+            </MenuItemFlyout>
+          )
+        }
+
         {
           !(
             this.props.downloadSubmissionsAction.hidden &&

app/jsx/gradezilla/default_gradebook/slick-grid/column-headers/AssignmentColumnHeaderRenderer.js

@@ -19,6 +19,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import AssignmentColumnHeader from 'jsx/gradezilla/default_gradebook/components/AssignmentColumnHeader';
+import { optionsForGradingType } from 'jsx/gradezilla/shared/EnterGradesAsSetting';
 
 function getProps (column, gradebook, options) {
   const assignmentId = column.assignmentId;
@@ -73,6 +74,16 @@ function getProps (column, gradebook, options) {
 
     curveGradesAction: gradebook.getCurveGradesAction(assignmentId),
     downloadSubmissionsAction: gradebook.getDownloadSubmissionsAction(assignmentId),
+
+    enterGradesAsSetting: {
+      hidden: optionsForGradingType(assignment.grading_type).length < 2, // show only multiple options
+      onSelect (value) {
+        gradebook.updateEnterGradesAsSetting(assignmentId, value);
+      },
+      selected: gradebook.getEnterGradesAsSetting(assignmentId),
+      showGradingSchemeOption: optionsForGradingType(assignment.grading_type).includes('gradingScheme')
+    },
+
     muteAssignmentAction: gradebook.getMuteAssignmentAction(assignmentId),
     onHeaderKeyDown: (event) => {
       gradebook.handleHeaderKeyDown(event, columnId);

app/jsx/gradezilla/shared/EnterGradesAsSetting.js

@@ -0,0 +1,41 @@
+/*
+ * Copyright (C) 2017 - present Instructure, Inc.
+ *
+ * This file is part of Canvas.
+ *
+ * Canvas is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU Affero General Public License as published by the Free
+ * Software Foundation, version 3 of the License.
+ *
+ * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
+ * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU Affero General Public License along
+ * with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+const gradingTypeOptionMap = {
+  gpa_scale: ['points', 'percent', 'gradingScheme'],
+  letter_grade: ['points', 'percent', 'gradingScheme'],
+  pass_fail: ['passFail'],
+  percent: ['points', 'percent'],
+  points: ['points', 'percent']
+};
+
+const gradingTypeDefaultOptionMap = {
+  gpa_scale: 'gradingScheme',
+  letter_grade: 'gradingScheme',
+  pass_fail: 'passFail',
+  percent: 'percent',
+  points: 'points'
+};
+
+export function defaultOptionForGradingType (gradingType) {
+  return gradingTypeDefaultOptionMap[gradingType] || null;
+}
+
+export function optionsForGradingType (gradingType) {
+  return gradingTypeOptionMap[gradingType] || [];
+}

spec/controllers/gradebook_settings_controller_spec.rb

@@ -35,6 +35,9 @@ RSpec.describe GradebookSettingsController, type: :controller do
     context "given valid params" do
       let(:show_settings) do
         {
+          "enter_grades_as" => {
+            "2301" => "points"
+          },
           "filter_columns_by" => {
             "grading_period_id" => "1401",
             "assignment_group_id" => "888"

spec/javascripts/jsx/gradezilla/GradebookSpec.js

@@ -4781,6 +4781,106 @@ test('reloads student data after saving settings', function () {
   strictEqual(this.gradebook.reloadStudentData.callCount, 1);
 });
 
+QUnit.module('Gradebook "Enter Grades as" Setting', function (suiteHooks) {
+  let gradebook;
+
+  suiteHooks.beforeEach(function () {
+    gradebook = createGradebook();
+    gradebook.setAssignments({
+      2301: { id: '2301', grading_type: 'points', name: 'Math Assignment', published: true },
+      2302: { id: '2302', grading_type: 'points', name: 'English Assignment', published: false }
+    });
+  });
+
+  QUnit.module('#getEnterGradesAsSetting', function () {
+    test('returns the setting when stored', function () {
+      gradebook.setEnterGradesAsSetting('2301', 'percent');
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'percent');
+    });
+
+    test('defaults to "points" for a "points" assignment', function () {
+      gradebook.getAssignment('2301').grading_type = 'points';
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'points');
+    });
+
+    test('defaults to "percent" for a "percent" assignment', function () {
+      gradebook.getAssignment('2301').grading_type = 'percent';
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'percent');
+    });
+
+    test('defaults to "passFail" for a "pass_fail" assignment', function () {
+      gradebook.getAssignment('2301').grading_type = 'pass_fail';
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'passFail');
+    });
+
+    test('defaults to "gradingScheme" for a "letter_grade" assignment', function () {
+      gradebook.getAssignment('2301').grading_type = 'letter_grade';
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'gradingScheme');
+    });
+
+    test('defaults to "gradingScheme" for a "gpa_scale" assignment', function () {
+      gradebook.getAssignment('2301').grading_type = 'gpa_scale';
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'gradingScheme');
+    });
+
+    test('defaults to null for a "not_graded" assignment', function () {
+      gradebook.getAssignment('2301').grading_type = 'not_graded';
+      strictEqual(gradebook.getEnterGradesAsSetting('2301'), null);
+    });
+
+    test('defaults to null for a "not_graded" assignment previously set as "points"', function () {
+      gradebook.updateEnterGradesAsSetting('2301', 'points');
+      gradebook.getAssignment('2301').grading_type = 'not_graded';
+      strictEqual(gradebook.getEnterGradesAsSetting('2301'), null);
+    });
+
+    test('defaults to null for a "not_graded" assignment previously set as "percent"', function () {
+      gradebook.updateEnterGradesAsSetting('2301', 'percent');
+      gradebook.getAssignment('2301').grading_type = 'not_graded';
+      strictEqual(gradebook.getEnterGradesAsSetting('2301'), null);
+    });
+
+    test('defaults to "points" for a "points" assignment previously set as "gradingScheme"', function () {
+      gradebook.updateEnterGradesAsSetting('2301', 'gradingScheme');
+      gradebook.getAssignment('2301').grading_type = 'points';
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'points');
+    });
+
+    test('defaults to "percent" for a "percent" assignment previously set as "gradingScheme"', function () {
+      gradebook.updateEnterGradesAsSetting('2301', 'gradingScheme');
+      gradebook.getAssignment('2301').grading_type = 'percent';
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'percent');
+    });
+  });
+
+  QUnit.module('#updateEnterGradesAsSetting', function (hooks) {
+    hooks.beforeEach(function () {
+      sinon.stub(gradebook, 'saveSettings');
+    });
+
+    hooks.afterEach(function () {
+      gradebook.saveSettings.restore();
+    });
+
+    test('updates the setting in Gradebook', function () {
+      gradebook.updateEnterGradesAsSetting('2301', 'percent');
+      equal(gradebook.getEnterGradesAsSetting('2301'), 'percent');
+    });
+
+    test('saves gradebooks settings', function () {
+      gradebook.updateEnterGradesAsSetting('2301', 'percent');
+      strictEqual(gradebook.saveSettings.callCount, 1);
+    });
+
+    test('saves gradebooks settings after updating the "enter grades as" setting', function () {
+      gradebook.saveSettings.callsFake(() => {
+        equal(gradebook.getEnterGradesAsSetting('2301'), 'percent');
+      });
+      gradebook.updateEnterGradesAsSetting('2301', 'percent');
+    });
+  });
+});
+
 QUnit.module('Gradebook#saveSettings', {
   setup () {
     this.server = sinon.fakeServer.create({ respondImmediately: true });
@@ -4816,6 +4916,7 @@ test('calls ajaxJSON with default gradebook_settings', function () {
       missing: '#FFE8E5',
       resubmitted: '#E5F7E5'
     },
+    enter_grades_as: {},
     filter_columns_by: {
       assignment_group_id: null,
       context_module_id: null,
@@ -4914,6 +5015,7 @@ test('calls ajaxJSON with parameters', function () {
         missing: '#FFE8E5',
         resubmitted: '#E5F7E5'
       },
+      enter_grades_as: {},
       filter_columns_by: {
         assignment_group_id: '2201',
         context_module_id: '2601',

spec/javascripts/jsx/gradezilla/default_gradebook/components/AssignmentColumnHeaderSpec.js

@@ -88,6 +88,12 @@ function defaultProps ({ props, sortBySetting, assignment, curveGradesAction } =
       hidden: false,
       onSelect () {}
     },
+    enterGradesAsSetting: {
+      hidden: false,
+      onSelect () {},
+      selected: 'points',
+      showGradingSchemeOption: true
+    },
     muteAssignmentAction: {
       disabled: false,
       onSelect () {}
@@ -220,6 +226,112 @@ test('renders a title for the More icon based on the assignment name', function
   equal(optionsMenuTrigger.props().title, 'Assignment #1 Options');
 });
 
+QUnit.module('AssignmentColumnHeader: "Enter Grades as" Settings', function (hooks) {
+  let props;
+  let wrapper;
+
+  function getMenuItem (text) {
+    const content = new ReactWrapper(wrapper.node.enterGradesAsMenuContent, wrapper.node);
+    return content.findWhere(component => component.name() === 'MenuItem' && component.text() === text);
+  }
+
+  function getMenuItemFlyout (text) {
+    const content = new ReactWrapper(wrapper.node.optionsMenuContent, wrapper.node);
+    return content.findWhere(component => component.name() === 'MenuItemFlyout' && component.text().trim() === text);
+  }
+
+  function mountAndOpenMenu () {
+    wrapper = mountAndOpenOptions(props);
+    getMenuItemFlyout('Enter Grades as').find('button').simulate('mouseOver');
+  }
+
+  hooks.beforeEach(function () {
+    props = defaultProps();
+  });
+
+  hooks.afterEach(function () {
+    wrapper.unmount();
+  });
+
+  test('renders when "hidden" is false', function () {
+    wrapper = mountAndOpenOptions(props);
+    strictEqual(getMenuItemFlyout('Enter Grades as').length, 1);
+  });
+
+  test('does not render when "hidden" is true', function () {
+    props.enterGradesAsSetting.hidden = true;
+    wrapper = mountAndOpenOptions(props);
+    strictEqual(getMenuItemFlyout('Enter Grades as').length, 0);
+  });
+
+  test('includes the "Points" option', function () {
+    mountAndOpenMenu();
+    strictEqual(getMenuItem('Points').length, 1);
+  });
+
+  test('includes the "Percentage" option', function () {
+    mountAndOpenMenu();
+    strictEqual(getMenuItem('Percentage').length, 1);
+  });
+
+  test('includes the "Grading Scheme" option when "showGradingSchemeOption" is true', function () {
+    props.enterGradesAsSetting.showGradingSchemeOption = true;
+    mountAndOpenMenu();
+    strictEqual(getMenuItem('Grading Scheme').length, 1);
+  });
+
+  test('excludes the "Grading Scheme" option when "showGradingSchemeOption" is false', function () {
+    props.enterGradesAsSetting.showGradingSchemeOption = false;
+    mountAndOpenMenu();
+    strictEqual(getMenuItem('Grading Scheme').length, 0);
+  });
+
+  test('optionally renders the "Points" option as selected', function () {
+    props.enterGradesAsSetting.selected = 'points';
+    mountAndOpenMenu();
+    strictEqual(getMenuItem('Points').prop('selected'), true);
+  });
+
+  test('optionally renders the "Percentage" option as selected', function () {
+    props.enterGradesAsSetting.selected = 'percent';
+    mountAndOpenMenu();
+    strictEqual(getMenuItem('Percentage').prop('selected'), true);
+  });
+
+  test('optionally renders the "Grading Scheme" option as selected', function () {
+    props.enterGradesAsSetting.showGradingSchemeOption = true;
+    props.enterGradesAsSetting.selected = 'gradingScheme';
+    mountAndOpenMenu();
+    strictEqual(getMenuItem('Grading Scheme').prop('selected'), true);
+  });
+
+  test('calls the onSelect callback with "points" when "Points" is selected', function () {
+    let selected;
+    props.enterGradesAsSetting.selected = 'percent';
+    props.enterGradesAsSetting.onSelect = (value) => { selected = value };
+    mountAndOpenMenu();
+    getMenuItem('Points').simulate('click');
+    equal(selected, 'points');
+  });
+
+  test('calls the onSelect callback with "percent" when "Percentage" is selected', function () {
+    let selected;
+    props.enterGradesAsSetting.onSelect = (value) => { selected = value };
+    mountAndOpenMenu();
+    getMenuItem('Percentage').simulate('click');
+    equal(selected, 'percent');
+  });
+
+  test('calls the onSelect callback with "gradingScheme" when "Grading Scheme" is selected', function () {
+    let selected;
+    props.enterGradesAsSetting.showGradingSchemeOption = true;
+    props.enterGradesAsSetting.onSelect = (value) => { selected = value };
+    mountAndOpenMenu();
+    getMenuItem('Grading Scheme').simulate('click');
+    equal(selected, 'gradingScheme');
+  });
+});
+
 QUnit.module('AssignmentColumnHeader: Sort by Settings', {
   setup () {
     this.mountAndOpenOptions = mountAndOpenOptions;

spec/javascripts/jsx/gradezilla/default_gradebook/slick-grid/column-headers/AssignmentColumnHeaderRendererSpec.js

@@ -44,6 +44,7 @@ QUnit.module('AssignmentColumnHeaderRenderer', function (suiteHooks) {
       id: '2301',
       assignment_visibility: null,
       course_id: '1201',
+      grading_type: 'points',
       html_url: '/assignments/2301',
       muted: false,
       name: 'Math Assignment',
@@ -173,6 +174,95 @@ QUnit.module('AssignmentColumnHeaderRenderer', function (suiteHooks) {
       equal(component.props.downloadSubmissionsAction, gradebook.getDownloadSubmissionsAction.returnValues[0]);
     });
 
+    test('shows the "enter grades as" setting for a "points" assignment', function () {
+      assignment.grading_type = 'points';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.hidden, false);
+    });
+
+    test('shows the "enter grades as" setting for a "percent" assignment', function () {
+      assignment.grading_type = 'percent';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.hidden, false);
+    });
+
+    test('shows the "enter grades as" setting for a "letter grade" assignment', function () {
+      assignment.grading_type = 'letter_grade';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.hidden, false);
+    });
+
+    test('shows the "enter grades as" setting for a "GPA scale" assignment', function () {
+      assignment.grading_type = 'gpa_scale';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.hidden, false);
+    });
+
+    test('hides the "enter grades as" setting for a "pass/fail" assignment', function () {
+      assignment.grading_type = 'pass_fail';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.hidden, true);
+    });
+
+    test('hides the "enter grades as" setting for a "not graded" assignment', function () {
+      assignment.grading_type = 'not_graded';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.hidden, true);
+    });
+
+    test('includes a callback for changing the "enter grades as" setting', function () {
+      sinon.stub(gradebook, 'updateEnterGradesAsSetting');
+      render();
+      component.props.enterGradesAsSetting.onSelect('percent');
+      strictEqual(gradebook.updateEnterGradesAsSetting.callCount, 1);
+    });
+
+    test('includes the assignment id when changing the "enter grades as" setting', function () {
+      sinon.stub(gradebook, 'updateEnterGradesAsSetting');
+      render();
+      component.props.enterGradesAsSetting.onSelect('percent');
+      const assignmentId = gradebook.updateEnterGradesAsSetting.lastCall.args[0];
+      strictEqual(assignmentId, '2301');
+    });
+
+    test('includes the new setting when changing the "enter grades as" setting', function () {
+      sinon.stub(gradebook, 'updateEnterGradesAsSetting');
+      render();
+      component.props.enterGradesAsSetting.onSelect('percent');
+      const assignmentId = gradebook.updateEnterGradesAsSetting.lastCall.args[1];
+      equal(assignmentId, 'percent');
+    });
+
+    test('uses the current "enter grades as" setting for the assignment', function () {
+      gradebook.setEnterGradesAsSetting('2301', 'percent');
+      render();
+      equal(component.props.enterGradesAsSetting.selected, 'percent');
+    });
+
+    test('hides the "enter grades as" grading scheme option for a "points" assignment', function () {
+      assignment.grading_type = 'points';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.showGradingSchemeOption, false);
+    });
+
+    test('hides the "enter grades as" grading scheme option for a "percent" assignment', function () {
+      assignment.grading_type = 'percent';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.showGradingSchemeOption, false);
+    });
+
+    test('shows the "enter grades as" grading scheme option for a "letter grade" assignment', function () {
+      assignment.grading_type = 'letter_grade';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.showGradingSchemeOption, true);
+    });
+
+    test('shows the "enter grades as" grading scheme option for a "GPA scale" assignment', function () {
+      assignment.grading_type = 'gpa_scale';
+      render();
+      strictEqual(component.props.enterGradesAsSetting.showGradingSchemeOption, true);
+    });
+
     test('includes the mute assignment action', function () {
       sinon.spy(gradebook, 'getMuteAssignmentAction');
       render();

spec/javascripts/jsx/gradezilla/shared/EnterGradesAsSettingSpec.js

@@ -0,0 +1,97 @@
+/*
+ * Copyright (C) 2017 - present Instructure, Inc.
+ *
+ * This file is part of Canvas.
+ *
+ * Canvas is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU Affero General Public License as published by the Free
+ * Software Foundation, version 3 of the License.
+ *
+ * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
+ * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU Affero General Public License along
+ * with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import * as EnterGradesAsSetting from 'jsx/gradezilla/shared/EnterGradesAsSetting';
+
+QUnit.module('EnterGradesAsSetting', () => {
+  QUnit.module('.defaultOptionForGradingType', () => {
+    test('is "points" for the "points" grading type', () => {
+      equal(EnterGradesAsSetting.defaultOptionForGradingType('points'), 'points');
+    });
+
+    test('is "percent" for the "percent" grading type', () => {
+      equal(EnterGradesAsSetting.defaultOptionForGradingType('percent'), 'percent');
+    });
+
+    test('is "gradingScheme" for the "gpa_scale" grading type', () => {
+      equal(EnterGradesAsSetting.defaultOptionForGradingType('gpa_scale'), 'gradingScheme');
+    });
+
+    test('is "gradingScheme" for the "letter_grade" grading type', () => {
+      equal(EnterGradesAsSetting.defaultOptionForGradingType('letter_grade'), 'gradingScheme');
+    });
+
+    test('is "passFail" for the "pass_fail" grading type', () => {
+      equal(EnterGradesAsSetting.defaultOptionForGradingType('pass_fail'), 'passFail');
+    });
+
+    test('does not exist for the "not_graded" grading type', () => {
+      strictEqual(EnterGradesAsSetting.defaultOptionForGradingType('not_graded'), null);
+    });
+  });
+
+  QUnit.module('.optionsForGradingType', () => {
+    test('includes "points" for the "points" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('points').includes('points'));
+    });
+
+    test('includes "percent" for the "points" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('points').includes('percent'));
+    });
+
+    test('includes "points" for the "percent" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('percent').includes('points'));
+    });
+
+    test('includes "percent" for the "percent" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('percent').includes('percent'));
+    });
+
+    test('includes "points" for the "gpa_scale" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('gpa_scale').includes('points'));
+    });
+
+    test('includes "percent" for the "gpa_scale" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('gpa_scale').includes('percent'));
+    });
+
+    test('includes "gradingScheme" for the "gpa_scale" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('gpa_scale').includes('gradingScheme'));
+    });
+
+    test('includes "points" for the "letter_grade" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('letter_grade').includes('points'));
+    });
+
+    test('includes "percent" for the "letter_grade" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('letter_grade').includes('percent'));
+    });
+
+    test('includes "gradingScheme" for the "letter_grade" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('letter_grade').includes('gradingScheme'));
+    });
+
+    test('includes "passFail" for the "pass_fail" grading type', () => {
+      ok(EnterGradesAsSetting.optionsForGradingType('pass_fail').includes('passFail'));
+    });
+
+    test('do not exist for the "not_graded" grading type', () => {
+      deepEqual(EnterGradesAsSetting.optionsForGradingType('not_graded'), []);
+    });
+  });
+});

spec/selenium/grades/gradebook/gradebook_concluded_courses_and_enrollments_spec.rb

@@ -46,6 +46,7 @@ describe "gradebook - concluded courses and enrollments" do
         .to({
           "show_inactive_enrollments" => "true",
           "show_concluded_enrollments" => "false",
+          "enter_grades_as" => nil
         })
     end
 
@@ -61,6 +62,7 @@ describe "gradebook - concluded courses and enrollments" do
         .to({
           "show_inactive_enrollments" => "false",
           "show_concluded_enrollments" => "true",
+          "enter_grades_as" => nil
         })
     end