WordPress5.5から始まったjQueryの段階的なバージョンアップのテストプラグイン・Test jQuery Updatesの使い方が変わりました。
jQueryが少しずつ変わっていくので、WP5.5以下とWP5.6以上でプラグインのバージョンと設定方法がちがいます。
jQueryのバージョンアップのスケジュール
jQueryのバージョンアップは3ステップで行います。1回のWordPressバージョンアップでは行わず、段階的に行われます。
2020年12月10日現在、WP5.6が公開されたのでステップ2が終わったところ。
| ステップ | WP バージョン | jquery （本体） | jquery-migrate | jquery-ui |
|---|---|---|---|---|
| 1 | 5.5 | 1系のまま （1.12.4） | × | そのまま （1.11.4） |
| 2 | 5.6 | 3系にアップデート （3.5.1） | アップデート （3.3.0） | アップデート （1.12.1） |
| 3 | 5.7 | アップデートなし | × | アップデートなし |
| ステップ | 内容 |
|---|---|
| 1 | 下位互換の無効化。 migrateだけ外す。 アップデートなし。 |
| 2 | jQueryおよびUIプラグインのアップデート。 （1系 -> 3系） Migrate付き。 |
| 3 | 下位互換の無効化。 migrateだけ外す。 アップデートなし。 |
最終的にjQueryを1系から3系に上げてmigrateを廃止します。WP5.6は一気に上げるステップ。一番気をつけるところです。
くわしくはこちらに書きました。
WP5.6に上げる前にテストする
個人でやってる分にはWordPressを5.6に上げてから、いろいろな対応作業をしてもいいですが、企業など業務ではそうはいかないでしょう。
その場合は、WP5.6に上げる前にテストします。
ここで注意点が。
Test jQuery Updatesプラグインの最新版は2.0.0で（2020年12月10日現在）、2.0.0からWordPressの対応バージョンが5.6以上です。事前テストでは使えません。
ということで、こちらから1.0.2をダウンロードして手動で追加してください。
（ページの最後にダウンロードボタンがある。）
プラグインのダウングレードができるプラグインがあります。こちらを使ってもいいでしょう。
（使い方も簡単そうです。ボクは使ってないので説明は割愛。）
使い方
このプラグインは、jQuery本体（core）、jquery-migrate、jQuery-uiのバージョンを個々に切り替えできます。
その組み合わせで、WordPressのバージョンごとのjQuery環境が作れます。
（将来のjQueryの組み合わせも設定できるので、今のうち備えることもできる。）
| jquery | jquery-migrate | jquery-ui | |
|---|---|---|---|
| 旧バージョン （1系） | 1.12.4 | 1.4.1 | 1.11.4 |
| 新バージョン （3系） | 3.5.1 | 3.3.0 | 1.12.1 |
| WPバージョン | jquery | jquery-migrate | jquery-ui |
|---|---|---|---|
| 5.4 | Default （1.12.4） | Enable （1.4.1） | Default （1.11.4） |
| 5.5 | Default （1.12.4） | Disable （×） | Default （1.11.4） |
| 5.6 | 3.5.1 | Enable （3.3.0） | 1.12.1 |
| 5.7 （予定） | 3.5.1 | Disable （×） | 1.12.1 |
migrateはjquery本体のバージョンを見て、プラグインが自動で対象バージョンを設定してくれるので楽です。
1つのWordPressで複数サイトを運用しているとき（マルチサイト）、設定メニューはサイトネットワークになります。
各サイトごとには設定できません。
プラグインのバージョンが1.0.2以下の場合、WP5.6では設定メニューが表示されません。ようは使えない。
WP5.6でテストする
もうすでに、WP5.6にアップデートしているとき、このプラグインは2.0.0以上にする必要があります。
プラグインのアップデートで最新版にしておけばOK。
ただ、設定メニューがガラリと変わっています。
使い方
プラグインの変更点は、jquery-uiの選択をやめてスッキリしました。
また、jQueryバージョンのデフォルトが3系に変わっています。中途半端ですが日本語化もされてます。
| WPバージョン | jquery | jquery-migrate |
|---|---|---|
| 5.4 | 1.12.4 | 有効化 （1.4.1） |
| 5.5 | 1.12.4 | 無効化 （×） |
| 5.6 | デフォルト （3.5.1） | 有効化 （3.3.0） |
| 5.7 （予定） | デフォルト （3.5.1） | 無効化 （×） |
jquery-uiのバージョンは、jQueryをダウングレードしても新しいバージョンのまま（1.12.1）。
影響がなく変える必要はないと判断されたのでしょう。
migrateは、jQueryのバージョンに合わせて自動的に変わります。
本番環境で使うのはやめよう！
日本語訳が中途半端ですが、あくまでテスト用プラグインなので本番環境で使うのはやめようと言っています。
このプラグインは、WordPress 5.6でのjQueryとjQuery Migrateのテストを目的としています。
本番環境での使用は意図されていません。
ライブサイト（本番環境）にTest jQuery Updatesをインストールしている場合は、アンインストールして、代わりにEnable jQuery Migrate Helperを使用してください。
筆者訳
jQueryをダウングレードしたいとき、本番環境ではEnable jQuery Migrate Helperプラグインを使えってこと。
Test jQuery Updatesプラグインは、有効化されるとjQueryの初期設定が行われるのでアンインストールが必要です。
（プラグインの無効化でもいいが、使うことはないのでアンインストールのほうがいい。）
『使ってもいいけど、責任はウチにありません。』とも取れる。
使うときは自分で対応する覚悟を。
Enable jQuery Migrate Helperプラグイン
jQueryのバージョンをWP5.5以前に戻すプラグインです。使い方は簡単で、プラグインを有効化 / 無効化するだけ。
| 有効化 | jQueryのダウングレード （WP5.5以下のjQuery） |
| 無効化 | WP5.6のjQuery |
しかし、jqueryのJavaScriptの載せ替えはしないみたいです。
jQueryとmigrateのバージョンは新しいままにして、ajaxでページをリロードして、その中でjQueryのバージョンを下位バージョンに変えてるらしい。
HTMLの差分を取って確認しました。
<head>
<script defer src='https://tadtadya.test/wp-includes/js/jquery/jquery.min.js?ver=3.5.1' id='jquery-core-js'></script>
<script src='https://tadtadya.test/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2' id='jquery-migrate-js'></script>
</head>（tadtadya.testはテスト用ドメイン。公開されていないのでアクセスできない。）
<head>
<script defer src='https://tadtadya.test/wp-includes/js/jquery/jquery.min.js?ver=3.5.1' id='jquery-core-js'></script>
<script src='https://tadtadya.test/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2' id='jquery-migrate-js'></script>
<!-- ---------- プラグイン有効化の追加スクリプト start ---------- -->
<script type="text/javascript">
window.onerror = function (msg, url, line, col, error) {
var xhr = new XMLHttpRequest();
var nonce = '57feb68691';
xhr.open('POST', 'https://tadtadya.test/wp-admin/admin-ajax.php');
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.onload = function () {
var response,
reload = false;
if (200 === xhr.status) {
try {
response = JSON.parse(xhr.response);
reload = response.data.reload;
} catch (e) {
reload = false;
}
}
// Automatically reload the page if a deprecation caused an automatic downgrade, ensure visitors get the best possible experience.
if (reload) {
location.reload();
}
};
xhr.send(encodeURI('action=jquery-migrate-downgrade-version&_wpnonce=' + nonce + '&msg=' + msg));
// Suppress error alerts in older browsers
return true;
}
</script>
<!-- ---------- プラグイン有効化の追加スクリプト end ---------- -->
</head>
<body>
<!-- ページコンテンツ -->
<!-- ---------- プラグイン有効化の追加スクリプト start ---------- -->
<!-- bodyの下部に追加 -->
<script id='jquery-migrate-deprecation-notices-js-extra'>
var JQMH = { "ajaxurl": "https:\/\/tadtadya.test\/wp-admin\/admin-ajax.php", "report_nonce": "eab75ff5d5", "backend": "", "plugin_slug": "enable-jquery-migrate-helper", "capture_deprecations": "", "single_instance_log": "1" };
</script>
<script src='https://tadtadya.test/wp-content/plugins/enable-jquery-migrate-helper/js/deprecation-notice.js' id='jquery-migrate-deprecation-notices-js'></script>
<!-- ---------- プラグイン有効化の追加スクリプト end ---------- -->
</body>サイトのページを表示するたびに、ajaxのリロードが発生するのが若干気になりますが、これを使えって言ってるので使いましょう。
WordPressのアップデートは慎重に
WordPressを3、4、5系と使ってきましたが、今回のWP5.6へのアップデートにいちばん気を使っています。
（5.5に上げるときも全く同じことを言ってた。それ以上ってこと。）
とくにプラグインを多く使っている人、デフォルト以外のテーマを使っている人は要注意。
（WordPress非公式はとくに。）
アップデート頻度が低いものも注意しましょう。
ボクの場合、公開サイトはもともとjQueryを3系を載せるカスタマイズをしていて影響なし、管理画面もとくに影響なしでした。
案外あっさり上手くいったほうでしょう。だからといって『楽勝ですよ』とは言えません。
内容を見てると。
これを機に別のテーマ・プラグインに変えることも念頭に入れときましょう。すべての開発者が迅速に対応するとは限らないので。
WordPressは参入しやすいこともあり、キャリアの少ないエンジニアがたくさんいます。
中にはエンジニアの最低限の常識すらない人もいて、お金目当てを目的にするあまり、バージョンアップの対応すら考えもしない人もいます。
（一時期、Twitterのタイムラインに溢れるくらい流れていた。最近は見なくなってはいるが。）
気をつけましょう。
（ちなみに普通のエンジニアは、自分ができなければ引き受ける人を探す、代わりになるものを紹介する、など行う。）
WordPressの次のバージョン5.7で、migrateを外す予定です。
5.6ほどの内容ではありません。それまでにプラグインやテーマがmigrateを使わなくて済む対応をしてくれるか次第ですが。
