MDN Web Docs日本語版と英語版の日付を比較するブックマークレット

いまやMozilla Firefoxのためだけのものではなく、ウェブブラウザーを横断する文書を集約することを目指すことになった*1 MDN Web Docs（以下、単にMDN）ですが、ページによっては残念なことに英語版の更新に追随できていない、ということがあります。

必要なときにMDNに限らず文書の日付をチェックするように筆者は心掛けているのですが、MDNの日本語版と英語版をいちいち目視でチェックするのも面倒だなあ…しかし拡張機能を作るほどでもないし…そうかブックマークレットという手があったか、ということで晒してみます。なお、日本語版のMDNを開いてるときに英語版と比較するようになってます。

javascript:(function(){var c=document.querySelector(".contributors-sub time").dateTime,d=Date.parse(c),b=location.pathname.replace("/ja/","/en-US/"),a=new XMLHttpRequest;a.open("GET","https://developer.mozilla.org"+b);a.responseType="document";a.send();a.addEventListener("load",function(a){a=a.target.responseXML.querySelector(".contributors-sub time").dateTime;var b=Date.parse(a);0>d-b?window.alert(c+" :ja\n"+a+" :en\n\u65e5\u672c\u8a9e\u306e\u60c5\u5831\u304c\u53e4\u3044\u3067\u3059\u3002"):window.alert("\u263a")})})();

お好みでwindow.alert()の中身を書きかえてください。ちなみにClosure Compiler Serviceで圧縮する前のコードはこんな感じ。もしかしたらJSに詳しい人からナンダコレと思われるかもですが（もしおかしなところがあれば、こっそり教えてください）、一応メジャーどころのブラウザーでは動くみたいです。

javascript:(
  function () {
    'use strict';
    //現在の日本語版MDNページの最終更新日を取得
    var jalastmod = document.querySelector('.contributors-sub time').dateTime;
    var japarsedate = Date.parse(jalastmod);
    //現在のページのURLを取得して英語版のURLを決定
    var japath = location.pathname;
    var enpath = japath.replace('\/ja\/', '\/en-US\/');
    var enurl = 'https://developer.mozilla.org' + enpath;
    //XMLHttpRequestで英語版MDNを取得
    var xhr= new XMLHttpRequest();
    xhr.open("GET", enurl);
    xhr.responseType = "document";
    xhr.send();
    xhr.addEventListener("load", function(ev){
      var dom = ev.target.responseXML;
      var enlastmod = dom.querySelector('.contributors-sub time').dateTime;
      var enparsedate = Date.parse(enlastmod);
      if (japarsedate - enparsedate < 0 ) {
        window.alert(jalastmod + " :ja\n" + enlastmod + " :en\n" +"日本語の情報が古いです。");
      }
      else {
        window.alert("☺");
      }
    })
  }
)();

まあ、やってることとしてはMDN日本語版と英語版のページフッターにある<time>要素を引っこ抜いて比較してるだけです。document.querySelector()バンザイって感じですね。

以下追記。

MDN の日本語ドキュメンテーション状況を確認できるページを教えてもらいました。こちらであればどのページが英語版と同期しているのか、存在するけれども古い翻訳か、はたまた未訳かを一度に見ることができます。俯瞰したい場合はこちらを使えばよさそうですね。

さらに追記。@ArcCosineさんにリファクタリングしてもらいました。

fetchだとこう書けるんですね！（書き方がよく分からなかったので…）

追加情報をいただいたお二人に感謝します。

*1:Mozilla、Microsoft、Googleがブラウザ横断Webドキュメントネットワーク構築で協力 - ITmedia NEWS http://www.itmedia.co.jp/news/articles/1710/19/news072.html

メモ：両HTMLにおけるmain要素の説明、ついに一定の収束の気配か。

あの2015年9月に端を発したとてつもなく長いmain要素の定義をどうにかしようというissueについに収束の気配が。

whatwg/htmlに<main>の記述を変更するPull RequestがAnneから出されている。このPRによるdiffはこんな感じ。

このPRでは2つ目のNoteはこのように変更される：

While there is no restriction as to the number of main elements in a document, web developers are encouraged to stick to a single element.

4.4.14 The main element (#3326)

試訳するとこんな感じか。「文書のmain要素の数に制限はないが、ウェブ開発者は単一の要素にこだわることを勧める。」

そんなこんなで、main要素は1つのHTMLで基本的に1つという縛りでいいんじゃないだろうか。