きしだのはてな このページをアンテナに追加 RSSフィード

2012-10-03(水) NetBeans7.3(Beta)に組込みブラウザがついて想像以上にすばらしい

NetBeans7.3(Beta)に組込みブラウザがついて想像以上にすばらしい 09:44 NetBeans7.3(Beta)に組込みブラウザがついて想像以上にすばらしいを含むブックマーク

とうとうNetBeansに組込みブラウザがつきましたよ!

いままで、FirefoxレンダリングエンジンであるGeckoを使ったプラグインなどがありましたが、ネイティブコンポーネントとSwingの相性も悪くて、あまり使えるものじゃありませんでした。

でも、JavaFXWebKitベースのブラウザが入ったことで、とうとうNetBeansにも使い物になるブラウザが組み込まれました!といっても、まだBetaですが。

んで、これが思ったよりも素晴らしくて、なんだか将来的に期待がもてそうな感じなので、紹介します。します。します。


Betaの前の開発版を使ったので、動きは少し違うかも。NetBeans7.3Betaはこっちからダウンロードできます。

http://dlc.sun.com.edgesuite.net/netbeans/7.3/beta/


オプションを見ると「Webブラウザ」の項目に、「Embedded WebKit Browser」という項目ができてます。

f:id:nowokay:20121003081933p:image


JavaコードとかでJavaDocを開こうとすると、NetBeans内でブラウザが開きます!やった!ただ、最初はJavaFXの場所を指定しろと言ってくるので、JDK内のjreフォルダを選びます。この手順はなくせるはずなので、正式リリースまでにはなくなってくれることを望みます。

f:id:nowokay:20121003081931p:image


JavaFXの場所を指定すると、晴れてNetBeans内でJavaDocが表示できるようになりました!ぱちぱちぱち。いやー長かった。

f:id:nowokay:20121003081930p:image


このJavaFXWebKitベースのブラウザ、なかなかちゃんと動いてて、結構めんどうなことをやってそうなSencha Touchもちゃんと動きました。

f:id:nowokay:20121003081928p:image


こっちはChromeJavaFXのほうは、アイコンの透過がうまく処理できてない感じだけど。

f:id:nowokay:20121003081929p:image



んで、まあ、これだけなら「それ10年前から見れたわ〜Eclipseなら10年前から見れたわ〜」という話なんですけど、面白いのはここからで。

なんか新規プロジェクトでHTML5プロジェクトなどというものができてたりします。Twitter Bootstrupとかテンプレートを選べたり、jQueryなどJavaScriptライブラリを選べたりします。

f:id:nowokay:20121003081927p:image


CSSや画像の指定が絶対パスだったりして、実行するときに、ルートディレクトリである必要がある場合に、サーバー経由で表示したいことも多いですけど、その場合に組込みサーバーを使うこともできたりします。たぶん、JDK付属のHttpServerを使ってるんだと思います。

http://d.hatena.ne.jp/nowokay/20101124#1290505617

f:id:nowokay:20121003081926p:image

NetBeansと統合したChrome」なんてものも選択できますけど、プラグインが必要で、そのプラグインは現在のところダウンロードできませんでした。


んで、まあ、こんなHTMLを作ってみます。

<!DOCTYPE html>
<html>
    <head>
        <title>Hello JavaFX Browser</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <style type="text/css">
            .hello{
                font-size: x-large;
                color: limegreen}
        </style>
    </head>
    <body>
        <h1>Hello JavaFX Browser</h1>
        <div>TODO write content</div>
        <div class="hello">Yeah!</div>
    </body>
</html>

で、「開く」とすると、組込みブラウザで開きます。有効描画範囲を設定できるのがうれしい。あと、上部のHTMLエディタのほう、パンくずナビゲーションがついてるのがわかります。パンくずナビゲーション、Javaコードでも使えます。

HTMLを変更して保存すると、変更なしに反映されるのがうれしいです。

f:id:nowokay:20121003081923p:image


面白いのが「select mode」なるものです。

f:id:nowokay:20121003081924p:image


ブラウザ内のエレメントを選べます。左側のツリーと連動してます。あと、右側ではスタイルとか属性が表示されます。

f:id:nowokay:20121003081925p:image


まだまだ使いやすいものではないし、動的生成されたHTMLソースを見る機能がなかったりして、これで開発が楽になるという段階ではないですけど、もう少しIDE連携がこなれて、あとはSeleniumと連携できるようになったりしたら、これはなかなか面白いことになりそうです。

JsTestDriver連携も標準で用意されているようだし、Web開発ツールとしてNetBeansが強化されていくことを実感できるバージョンアップになりそう。いままでも、CSSエディタなどWeb系ファイルの強さというのはあったのですけど、ブラウザという重要なコンポーネントが手に入ったことで、この方向への進化が加速しそうです。


最近、NetBeansのベータが出てもわざわざ使おうとは思わなくて、正式リリースが出てからいろいろ試すという感じになっていたのですけど、久しぶりにベータの時点から常用したいバージョンになりました。

トラックバック - http://d.hatena.ne.jp/nowokay/20121003