Where can we see the website in question?
@takayukister
Currently, unfortunately, not at all, as we had to solve the problem ourselves in index.js. The page is used by a customer. Here, unfortunately, I can not send test data.
It only needs to be checked here in the code if .screen-reader-response [role=”status”] exists before working with .innertext. In general, you should always check if something exists before working with it – according to my understanding.
Hello,
we had the exact same issue. A javascript error, that innerText of null cannot be changed for .screen-reader-response [role=”status”].
As apparently there was no fix available, we patched out the .screen-reader-response part in index.js. It looks like this now: https://gist.github.com/qSebastiaNp/801dba970784f2ebcde23abaac42ef76
This of course breaks functionality of screenreaders, but a working contact form was more important.
Hi everyone , I was facing the same issue, the solution I have found is to add a div with a screen-reader-response class between the div role=”form” and the form tag
<div role=”form” class=”wpcf7″ id=”wpcf7-f115-o1″ lang=”es-ES” dir=”ltr”>
<div class=”screen-reader-response”><p role=”status” aria-live=”polite” aria-atomic=”true”></p>
</div>
<form action=”” method=”post” class=”wpcf7-form” novalidate=”novalidate” name =”formx” id=”formx”>
@lairinys the problem is not the entire div, but only the <p role=”status”> that doesn’t exists.
I’ve put this code and it worked:
jQuery(function(){
if (jQuery(‘.screen-reader-response [role=”status”]’)[0] == undefined) jQuery(‘.screen-reader-response’).append(‘<p role=”status” aria-live=”polite” aria-atomic=”true”></p>’);
});
