3

開発するにあたって使用しているECMAScript6の各Classやmethodが各ブラウザに対応しているかどうか確認したいのですが

WEB UIにては
http://kangax.github.io/compat-table/es6/
のサイトを使用すれば一つ一つ確認はとれるようなのですが
手作業でひとつひとつ上記サイトにてチェックすることになりそうです。

そうではなくローカルで組んだscript等を使用して自動的に確認する方法を取りたく思っています。

Can I useサイトに関しては
https://github.com/Fyrd/caniuse
にてCan I useで使用している情報がjsonで提供されているので
上記目的が実現可能なのですがECMAScript6の情報に関しては網羅されていないように見えます。
(WEB UI版Can I Useでもhttp://kangax.github.io/compat-table/es6/にリダイレクトされるようです。)

ECMAScriptに関して各ブラウザの対応状況を確認できるような
データ / REST等のWEB API / もしくはツールそのもの
をご存知であればご教示いただきたく思います。


追記:
https://github.com/kangax/compat-table
にkangax氏のcompat-table/es6の元ソースがありそうでした。

ただしあるのは
data-es6.js:各ブラウザで検証するためのECMAScript6検証用ソース
compat-table/es6/index.html:上記を実行した結果のHtml

data-es6.jsの実行結果がjsonなりxmlなりのprimitiveなデータであれば都合がよかったのですが
Viewつきのindex.htmlしかないように見えました・・・

index.htmlをスクレイピングするしかないのでしょうか・・・

5
  • WEB UIのツールでも、Class一つ一つではなく「貼りつけたjavascriptコード全体を解析/チェック」してくれるようなツールがあればそれでも構いません。
    – H.H
    Commented 2017年3月30日 8:22
  • 自動的に確認といっても、何を入力にどんな結果を出してほしいのかよくわかりませんが...例えばBabelのプラグイン babel-preset-env はブラウザバージョンを指定すると、それらのサポートに必要なtransformを適用してくれます。この判断にはkangax/compat-tableを元に機械的に生成したjsonファイルを使っているようなので、これが使えるかもしれません。 babeljs.io/docs/plugins/preset-env
    – unarist
    Commented 2017年3月31日 6:27
  • ありがとうございます。チェックできるのはClass(Feature)単位で、Class中のメンバのどれか一個でもサポートしていないと非サポート扱いになっているようですね。とりあえずはこのレベルのチェックでも十分かと思いますので助かります。
    – H.H
    Commented 2017年3月31日 10:32
  • 質問の意図と違うかもしれませんが、一番確実なのはユニットテストを書いてそれを対応したいブラウザで走らせることではないでしょうか。JSだとライブラリはJasmineたMochaが人気なようです
    – packet0
    Commented 2017年3月31日 11:24
  • 今回はCD前の設計段階での検証が目的となります。実際にCD後の検証は別途行おうと思います。
    – H.H
    Commented 2017年4月1日 13:07

1 件の回答 1

2

コメント欄にてunaristさんから頂いた情報の通りとなりますが

https://babeljs.io/docs/plugins/preset-env/
にてkangax‌​/compat-tableを元に定期生成されているものが
https://github.com/babel/babel-preset-env/blob/master/data/built-ins.json
にて参照可能なようです。

  "es6.promise": {
    "chrome": 51,
    "edge": 13,
    "firefox": 45,
    "safari": 10,
    "node": 6.5,
    "ios": 10,
    "opera": 38,
    "electron": 1.2
  },

の形にて「対応しているクライアント」が確認可能です。
(実際はAndroidなどではPromiseは使用可能ですが、Feature中使用不可能なものがひとつでもあると「非サポート」扱いになっているようで、AndroidはPromise中の
"Promise.race, generic iterables"が非サポートになっています。)

メソッド単位の情報は上記jsonにはないようですが、今はそのレベルまでのチェックは必須でないのと
必須になった場合は
https://github.com/babel/babel-preset-env/blob/master/scripts/build-data.js
を参考にする等してAPI単位でとれるように検討します。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。