[5.1] B/C (?) Modal issue for plugins

[Ruud68]

Steps to reproduce the issue

In my extensions I have a control panel where I offer shortcuts to certain plugins: these shortcuts open the plugin in a modal that is rendered with HTMLHelper::_('bootstrap.renderModal'...

This works perfect in Joomla 3.x / 4.x and 5.0 until I installed Joomla 5.1 and then the following two issues (for which I cannot find any information) occurred:

1. save, save & close and Close buttons are visible on top position (on Joomla 5.0 these where rendered as 'hidden' in administrator/components/com_plugins/tmpl/plugin/modal.php in Joomla 5.1 these are not hidden anymore and as such display
2. because the buttons in 1. have changed the buttons in the bottom are not working anymore

As a workaround I have created a JS function to hide the (1) buttons on event 'shown.bs.modal' and for issue (2) I have created a 'if J5.1 then / else' logic to get the correct button identifiers in there: this because still a lot of my users are on Joomla4 and I cannot have multiple versions for Joomla 5.0 / Joomla 5.1 and for Joomla 4.4

This changed behavior should IMO be described somewhere (here? https://manual.joomla.org/migrations/50-51/)

below the JS code I use for hiding the buttons in the loaded iframe, hope it saves somebody some time:

        document.addEventListener("DOMContentLoaded", function() {
            var modals = document.querySelectorAll('.modal');

            modals.forEach(function(modal) {
                modal.addEventListener('shown.bs.modal', function() {
                    var iframe = modal.querySelector('.iframe');
                    iframe.addEventListener('load', function() {
                        // Accessing the iframe content
                        var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

                        // Hiding the div with class "subhead" within the iframe
                        var subheadDiv = iframeDocument.querySelector(".subhead");
                        if (subheadDiv) {
                            subheadDiv.style.display = "none";
                        }
                    });
                });
            });
        });

Expected result

the button (1) should be hidden as they where hidden in Joomla 5.0.3 and lower

[Fedik]

Modal editing for Plugin and Module were updated to use Dialog.

• [5.1] Use Dialog for Plugin editing #42447
• [5.1] Use Dialog for Module editing #42423

because the buttons in 1. have changed the buttons in the bottom are not working anymore

In theory they still should work. Maybe something missing need to look.

upd, I see, the buttons got a new id.

[Fedik]

Later I will make PR to fix the old buttons, however new buttons will stay visible that how it is.

[Ruud68]

Thanks @Fedik ,
I have seen the rework and I love it :), point is that I also have to support 5.0 and 4.4 and need to do so without having different versions of my extensions / code duplication workarounds etc.
The buttons changing the id is an easy workaround although that turns out to be a b/c issue.
The buttons on the modal not being rendered as hidden is more of an issue as these are difficult to hide.

next to that, when using these new buttons on top, e.g. close then the modal doesn't close but shows a full sized (modal) message with a check mark that the plugin was saved. The actual closing of the modal is then only possible via clicking outside the modal.

When point the bottom buttons to the in this case close button on de top, the the modal closes without the big message.

So there are actually different things different between 5.0 and 5.1

[Ruud68]

When using the top close button provided by the plugin layout, it doesn't close the modal it shows this instead:

[Fedik]

Bootstrap modal does not have a litle X? to close
hm,

[Ruud68]

I clicked close, or save and close and then that is what I get: it should do what the button says: close or save and close, not show this screen and then require additional X click (or in my case because no X, click outside the modal)

[Ruud68]

Later I will make PR to fix the old buttons, however new buttons will stay visible that how it is.

understand, but then the visible buttons were they where not visible in J 5.0.3 (and lower) is a B/C
Question here is: why do tey need to be visible where in 5.0.2 they where 'hidden'?

<button id="applyBtn" type="button" class="hidden" onclick="Joomla.submitbutton('plugin.apply');"></button>

[Fedik]

Question here is: why do tey need to be visible where in 5.0.2 they where 'hidden'?

Old approach was a bit too hacky.
It is better when the buttons are within the frame document instead of parent frame.

[brianteeman]

... and this is why there are beta and rc releases

[Ruud68]

Question here is: why do tey need to be visible where in 5.0.2 they where 'hidden'?

Old approach was a bit too hacky. It is better when the buttons are within the frame document instead of parent frame.

agree about the 'hacky' part: way better like it is now, lacks some flexibility like adding own buttons (like I added the toggle inline help button), but is something that can be hacked in there in another way :)

But still: the new buttons on top are not 'usable' as they 'produce' the confirmation screen on close and save & close

[Ruud68]

... and this is why there are beta and rc releases

indeed

[Fedik]

Please test #43291

[Ruud68]

@Fedik For me nothing is closed yet, so just keep posting findings here:
I'm refactoring the BS modals into Dialogs for the plugins, I run into the following issue:
In my BS modal I had the buttons in the footer of the modal, I had full control over the buttons in that footer so I added the (important) 'Toggle inline help' button.

This buttons is missing in the plugin dialog: only save, save&close and close are there.

How do I get that button added as 4th button? > did #43296 for this

How to I add a footer to the (plugin iframe) dialog? Documentation is not giving any insights in this? Is this possible?