OC-1387 Show tooltip feedback if tips are present straightaway

problem_builder/mcq.py

@@ -51,6 +51,16 @@ class MCQBlock(SubmittingXBlockMixin, QuestionnaireAbstractBlock):
     CATEGORY = 'pb-mcq'
     STUDIO_LABEL = _(u"Multiple Choice Question")
 
+    message = String(
+        display_name=_("Message"),
+        help=_(
+            "General feedback provided when submitting. "
+            "(This is not shown if there is a more specific feedback tip for the choice selected by the learner.)"
+        ),
+        scope=Scope.content,
+        default=""
+    )
+
     student_choice = String(
         # {Last input submitted by the student
         default="",
@@ -64,7 +74,7 @@ class MCQBlock(SubmittingXBlockMixin, QuestionnaireAbstractBlock):
         list_values_provider=QuestionnaireAbstractBlock.choice_values_provider,
         list_style='set',  # Underered, unique items. Affects the UI editor.
     )
-    editable_fields = QuestionnaireAbstractBlock.editable_fields + ('correct_choices', )
+    editable_fields = QuestionnaireAbstractBlock.editable_fields + ('message', 'correct_choices', )
 
     def describe_choice_correctness(self, choice_value):
         if choice_value in self.correct_choices:

problem_builder/mrq.py

@@ -22,7 +22,7 @@
 
 import logging
 
-from xblock.fields import List, Scope, Boolean
+from xblock.fields import List, Scope, Boolean, String
 from xblock.validation import ValidationMessage
 from .questionnaire import QuestionnaireAbstractBlock
 from xblockutils.resources import ResourceLoader
@@ -71,6 +71,12 @@ class MRQBlock(QuestionnaireAbstractBlock):
         list_style='set',  # Underered, unique items. Affects the UI editor.
         default=[],
     )
+    message = String(
+        display_name=_("Message"),
+        help=_("General feedback provided when submitting"),
+        scope=Scope.content,
+        default=""
+    )
     hide_results = Boolean(display_name="Hide results", scope=Scope.content, default=False)
     editable_fields = (
         'question', 'required_choices', 'ignored_choices', 'message', 'display_name',

problem_builder/public/js/questionnaire.js

@@ -131,35 +131,27 @@ function MCQBlock(runtime, element) {
 
             display_message(result.message, messageView, options.checkmark);
 
-            var choiceInputs = $('.choice-selector input', element);
-            $.each(choiceInputs, function(index, choiceInput) {
-                var choiceInputDOM = $(choiceInput);
-                var choiceDOM = choiceInputDOM.closest('.choice');
-                var choiceResultDOM = $('.choice-result', choiceDOM);
-                var choiceTipsDOM = $('.choice-tips', choiceDOM);
-
-                if (choiceInputDOM.prop('checked')) {  // We're showing previous answers,
-                                                       // so go ahead and display results as well
-                    if (result.status === "correct" && choiceInputDOM.val() === result.submission) {
-                        choiceDOM.addClass('correct');
-                        choiceResultDOM.addClass('checkmark-correct icon-ok fa-check');
-                    }
-                    else if (choiceInputDOM.val() === result.submission || _.isNull(result.submission)) {
-                        choiceDOM.addClass('incorrect');
-                        choiceResultDOM.addClass('checkmark-incorrect icon-exclamation fa-exclamation');
-                    }
-
-                    if (result.tips && choiceInputDOM.val() === result.submission) {
-                        mentoring.setContent(choiceTipsDOM, result.tips);
-                    }
+            var choiceInputDOM = $('.choice-selector input[value="'+ result.submission +'"]');
+            var choiceDOM = choiceInputDOM.closest('.choice');
+            var choiceResultDOM = $('.choice-result', choiceDOM);
+            var choiceTipsDOM = $('.choice-tips', choiceDOM);
+
+            // We're showing previous answers, so go ahead and display results as well
+            if (choiceInputDOM.prop('checked')) {
+                if (result.status === "correct") {
+                    choiceInputDOM.addClass('correct');
+                    choiceResultDOM.addClass('checkmark-correct icon-ok fa-check');
+                } else {
+                    choiceDOM.addClass('incorrect');
+                    choiceResultDOM.addClass('checkmark-incorrect icon-exclamation fa-exclamation');
+                }
 
-                    choiceResultDOM.off('click').on('click', function() {
-                        if (choiceTipsDOM.html() !== '') {
-                            messageView.showMessage(choiceTipsDOM);
-                        }
-                    });
+                if (result.tips) {
+                    mentoring.setContent(choiceTipsDOM, result.tips);
+                    messageView.showMessage(choiceTipsDOM);
                 }
-            });
+            }
+
 
             if (_.isNull(result.submission)) {
                 messageView.showMessage('<div class="message-content">You have not provided an answer.</div>' +

problem_builder/questionnaire.py

@@ -68,13 +68,8 @@ class QuestionnaireAbstractBlock(
         default="",
         multiline_editor=True,
     )
-    message = String(
-        display_name=_("Message"),
-        help=_("General feedback provided when submiting"),
-        scope=Scope.content,
-        default=""
-    )
-    editable_fields = ('question', 'message', 'weight', 'display_name', 'show_title')
+
+    editable_fields = ('question', 'weight', 'display_name', 'show_title')
     has_children = True
     answerable = True
 

problem_builder/tests/integration/test_questionnaire.py

@@ -75,9 +75,6 @@ class QuestionnaireBlockTest(MentoringBaseTest):
         self.assertEqual(mcq1.find_element_by_css_selector('legend').text, 'Question 1\nDo you like this MCQ?')
         self.assertEqual(mcq2.find_element_by_css_selector('legend').text, 'Question 2\nHow do you rate this MCQ?')
 
-        mcq1_feedback = mcq1.find_element_by_css_selector('.feedback')
-        mcq2_feedback = mcq2.find_element_by_css_selector('.feedback')
-
         mcq1_choices = mcq1.find_elements_by_css_selector('.choices .choice')
         mcq2_choices = mcq2.find_elements_by_css_selector('.rating .choice')
 
@@ -103,7 +100,10 @@ class QuestionnaireBlockTest(MentoringBaseTest):
             ['1', '2', '3', '4', '5', 'notwant']
         )
 
-        def submit_answer_and_assert_messages(mcq1_answer, mcq2_answer, item_feedback1, item_feedback2):
+        def submit_answer_and_assert_messages(
+                mcq1_answer, mcq2_answer, item_feedback1, item_feedback2,
+                feedback1_selector=".choice-tips .tip p",
+                feedback2_selector=".choice-tips .tip p"):
             self._selenium_bug_workaround_scroll_to(mcq1)
 
             mcq1_choices_input[mcq1_answer].click()
@@ -112,22 +112,14 @@ class QuestionnaireBlockTest(MentoringBaseTest):
             submit.click()
             self.wait_until_disabled(submit)
 
-            mcq1_tips = mcq1.find_element_by_css_selector(".choice-tips .tip p")
-            mcq2_tips = mcq2.find_element_by_css_selector(".choice-tips .tip p")
+            mcq1_feedback = mcq1.find_element_by_css_selector(feedback1_selector)
+            mcq2_feedback = mcq2.find_element_by_css_selector(feedback2_selector)
 
+            self.assertEqual(mcq1_feedback.text, item_feedback1)
             self.assertTrue(mcq1_feedback.is_displayed())
-            self.assertEqual(mcq1_feedback.text, "Feedback message 1")
-            self.assertTrue(mcq2_feedback.is_displayed())
-            self.assertEqual(mcq2_feedback.text, "Feedback message 2")
-            self.assertFalse(mcq1_tips.is_displayed())
-            self.assertFalse(mcq2_tips.is_displayed())
 
-            self._click_result_icon(mcq1_choices[mcq1_answer])
-            self.assertEqual(mcq1_tips.text, item_feedback1)
-            self.assertTrue(mcq1_tips.is_displayed())
-            self._click_result_icon(mcq2_choices[mcq2_answer])
-            self.assertEqual(mcq2_tips.text, item_feedback2)
-            self.assertTrue(mcq2_tips.is_displayed())
+            self.assertEqual(mcq2_feedback.text, item_feedback2)
+            self.assertTrue(mcq2_feedback.is_displayed())
 
         # Submit button disabled without selecting anything
         self.assertFalse(submit.is_enabled())
@@ -142,6 +134,14 @@ class QuestionnaireBlockTest(MentoringBaseTest):
         self.assertEqual(messages.text, '')
         self.assertFalse(messages.is_displayed())
 
+        # When selected answers have no tips display generic feedback message
+        submit_answer_and_assert_messages(
+            1, 5, 'Feedback message 1', 'Feedback message 2',
+            ".feedback .message-content", ".feedback .message-content"
+        )
+        self.assertEqual(messages.text, '')
+        self.assertFalse(messages.is_displayed())
+
         # Should show full completion when the right answers are selected
         submit_answer_and_assert_messages(0, 3, 'Great!', 'I love good grades.')
         self.assertIn('All is good now...\nCongratulations!', messages.text)

problem_builder/tests/integration/test_titles.py

@@ -72,7 +72,7 @@ class StepTitlesTest(SeleniumXBlockTest):
     )
 
     mcq_template = """
-        <problem-builder mode="{{mode}}">
+        <problem-builder mode="{mode}">
             <pb-mcq name="mcq_1_1" question="Who was your favorite character?"
               correct_choices="[gaius,adama,starbuck,roslin,six,lee]"
               {display_name_attr} {show_title_attr}
@@ -88,7 +88,7 @@ class StepTitlesTest(SeleniumXBlockTest):
     """
 
     mrq_template = """
-        <problem-builder mode="{{mode}}">
+        <problem-builder mode="{mode}">
             <pb-mrq name="mrq_1_1" question="What makes a great MRQ?"
               ignored_choices="[1,2,3]"
               {display_name_attr} {show_title_attr}
@@ -101,7 +101,7 @@ class StepTitlesTest(SeleniumXBlockTest):
     """
 
     rating_template = """
-        <problem-builder mode="{{mode}}">
+        <problem-builder mode="{mode}">
             <pb-rating name="rating_1_1" question="How do you rate Battlestar Galactica?"
               correct_choices="[5,6]"
               {display_name_attr} {show_title_attr}
@@ -112,7 +112,7 @@ class StepTitlesTest(SeleniumXBlockTest):
     """
 
     long_answer_template = """
-        <problem-builder mode="{{mode}}">
+        <problem-builder mode="{mode}">
             <pb-answer name="answer_1_1" question="What did you think of the ending?"
               {display_name_attr} {show_title_attr} />
         </problem-builder>

problem_builder/tests/integration/xml/mcq_1.xml

@@ -6,7 +6,6 @@
             <pb-choice value="understand">I don't understand</pb-choice>
 
             <pb-tip values='["yes"]'>Great!</pb-tip>
-            <pb-tip values='["maybenot"]'>Ah, damn.</pb-tip>
             <pb-tip values='["understand"]'><div id="test-custom-html">Really?</div></pb-tip>
         </pb-mcq>
 
@@ -17,7 +16,6 @@
 
             <pb-tip values='["4","5"]'>I love good grades.</pb-tip>
             <pb-tip values='["1","2","3"]'>Will do better next time...</pb-tip>
-            <pb-tip values='["notwant"]'>Your loss!</pb-tip>
         </pb-rating>
 
         <pb-message type="completed">