Merge pull request #90 from open-craft/eugeny/feedback-icons-hide-on-click

Item feedback popups hide on click

mentoring/public/js/mentoring.js

@@ -15,26 +15,24 @@ function MentoringBlock(runtime, element) {
 
     $(document).on("click", function(event, ui) {
         var target = $(event.target);
-        var feedback_box = ".mentoring .feedback";
-        if (target.is(feedback_box)) {
-            return;
-        }
+        var question_feedback_selector = ".mentoring .feedback";
+        var item_feedback_parent_selector = '.choice';
+        var item_feedback_selector = ".choice .choice-tips";
 
-        if (target.parents(feedback_box).length>0) {
-            return;
+        function clickedInside(selector, parent_selector){
+            return target.is(selector) || target.parents(parent_selector).length>0;
         }
 
-        $(feedback_box).each(function(i, el) {
-            el = $(el);
-            if (el.is(":hidden")) {
-                return;
-            }
-            el.hide();
-            publish_event({
-                event_type:'xblock.mentoring.feedback.closed',
-                content: el.text()
+        if (!clickedInside(question_feedback_selector, question_feedback_selector)) {
+            $(question_feedback_selector).not(':hidden').each(function (i, el) {
+                $(el).hide();
+                publish_event({event_type: 'xblock.mentoring.feedback.closed', content: $(el).text()});
             });
-        });
+        }
+
+        if (!clickedInside(item_feedback_selector, item_feedback_parent_selector)) {
+            $(item_feedback_selector).not(':hidden').hide();
+        }
     });
 
     function callIfExists(obj, fn) {

tests/integration/test_mcq.py

@@ -154,3 +154,32 @@ class MCQBlockTest(MentoringBaseTest):
         self.assertEqual(mcq_choices_input[1].get_attribute('value'), 'beauty')
         self.assertEqual(mcq_choices_input[2].get_attribute('value'), 'gracefulness')
         self.assertEqual(mcq_choices_input[3].get_attribute('value'), 'bugs')
+
+    def test_mcq_feedback_popups(self):
+        mentoring = self.go_to_page('Mcq With Comments 1')
+        choices_list = mentoring.find_element_by_css_selector(".choices-list")
+
+        item_feedbacks = [
+            "This is something everyone has to like about this MRQ",
+            "This is something everyone has to like about beauty",
+            "This MRQ is indeed very graceful",
+            "Nah, there isn\\'t any!"
+        ]
+        submit = mentoring.find_element_by_css_selector('.submit input.input-main')
+
+        for index, expected_feedback in enumerate(item_feedbacks):
+            choice_wrapper = choices_list.find_elements_by_css_selector(".choice")[index]
+            choice_wrapper.find_element_by_css_selector(".choice-selector").click()  # clicking on actual radio button
+            submit.click()
+            item_feedback_icon = choice_wrapper.find_element_by_css_selector(".choice-result")
+            choice_wrapper.click()
+            item_feedback_icon.click()  # clicking on item feedback icon
+            item_feedback_popup = choice_wrapper.find_element_by_css_selector(".choice-tips")
+            self.assertTrue(item_feedback_popup.is_displayed())
+            self.assertEqual(item_feedback_popup.text, expected_feedback)
+
+            item_feedback_popup.click()
+            self.assertTrue(item_feedback_popup.is_displayed())
+
+            mentoring.click()
+            self.assertFalse(item_feedback_popup.is_displayed())