Browser

Microsoft Edge(Project Spartan, Internet Explorer) 、ブラウザ周辺、Web フロントエンド開発、UI、など

Microsoft Edge まとめページ

Microsoft Edge の変更ログ - Windows 10 Insider Preview Build 10547

何故か今回も変更が盛りだくさんです。

 

いつもの参照元

Release version 10547 : Microsoft Edge Dev

 

EdgeHTML の更新
  • <template> element
  • <picture> element
  • Extended srcset (sizes)
  • a[download] attribute
  • Canvas ellipse
  • CSS Mutability Pseudo-classes (:read-write, :read-only)
  • CSS Range Pseudo-classes (:in-range, :out-of-range)
  • input type=datetime-local
  • SVG external content
  • WebRTC - Object RTC API

 

Chakra の更新
  • ES2016 Async Functions
  • ES2016 Exponentiation operator

この2つの機能はアドレスバー about:flags 入力後、
「試験的な JavaScript 機能」を有効にし Edge を再起動する必要があります。

 

変更

User-Agent が以下のものに変更され、Chrome と Edge のバージョン番号が変更されました。


Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10547

 

Build 10240 Chrome/42.0.2311.135 Edge/12.10240
Build 10547 Chrome/46.0.2486.0 Edge/13.10547

 

その他

多くタブを開き、閉じるボタンを押した際にある程度時間がたってからタブの大きさが戻るようになりました。
IE 11 やほかのブラウザの様に連続でタブを閉じることができますし、閉じた際の誤動作を防ぐことができます。

about:flags に Media Source Extensions の項目が追加され、
Enable VP9 のチェックボックスが付きました。

 

 

<template> element

Web Components の機能の一つでページ上で表示されない要素です。
以前は以下サンプルの様に script タグで同様のことをやっていました。

 

<picture> element

画像に他の情報をまとめる要素です。
以下のサンプルでは幅が 600px を超えると大きなサイズの画像になります。

またこの振る舞いは Extended srcset (sizes) を使えば img 要素のみでも可能です。 

 

a[download] attribute

他のブラウザの様に、a 要素に download 属性を付加すると、href で設定したファイルをダウンロードさせることができます

 

Canvas ellipse

他のブラウザの様に、キャンバスで楕円を描画することができるようになりました。
以前は円を拡縮して表現していました。

f:id:x67x6fx74x6f:20150921170836p:plain

 

input type=datetime-local

f:id:x67x6fx74x6f:20150921171015p:plain

「input type=time」に日付とともに入力できる属性が追加されました。
value は以下の様に記述します。

 

SVG external content

SVG タグ内部で外部コンテンツを読み処理できます。
サンプルでは以下の SVGSVG タグ内で読み込んでスタイル適応しています。

内部で読み込む SVG ファイル

記述する SVG

黒四角の SVG を読み込んで赤色を適応します。
以前は AjaxSVG を読み込みページ内で展開してスタイルを適応していました。

 

ES2016 Async Functions

通常の振る舞い

 

Async の仕様をちゃんと読み込んではいませんが、
現状の Edge では以下のような振る舞いです。
Async 内で Await まで実行され、スコープを外れて Async の関数の次のものが実行された後 1つ目の Await 以降が実行されていきます。


ES2016 Exponentiation operator

 Math.pow を使わずに以下のように書くことができるようになりました。

 

スポンサーリンク