diff --git a/lib/form/amd/build/collapsesections.min.js b/lib/form/amd/build/collapsesections.min.js index ecd8ae941eb..03284a6a7a0 100644 --- a/lib/form/amd/build/collapsesections.min.js +++ b/lib/form/amd/build/collapsesections.min.js @@ -6,6 +6,6 @@ define("core_form/collapsesections",["exports","jquery","core/pending"],(functio * @copyright 2021 Bas Brands * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later * @since 4.0 - */Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0,_jquery=_interopRequireDefault(_jquery),_pending=_interopRequireDefault(_pending);const SELECTORS_FORM=".mform",SELECTORS_FORMHEADER=".fheader",SELECTORS_FORMCONTAINER="fieldset > .fcontainer",CLASSES_SHOW="show",CLASSES_COLLAPSED="collapsed",CLASSES_HIDDEN="d-none";_exports.init=collapsesections=>{const pendingPromise=new _pending.default("core_form/collapsesections"),collapsemenu=document.querySelector(collapsesections),formParent=collapsemenu.closest(SELECTORS_FORM),formContainers=formParent.querySelectorAll(SELECTORS_FORMCONTAINER);collapsemenu.addEventListener("keydown",(e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),collapsemenu.click())}));let formcontainercount=0,expandedcount=0;formContainers.forEach((container=>{container.parentElement.classList.contains(CLASSES_HIDDEN)||formcontainercount++,container.classList.contains(CLASSES_SHOW)&&expandedcount++})),formcontainercount===expandedcount&&(collapsemenu.classList.remove(CLASSES_COLLAPSED),collapsemenu.setAttribute("aria-expanded",!0)),collapsemenu.addEventListener("click",(()=>{let action="hide";collapsemenu.classList.contains(CLASSES_COLLAPSED)&&(action="show"),formContainers.forEach((container=>(0,_jquery.default)(container).collapse(action)))}));const collapseElementIds=[...formParent.querySelectorAll(SELECTORS_FORMHEADER)].map(((element,index)=>(element.id=element.id||"collapseElement-".concat(index),element.id)));collapsemenu.setAttribute("aria-controls",collapseElementIds.join(" ")),(0,_jquery.default)(SELECTORS_FORMCONTAINER).on("hidden.bs.collapse",(()=>{[...formContainers].every((container=>!container.classList.contains(CLASSES_SHOW)))&&(collapsemenu.classList.add(CLASSES_COLLAPSED),collapsemenu.setAttribute("aria-expanded",!1))})),(0,_jquery.default)(SELECTORS_FORMCONTAINER).on("shown.bs.collapse",(()=>{[...formContainers].every((container=>container.classList.contains(CLASSES_SHOW)))&&(collapsemenu.classList.remove(CLASSES_COLLAPSED),collapsemenu.setAttribute("aria-expanded",!0))})),pendingPromise.resolve()}})); + */Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0,_jquery=_interopRequireDefault(_jquery),_pending=_interopRequireDefault(_pending);const SELECTORS_FORM=".mform",SELECTORS_FORMHEADER=".fheader",SELECTORS_FORMCONTAINER="fieldset > .fcontainer",CLASSES_SHOW="show",CLASSES_COLLAPSED="collapsed",CLASSES_HIDDEN="d-none";_exports.init=collapsesections=>{const pendingPromise=new _pending.default("core_form/collapsesections"),collapsemenu=document.querySelector(collapsesections),formParent=collapsemenu.closest(SELECTORS_FORM),formContainers=formParent.querySelectorAll(SELECTORS_FORMCONTAINER);collapsemenu.addEventListener("keydown",(e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),collapsemenu.click())}));let formcontainercount=0,expandedcount=0;formContainers.forEach((container=>{container.parentElement.classList.contains(CLASSES_HIDDEN)||formcontainercount++,container.classList.contains(CLASSES_SHOW)&&expandedcount++})),formcontainercount===expandedcount&&(collapsemenu.classList.remove(CLASSES_COLLAPSED),collapsemenu.setAttribute("aria-expanded",!0)),collapsemenu.addEventListener("click",(()=>{let action="hide";if(collapsemenu.classList.contains(CLASSES_COLLAPSED)&&(action="show"),formContainers.length){const pendingPromiseToggle=new _pending.default("core_form/collapsesections:toggle-"+action);formContainers.forEach(((container,index,array)=>{(0,_jquery.default)(container).collapse(action),index===array.length-1&&pendingPromiseToggle.resolve()}))}}));const collapseElementIds=[...formParent.querySelectorAll(SELECTORS_FORMHEADER)].map(((element,index)=>(element.id=element.id||"collapseElement-".concat(index),element.id)));collapsemenu.setAttribute("aria-controls",collapseElementIds.join(" ")),(0,_jquery.default)(SELECTORS_FORMCONTAINER).on("hidden.bs.collapse",(()=>{[...formContainers].every((container=>!container.classList.contains(CLASSES_SHOW)))&&(collapsemenu.classList.add(CLASSES_COLLAPSED),collapsemenu.setAttribute("aria-expanded",!1))})),(0,_jquery.default)(SELECTORS_FORMCONTAINER).on("shown.bs.collapse",(()=>{[...formContainers].every((container=>container.classList.contains(CLASSES_SHOW)))&&(collapsemenu.classList.remove(CLASSES_COLLAPSED),collapsemenu.setAttribute("aria-expanded",!0))})),pendingPromise.resolve()}})); //# sourceMappingURL=collapsesections.min.js.map \ No newline at end of file diff --git a/lib/form/amd/build/collapsesections.min.js.map b/lib/form/amd/build/collapsesections.min.js.map index 5d32da8449c..a3b34e22811 100644 --- a/lib/form/amd/build/collapsesections.min.js.map +++ b/lib/form/amd/build/collapsesections.min.js.map @@ -1 +1 @@ -{"version":3,"file":"collapsesections.min.js","sources":["../src/collapsesections.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Collapse or expand all form sections on clicking the expand all / collapse al link.\n *\n * @module core_form/collapsesections\n * @copyright 2021 Bas Brands\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n * @since 4.0\n */\n\nimport $ from 'jquery';\nimport Pending from 'core/pending';\n\nconst SELECTORS = {\n FORM: '.mform',\n FORMHEADER: '.fheader',\n FORMCONTAINER: 'fieldset > .fcontainer',\n};\n\nconst CLASSES = {\n SHOW: 'show',\n COLLAPSED: 'collapsed',\n HIDDEN: 'd-none'\n};\n\n/**\n * Initialises the form section collapse / expand action.\n *\n * @param {string} collapsesections the collapse/expand link id.\n */\nexport const init = collapsesections => {\n // All jQuery in this code can be replaced when MDL-71979 is integrated (move to Bootstrap 5).\n const pendingPromise = new Pending('core_form/collapsesections');\n const collapsemenu = document.querySelector(collapsesections);\n\n const formParent = collapsemenu.closest(SELECTORS.FORM);\n const formContainers = formParent.querySelectorAll(SELECTORS.FORMCONTAINER);\n\n collapsemenu.addEventListener('keydown', e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n collapsemenu.click();\n }\n });\n\n // Override default collapse class if all visible containers are expanded on page load\n let formcontainercount = 0;\n let expandedcount = 0;\n formContainers.forEach(container => {\n const parentFieldset = container.parentElement;\n if (!parentFieldset.classList.contains(CLASSES.HIDDEN)) {\n formcontainercount++;\n }\n if (container.classList.contains(CLASSES.SHOW)) {\n expandedcount++;\n }\n });\n\n if (formcontainercount === expandedcount) {\n collapsemenu.classList.remove(CLASSES.COLLAPSED);\n collapsemenu.setAttribute('aria-expanded', true);\n }\n\n // When the collapse menu is toggled, update each form container to match.\n collapsemenu.addEventListener('click', () => {\n let action = 'hide';\n if (collapsemenu.classList.contains(CLASSES.COLLAPSED)) {\n action = 'show';\n }\n\n formContainers.forEach(container => $(container).collapse(action));\n });\n\n // Ensure collapse menu button adds aria-controls attribute referring to each collapsible element.\n const collapseElements = formParent.querySelectorAll(SELECTORS.FORMHEADER);\n const collapseElementIds = [...collapseElements].map((element, index) => {\n element.id = element.id || `collapseElement-${index}`;\n return element.id;\n });\n collapsemenu.setAttribute('aria-controls', collapseElementIds.join(' '));\n\n // When any form container is toggled, re-calculate collapse menu state.\n $(SELECTORS.FORMCONTAINER).on('hidden.bs.collapse', () => {\n const allCollapsed = [...formContainers].every(container => !container.classList.contains(CLASSES.SHOW));\n if (allCollapsed) {\n collapsemenu.classList.add(CLASSES.COLLAPSED);\n collapsemenu.setAttribute('aria-expanded', false);\n }\n });\n $(SELECTORS.FORMCONTAINER).on('shown.bs.collapse', () => {\n const allExpanded = [...formContainers].every(container => container.classList.contains(CLASSES.SHOW));\n if (allExpanded) {\n collapsemenu.classList.remove(CLASSES.COLLAPSED);\n collapsemenu.setAttribute('aria-expanded', true);\n }\n });\n pendingPromise.resolve();\n};\n"],"names":["SELECTORS","CLASSES","collapsesections","pendingPromise","Pending","collapsemenu","document","querySelector","formParent","closest","formContainers","querySelectorAll","addEventListener","e","key","preventDefault","click","formcontainercount","expandedcount","forEach","container","parentElement","classList","contains","remove","setAttribute","action","collapse","collapseElementIds","map","element","index","id","join","on","every","add","resolve"],"mappings":";;;;;;;;0KA2BMA,eACI,SADJA,qBAEU,WAFVA,wBAGa,yBAGbC,aACI,OADJA,kBAES,YAFTA,eAGM,uBAQQC,yBAEVC,eAAiB,IAAIC,iBAAQ,8BAC7BC,aAAeC,SAASC,cAAcL,kBAEtCM,WAAaH,aAAaI,QAAQT,gBAClCU,eAAiBF,WAAWG,iBAAiBX,yBAEnDK,aAAaO,iBAAiB,WAAWC,IACvB,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACvBD,EAAEE,iBACFV,aAAaW,gBAKjBC,mBAAqB,EACrBC,cAAgB,EACpBR,eAAeS,SAAQC,YACIA,UAAUC,cACbC,UAAUC,SAAStB,iBACnCgB,qBAEAG,UAAUE,UAAUC,SAAStB,eAC7BiB,mBAIJD,qBAAuBC,gBACvBb,aAAaiB,UAAUE,OAAOvB,mBAC9BI,aAAaoB,aAAa,iBAAiB,IAI/CpB,aAAaO,iBAAiB,SAAS,SAC/Bc,OAAS,OACTrB,aAAaiB,UAAUC,SAAStB,qBAChCyB,OAAS,QAGbhB,eAAeS,SAAQC,YAAa,mBAAEA,WAAWO,SAASD,mBAKxDE,mBAAqB,IADFpB,WAAWG,iBAAiBX,uBACJ6B,KAAI,CAACC,QAASC,SAC3DD,QAAQE,GAAKF,QAAQE,8BAAyBD,OACvCD,QAAQE,MAEnB3B,aAAaoB,aAAa,gBAAiBG,mBAAmBK,KAAK,0BAGjEjC,yBAAyBkC,GAAG,sBAAsB,KAC3B,IAAIxB,gBAAgByB,OAAMf,YAAcA,UAAUE,UAAUC,SAAStB,kBAEtFI,aAAaiB,UAAUc,IAAInC,mBAC3BI,aAAaoB,aAAa,iBAAiB,2BAGjDzB,yBAAyBkC,GAAG,qBAAqB,KAC3B,IAAIxB,gBAAgByB,OAAMf,WAAaA,UAAUE,UAAUC,SAAStB,kBAEpFI,aAAaiB,UAAUE,OAAOvB,mBAC9BI,aAAaoB,aAAa,iBAAiB,OAGnDtB,eAAekC"} \ No newline at end of file +{"version":3,"file":"collapsesections.min.js","sources":["../src/collapsesections.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Collapse or expand all form sections on clicking the expand all / collapse al link.\n *\n * @module core_form/collapsesections\n * @copyright 2021 Bas Brands\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n * @since 4.0\n */\n\nimport $ from 'jquery';\nimport Pending from 'core/pending';\n\nconst SELECTORS = {\n FORM: '.mform',\n FORMHEADER: '.fheader',\n FORMCONTAINER: 'fieldset > .fcontainer',\n};\n\nconst CLASSES = {\n SHOW: 'show',\n COLLAPSED: 'collapsed',\n HIDDEN: 'd-none'\n};\n\n/**\n * Initialises the form section collapse / expand action.\n *\n * @param {string} collapsesections the collapse/expand link id.\n */\nexport const init = collapsesections => {\n // All jQuery in this code can be replaced when MDL-71979 is integrated (move to Bootstrap 5).\n const pendingPromise = new Pending('core_form/collapsesections');\n const collapsemenu = document.querySelector(collapsesections);\n\n const formParent = collapsemenu.closest(SELECTORS.FORM);\n const formContainers = formParent.querySelectorAll(SELECTORS.FORMCONTAINER);\n\n collapsemenu.addEventListener('keydown', e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n collapsemenu.click();\n }\n });\n\n // Override default collapse class if all visible containers are expanded on page load\n let formcontainercount = 0;\n let expandedcount = 0;\n formContainers.forEach(container => {\n const parentFieldset = container.parentElement;\n if (!parentFieldset.classList.contains(CLASSES.HIDDEN)) {\n formcontainercount++;\n }\n if (container.classList.contains(CLASSES.SHOW)) {\n expandedcount++;\n }\n });\n\n if (formcontainercount === expandedcount) {\n collapsemenu.classList.remove(CLASSES.COLLAPSED);\n collapsemenu.setAttribute('aria-expanded', true);\n }\n\n // When the collapse menu is toggled, update each form container to match.\n collapsemenu.addEventListener('click', () => {\n let action = 'hide';\n if (collapsemenu.classList.contains(CLASSES.COLLAPSED)) {\n action = 'show';\n }\n\n if (formContainers.length) {\n const pendingPromiseToggle = new Pending('core_form/collapsesections:toggle-' + action);\n formContainers.forEach((container, index, array) => {\n $(container).collapse(action);\n if (index === array.length - 1) {\n pendingPromiseToggle.resolve();\n }\n });\n }\n });\n\n // Ensure collapse menu button adds aria-controls attribute referring to each collapsible element.\n const collapseElements = formParent.querySelectorAll(SELECTORS.FORMHEADER);\n const collapseElementIds = [...collapseElements].map((element, index) => {\n element.id = element.id || `collapseElement-${index}`;\n return element.id;\n });\n collapsemenu.setAttribute('aria-controls', collapseElementIds.join(' '));\n\n // When any form container is toggled, re-calculate collapse menu state.\n $(SELECTORS.FORMCONTAINER).on('hidden.bs.collapse', () => {\n const allCollapsed = [...formContainers].every(container => !container.classList.contains(CLASSES.SHOW));\n if (allCollapsed) {\n collapsemenu.classList.add(CLASSES.COLLAPSED);\n collapsemenu.setAttribute('aria-expanded', false);\n }\n });\n $(SELECTORS.FORMCONTAINER).on('shown.bs.collapse', () => {\n const allExpanded = [...formContainers].every(container => container.classList.contains(CLASSES.SHOW));\n if (allExpanded) {\n collapsemenu.classList.remove(CLASSES.COLLAPSED);\n collapsemenu.setAttribute('aria-expanded', true);\n }\n });\n pendingPromise.resolve();\n};\n"],"names":["SELECTORS","CLASSES","collapsesections","pendingPromise","Pending","collapsemenu","document","querySelector","formParent","closest","formContainers","querySelectorAll","addEventListener","e","key","preventDefault","click","formcontainercount","expandedcount","forEach","container","parentElement","classList","contains","remove","setAttribute","action","length","pendingPromiseToggle","index","array","collapse","resolve","collapseElementIds","map","element","id","join","on","every","add"],"mappings":";;;;;;;;0KA2BMA,eACI,SADJA,qBAEU,WAFVA,wBAGa,yBAGbC,aACI,OADJA,kBAES,YAFTA,eAGM,uBAQQC,yBAEVC,eAAiB,IAAIC,iBAAQ,8BAC7BC,aAAeC,SAASC,cAAcL,kBAEtCM,WAAaH,aAAaI,QAAQT,gBAClCU,eAAiBF,WAAWG,iBAAiBX,yBAEnDK,aAAaO,iBAAiB,WAAWC,IACvB,UAAVA,EAAEC,KAA6B,MAAVD,EAAEC,MACvBD,EAAEE,iBACFV,aAAaW,gBAKjBC,mBAAqB,EACrBC,cAAgB,EACpBR,eAAeS,SAAQC,YACIA,UAAUC,cACbC,UAAUC,SAAStB,iBACnCgB,qBAEAG,UAAUE,UAAUC,SAAStB,eAC7BiB,mBAIJD,qBAAuBC,gBACvBb,aAAaiB,UAAUE,OAAOvB,mBAC9BI,aAAaoB,aAAa,iBAAiB,IAI/CpB,aAAaO,iBAAiB,SAAS,SAC/Bc,OAAS,UACTrB,aAAaiB,UAAUC,SAAStB,qBAChCyB,OAAS,QAGThB,eAAeiB,OAAQ,OACjBC,qBAAuB,IAAIxB,iBAAQ,qCAAuCsB,QAChFhB,eAAeS,SAAQ,CAACC,UAAWS,MAAOC,6BACpCV,WAAWW,SAASL,QAClBG,QAAUC,MAAMH,OAAS,GACzBC,qBAAqBI,uBAQ/BC,mBAAqB,IADFzB,WAAWG,iBAAiBX,uBACJkC,KAAI,CAACC,QAASN,SAC3DM,QAAQC,GAAKD,QAAQC,8BAAyBP,OACvCM,QAAQC,MAEnB/B,aAAaoB,aAAa,gBAAiBQ,mBAAmBI,KAAK,0BAGjErC,yBAAyBsC,GAAG,sBAAsB,KAC3B,IAAI5B,gBAAgB6B,OAAMnB,YAAcA,UAAUE,UAAUC,SAAStB,kBAEtFI,aAAaiB,UAAUkB,IAAIvC,mBAC3BI,aAAaoB,aAAa,iBAAiB,2BAGjDzB,yBAAyBsC,GAAG,qBAAqB,KAC3B,IAAI5B,gBAAgB6B,OAAMnB,WAAaA,UAAUE,UAAUC,SAAStB,kBAEpFI,aAAaiB,UAAUE,OAAOvB,mBAC9BI,aAAaoB,aAAa,iBAAiB,OAGnDtB,eAAe6B"} \ No newline at end of file diff --git a/lib/form/amd/src/collapsesections.js b/lib/form/amd/src/collapsesections.js index b2d3127c79d..92bc2d17382 100644 --- a/lib/form/amd/src/collapsesections.js +++ b/lib/form/amd/src/collapsesections.js @@ -82,7 +82,15 @@ export const init = collapsesections => { action = 'show'; } - formContainers.forEach(container => $(container).collapse(action)); + if (formContainers.length) { + const pendingPromiseToggle = new Pending('core_form/collapsesections:toggle-' + action); + formContainers.forEach((container, index, array) => { + $(container).collapse(action); + if (index === array.length - 1) { + pendingPromiseToggle.resolve(); + } + }); + } }); // Ensure collapse menu button adds aria-controls attribute referring to each collapsible element. diff --git a/lib/tests/behat/behat_forms.php b/lib/tests/behat/behat_forms.php index 61824bc0078..9efacd43b66 100644 --- a/lib/tests/behat/behat_forms.php +++ b/lib/tests/behat/behat_forms.php @@ -167,7 +167,7 @@ class behat_forms extends behat_base { // Different try & catch as we can have expanded fieldsets with advanced fields on them. try { - + $this->wait_for_pending_js(); // Expand all fields xpath. $showmorexpath = "//a[normalize-space(.)='" . get_string('showmore', 'form') . "']" . "[contains(concat(' ', normalize-space(@class), ' '), ' moreless-toggler')]"; @@ -177,22 +177,23 @@ class behat_forms extends behat_base { return; } - if ($this->getSession()->getDriver() instanceof \DMore\ChromeDriver\ChromeDriver) { - // Chrome Driver produces unique xpaths for each element. - foreach ($showmores as $showmore) { - $showmore->click(); + $js = << 0) { + const pendingPromise = new Pending('showmore:expand'); + for (let i = 0, length = query.snapshotLength; i < length; ++i) { + query.snapshotItem(i).click(); + if (i === length - 1) { + pendingPromise.resolve(); + } + } } - } else { - // Funny thing about this, with findAll() we specify a pattern and each element matching the pattern - // is added to the array with of xpaths with a [0], [1]... sufix, but when we click on an element it - // does not matches the specified xpath anymore (now is a "Show less..." link) so [1] becomes [0], - // that's why we always click on the first XPath match, will be always the next one. - $iterations = count($showmores); - for ($i = 0; $i < $iterations; $i++) { - $showmores[0]->click(); - } - } + }); + EOF; + $this->execute_script($js); + $this->wait_for_pending_js(); } catch (ElementNotFoundException $e) { // We continue with the test. }