From 497619614813b6e9e97e9c7cc298b3a99da2ab73 Mon Sep 17 00:00:00 2001 From: briri Date: Tue, 21 Sep 2021 09:38:53 -0700 Subject: [PATCH 1/2] fixes an issue where the tinymce editor is not linking to the correct label --- app/javascript/src/utils/tinymce.js.erb | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/app/javascript/src/utils/tinymce.js.erb b/app/javascript/src/utils/tinymce.js.erb index 17c32d225c..4e24e00138 100644 --- a/app/javascript/src/utils/tinymce.js.erb +++ b/app/javascript/src/utils/tinymce.js.erb @@ -69,8 +69,11 @@ const resizeEditors = (editors) => { */ const attachLabelToIframe = (tinymceContext) => { const iframe = $(tinymceContext).siblings('.mce-container').find('iframe'); - if (isObject(iframe)) { - const lbl = iframe.closest('form').find('label'); + const hiddenField = $(hiddenFieldSelector); + + if (isObject(iframe) && isObject(hiddenField)) { + const id = hiddenField.attr('id'); + const lbl = iframe.closest('form').find(`label[for="${id}"]`); if (isObject(lbl)) { // Connect the label to the iframe lbl.attr('for', iframe.attr('id')); @@ -93,7 +96,7 @@ export const Tinymce = { // Connect the label to the Tinymce iframe $(options.selector).each((idx, el) => { - attachLabelToIframe(el); + attachLabelToIframe(el, options.selector); }); }, /* From ac25985b9b502e19b5bfabd22d6e53adb44eb031 Mon Sep 17 00:00:00 2001 From: briri Date: Tue, 21 Sep 2021 09:44:17 -0700 Subject: [PATCH 2/2] fixed typo in js changes --- app/javascript/src/utils/tinymce.js.erb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/javascript/src/utils/tinymce.js.erb b/app/javascript/src/utils/tinymce.js.erb index 4e24e00138..ce1ba13742 100644 --- a/app/javascript/src/utils/tinymce.js.erb +++ b/app/javascript/src/utils/tinymce.js.erb @@ -67,7 +67,7 @@ const resizeEditors = (editors) => { behind the scenes) to the Tinymce iframe so that screen readers read the correct label when the tinymce iframe receives focus. */ -const attachLabelToIframe = (tinymceContext) => { +const attachLabelToIframe = (tinymceContext, hiddenFieldSelector) => { const iframe = $(tinymceContext).siblings('.mce-container').find('iframe'); const hiddenField = $(hiddenFieldSelector);