miso_soup3 Blog

主に ASP.NET 関連について書いています。

ページインスペクター追加機能(リリース候補)

12/14(金)に公開された ASP.NET and Web Tools 2012.2 RC
のアップデート項目の中に、ページインスペクターの追加機能
が2つあったので、それについて書きます。

他のアップデート項目である、新しい MVC テンプレートや、
SignalR、WEB API、WEB の発行、などなどと比べると
小さな変更点です。

JavaScript の対応

Single Page Application テンプレートを例に紹介します。

ページインスペクターを開くと、「Call Stack」というタブが追加されています。

このタブが、今回追加された JavaScript 対応の部分です。
「Inspect」をクリックして、適当に何かの要素を選択してみます。

すると、”この要素は、Script によって作られたものではない”
という旨のメッセージがでます。
なので、Sciprt によって作られる要素を選択してみます。

テキストボックスを未入力のまま、「Log in」ボタンをクリックすると、
エラーメッセージが表示されるので、この要素を選択してみます。
(Single Page Application テンプレートなので、WEB API と JavaScipt により、
エラーメッセージは非同期で表示されます。)

選択すると、先ほどの「Call Stack」タブには Script ファイルとメソッドの一覧が、
右側には、ajaxlogin.js ファイルが表示され、displayErrors(...) がハイライトされます。

恐らくですがこの機能は、要素の生成に要因する JavaScript を確認することができる
のだろうと思われます。

Single Page Application テンプレートの主役である
ToDo一覧画面では、knockout が大活躍なので、いろいろ確認することができます。

すごい!・・・・けど使用頻度は低そう・・・。

CSS すぐ反映

ページインスペクター使用中に、CSS ファイルを変更すると、
すぐに反映されます。

右側の CSS ファイルで、背景をまっ黒にしてみました。
今までは、変更した後に Ctrl+Alt+Enter しないと反映されませんでした。
これは楽!

余談

Single Page Application テンプレートは、
knockout.js、WEB API、WEB API ヘルプ生成&トレース機能、
ソーシャルログイン認証、SimpleMembership ・・・と
新機能の玉手箱やー!!な感じです。
SignalR は追加されないのでしょうか?

追記(2012/12/17)

Single Page Application テンプレートについての記事と、
アップデート項目の中の、knockout.js のインテリセンス機能についての
詳細記事がありました。

Inside the ASP.NET Single Page Apps Template
Knockout Intellisense in Visual Studio 2012