IT Office Nishimiyahara

個人用スマホから商用プログラミングまでなんでもお任せ下さい

HTMLの正当性を検査するのにHTML::Tidyを使ってみた

      2014/02/24

@nqounetです.

PerlでHTMLの正当性(validかどうか)を確認するのにHTML::Tidyを使ってみたという話をします.

HTML::Tidyを入れる前にAlien::Tidypを入れる

HTML::Tidyは単独で動作するわけではありません.

少なくとも今一番新しいバージョンでは,Alien::Tidypをいうモジュールを予めインストールしておくことで使えるようになります.

依存情報が書かれていないためHTML::Tidyをインストールしても自動的にはインストールされません.

試してみる方は以下の様な感じでインストールしてみてください.

使い方は極々簡単.

結果はこんな感じになります.

ほんとうに欲しかったもの

欲しかったのは,閉じタグがない,とか,閉じタグが多い,というような情報だったのですが,その辺はWarningレベルのようなので,どうしようかなと思案中です.

HTMLの構造体を簡単にチェックできると良かったんですが….

実際にjQuery Mobileで作ったページを通してみると,

のまえにがありません的なWarningが沢山あって戦々恐々としています.

listviewを作る時に,a要素の中にp要素を含んでいるのですが,その部分のことを警告されているようです.

HTML5的にはa要素の中にp要素があっても問題ないのですが,以前はそうではなかったということで,その名残でしょうか.

HTML::Tidy

HTML::Tidyは,2010年から更新されていなかったのですが,何故か今年の9月頃に更新されていました.

…とは言っても,Changesを見る限り,大きな変更点はなかったように思います.

Webアプリを作る時に,それほどまじめにやらないのはHTMLのvalidationじゃないかなと思います.

私は今までほとんどやったことがありませんでした.

staticなものであれば,W3CのHTML Validatorが使えますが,ログインしたり色々するのはこいつでは検証できません.

かと言って,APIを使ってテストするのも非常識かなと.

便利なモジュールもあるんですけどね.

CGI全盛期の遺産

MVCフレームワークのようなテンプレートを使ったものの場合,明らかにおかしい部分はすぐに分かります.

…いや,すぐに分からなくても,少し調べればわかるのでHTMLのテストは必要性を感じなかったのです.

というのも,昔はheaderファイルに開始タグを書いてfooterファイルに終了タグを書く,というような書き方もしていたのですが,いつの頃からかincludeするファイルごとにHTMLの構造を完結させるようになっていました.

そのため,HTMLの構造が壊れても簡単に発見できました.

しかし,過去の遺産というか負債というか,ちゃんとHTMLの構造を意識していないコードもあります.

この場合は,includeしているファイルを全部見ていく必要があるので面倒です.

しかも,if文で,classやonclickの指定が違う部分を開始タグごと書いてあったり,条件によって開始タグがなくなるように書いていることもありました.

我ながら酷いと思います.

閉じタグを書くためのif文を見て泣けてきました.

こういう部分は,後々を考えて書き直していきたいのですが,HTMLの構造体がどこでどう変わっているのかをソースレベルで追いかけるのは大変です.

そこで,HTMLの構造のテストを追加することにしました.

もう少しカジュアルにテストしたいですね….

respo

respo link

ZenBackWidget

 - 情報技術について ,