Re-render post/hide menu on updating submission

Make sure we re-render the "post/hide grades" menu in SpeedGrader when a
submission is graded so the post/hide options are enabled according to
the current state of the submissions (as opposed to their state on
loading the page).

fixes GRADE-2396

Test plan:

Note that this does *not* work for comments at present (even when they
should cause a submission to post) because we specifically only check
for graded submissions when deciding whether a submission is postable.

- Have a course with New Gradebook and Post Policies enabled
- Create an auto-post assignment and open SpeedGrader
  - Observe that the "Hide Grades" option in the eye menu is disabled
  - Issue some grades
  - The "Hide Grades" option should now be enabled and should work as
    expected
- Create a manual-post assignment and open SpeedGrader
  - Observe that the "Post Grades" option in the eye menu is disabled
  - Issue some grades
  - The "Post Grades" option should now be enabled and should work as
    expected

- Have a course with OLD Gradebook
  - Smoke test giving some grades in SpeedGrader
  - Nothing should be affected

Change-Id: I29cd99b32212518d08ede9f160204d6bcae8cd9e
Reviewed-on: https://gerrit.instructure.com/207083
Tested-by: Jenkins
Reviewed-by: Jeremy Neander <jneander@instructure.com>
Reviewed-by: Gary Mei <gmei@instructure.com>
QA-Review: Gary Mei <gmei@instructure.com>
Product-Review: Keith Garner <kgarner@instructure.com>

public/javascripts/speed_grader.js

@@ -509,7 +509,6 @@ function setupPostPolicies() {
     sections: jsonData.context.active_course_sections,
     updateSubmission: EG.setOrUpdateSubmission,
     afterUpdateSubmission() {
-      renderPostGradesMenu()
       EG.showGrade()
     }
   })
@@ -2999,6 +2998,10 @@ EG = {
       }
     }
 
+    if (ENV.post_policies_enabled) {
+      renderPostGradesMenu()
+    }
+
     return student
   },
 

spec/javascripts/jsx/speed_graderSpec.js

@@ -2715,16 +2715,16 @@ QUnit.module('SpeedGrader', function(suiteHooks) { /* eslint-disable-line qunit/
         strictEqual(setOrUpdateSubmission.callCount, 1)
       })
 
-      test('afterUpdateSubmissions calls showGrade', () => {
-        strictEqual(showGrade.callCount, 1)
-      })
-
-      test('afterUpdateSubmissions calls renders SpeedGraderPostGradesMenu', () => {
+      test('updateSubmissions re-renders SpeedGraderPostGradesMenu', () => {
         const callCount = render.getCalls().filter(call =>
           call.args[0].type.name === 'SpeedGraderPostGradesMenu'
         ).length
         strictEqual(callCount, 1)
       })
+
+      test('afterUpdateSubmissions calls showGrade', () => {
+        strictEqual(showGrade.callCount, 1)
+      })
     })
 
     test('populates the settings mount point', () => {
@@ -4202,6 +4202,10 @@ QUnit.module('SpeedGrader', function(suiteHooks) { /* eslint-disable-line qunit/
     })
 
     QUnit.module('#setOrUpdateSubmission', hooks => {
+      function getPostOrHideGradesButton() {
+        return document.querySelector('#speed_grader_post_grades_menu_mount_point button[title="Post or Hide Grades"]')
+      }
+
       hooks.beforeEach(() => {
         fakeENV.setup({
           ...ENV,
@@ -4229,6 +4233,44 @@ QUnit.module('SpeedGrader', function(suiteHooks) { /* eslint-disable-line qunit/
         const {submission} = SpeedGrader.EG.setOrUpdateSubmission(alphaSubmission)
         deepEqual(submission, alphaSubmission)
       })
+
+      QUnit.module('when ENV.post_policies_enabled is true', postPolicyHooks => {
+        function getPostGradesMenuItem() {
+          getPostOrHideGradesButton().click()
+
+          const $trigger = getPostOrHideGradesButton()
+          const $menuContent = document.querySelector(`[aria-labelledby="${$trigger.id}"]`)
+          return $menuContent.querySelector('[role="menuitem"][name="postGrades"]')
+        }
+
+        postPolicyHooks.beforeEach(() => {
+          ENV.post_policies_enabled = true
+        })
+
+        postPolicyHooks.afterEach(() => {
+          delete ENV.post_policies_enabled
+        })
+
+        test('renders the post/hide grades menu if the updated submission matches an existing one', () => {
+          SpeedGrader.EG.setOrUpdateSubmission({anonymous_id: alphaStudent.anonymous_id, posted_at: new Date().toISOString()})
+          strictEqual(getPostGradesMenuItem().textContent, 'All Grades Posted')
+        })
+
+        test('updates the menu items based on the state of loaded submissions', () => {
+          SpeedGrader.EG.setOrUpdateSubmission({anonymous_id: alphaStudent.anonymous_id, posted_at: null})
+          strictEqual(getPostGradesMenuItem().textContent, 'Post Grades')
+        })
+
+        test('does not render the post/hide grades menu if the updated submission does not find a match', () => {
+          SpeedGrader.EG.setOrUpdateSubmission({anonymous_id: 'aahhh', posted_at: new Date().toISOString()})
+          notOk(getPostOrHideGradesButton())
+        })
+      })
+
+      test('does not attempt to render a hypothetical post/hide grades menu if post policies is not enabled', () => {
+        SpeedGrader.EG.setOrUpdateSubmission({user_id: alphaStudent.id, posted_at: new Date().toISOString()})
+        notOk(getPostOrHideGradesButton())
+      })
     })
 
     QUnit.module('#renderAttachment', hooks => {