WordPress 4.9系におけるウィジェットのJS関係の不具合
WordPress 4.9系の動画と音声ウィジェットの件については先に書いていたが、今度はウィジェットでスクリプトが直書き＆出力されている部分について。
具体的に言うとカテゴリー・アーカイブの2点のウィジェット。
ドロップダウン表示した際に以下のようなエラーが発生するときがある。
Uncaught TypeError: dropdown.parentNode.submit is not a function
at HTMLSelectElement.onCatChange
これは、ドロップダウン選択時のページ移動用のJSそのものが書き直されているらしい。
で、これよりも先にJSのライブラリを読み込んでしまうとエラーが起こってしまうようだ。
少なくとも4.8系では元々はlocation.hrefで書かれており、当該の箇所は以下のようになっていた。
<script type='text/javascript'>
/* <![CDATA[ */
(function() {
var dropdown = document.getElementById( "<?php echo esc_js( $dropdown_id ); ?>" );
function onCatChange() {
if ( dropdown.options[ dropdown.selectedIndex ].value > 0 ) {
//↓これ
location.href = "<?php echo home_url(); ?>/?cat=" + dropdown.options[ dropdown.selectedIndex ].value;
}
}
dropdown.onchange = onCatChange;
})();
/* ]]> */
</script>
これが、4.9系でこのような形に変わることになったみたい。
<script type='text/javascript'>
/* <![CDATA[ */
(function() {
var dropdown = document.getElementById( "<?php echo esc_js( $dropdown_id ); ?>" );
function onCatChange() {
if ( dropdown.options[ dropdown.selectedIndex ].value > 0 ) {
//↓これ
dropdown.parentNode.submit();
}
}
dropdown.onchange = onCatChange;
})();
/* ]]> */
</script>
このsubmit()がJavaScriptと、それより先に読み込んだJSライブラリとコンフリクトして不具合が発生する。
当該のJSは、<head></head>間にライブラリを読み込む可能性のあるwp_enqueue_script()を明らかに配慮せずに書かれている。
対処方法としては、wp_enqueue_script()の引数設定で読み込んでいるJSのライブラリを全て以下のようにして</body>の直前に出力先を変更するのが有効。
wp_enqueue_script('sample-js', get_template_directory_uri().'/js/loading.js', array(), '' ,true);
ただし、ページの途中でライブラリ依存のスクリプトを読み込む際に<head></head>間にどうしても記述を行わなければならないこともある。
この場合は残念ながら現時点でできる対処などはなく、アップデートを待つ他ない。