Description
Hi all,
It appears that the aria-busy="true"
is removed from the turbo-frame
after the fetch
request has been completed. I believe this should be changed and only removed after everything hooked into the event turbo:before-frame-render
has also completed. Currently with the frame is being made no longer busy, before code in the turbo:before-frame-render
is executed and could lead to accessibility issues.
We ran into this because have been using the aria-busy attribute of turbo-frame elements to conditionally style a turbo frame as "busy".
Very simple example to illustrate:
turbo-frame[aria-busy="true"]{
opacity: 0.5;
}
We are also hooking into turbo events such as turbo:before-frame-render
to perform some custom rendering using selectize.js to render our select boxes correctly. We started to notice on frames with a lot of select
elements and select > option
elements that the styling of the "busy" frame would disappear before our selects where styled correctly or indeed accessible.
I am aware of the complete
attribute but purposefully avoided usage of this attribute as we wanted to follow accessibility standards and style the UI accordingly.