From 5e24671f3e08f742ceee69c466617be83d4f68d8 Mon Sep 17 00:00:00 2001
From: danghieu1407 <danghieu140701@gmail.com>
Date: Fri, 4 Oct 2024 14:45:23 +0700
Subject: [PATCH] Studentquiz: TinyMCE Implementation of customized Button Set
 for StudentQuiz Activity #826354

---
 styles.css                              | 31 +++++++++++++++++++++++++
 tests/behat/comment_area_create.feature |  4 ++++
 2 files changed, 35 insertions(+)

diff --git a/styles.css b/styles.css
index 6e4e4b56..fb22b20c 100644
--- a/styles.css
+++ b/styles.css
@@ -858,3 +858,34 @@
 body.cm-type-studentquiz.path-question-type #fitem_id_status {
     display: none;
 }
+
+/* Hide all the toolbars and buttons by default.
+    The child represents the following:
+    1: Edit in menubar
+    2: View in menubar
+    3: Insert in menubar
+    6: Table in menubar
+    7: Help in menubar
+*/
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role="menubar"] button:nth-child(1),
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role="menubar"] button:nth-child(2),
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role="menubar"] button:nth-child(3),
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role="menubar"] button:nth-child(6),
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role="menubar"] button:nth-child(7),
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'] button {
+    display: none;
+}
+
+/* Show only the custom toolbar and button. */
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'] button[aria-label="Bold"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'] button[aria-label="Italic"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'] button[aria-label="Link"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'] button[aria-label="Unlink"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'] button[aria-label="Bullet list"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[role='toolbar'] button[aria-label="Numbered list"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[title="formatting"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[title="content"],
+.path-mod-studentquiz .studentquiz-comment-container .tox-tinymce div[title="lists"] {
+    display: flex;
+}
diff --git a/tests/behat/comment_area_create.feature b/tests/behat/comment_area_create.feature
index 0ae5828c..bd6f8a1f 100644
--- a/tests/behat/comment_area_create.feature
+++ b/tests/behat/comment_area_create.feature
@@ -46,6 +46,10 @@ Feature: Create comment as an user
     And I press "Check"
     # Wait for comment area init.
     And I wait until the page is ready
+    # Check the custom toolbar and menubar.
+    And I should see "Format"
+    And I should see "Tools"
+    And "button[aria-label='Undo']" "css_element" should not be visible
     # Enter "Comment 1".
     And I set the field "Add public comment" to "Comment 1"
     And I press "Add comment"