BackstopJSを使ったCSSのリファクタリング | フロントエンドBlog | ミツエーリンクス

皆さんはCSSをメンテナンスする際に、あるセレクターを削除したら思いもよらないページでレイアウトが崩れていたなどの経験がありませんでしょうか。サイトを運用していくに当たって、CSSのメンテナンスはサイトの構造を熟知していない人が触るとサイト全体のデザインが崩れる可能性があります。その理由として、以下が良く上げられると思います。 セレクターが全てグローバル変数的な扱いになること 悪い意味でスタイルがカスケードをしてしまうこと スタイルを消すことを恐れてスタイルの詳細度を上げて上書きしていくこと 最近、JavaScriptではJasmine、Mocha、QUnitなどテストツールが数多くありますが、CSSをテストするツールは多くはありません。その中で今回は上記の問題を解決するための手段としてサイトの見た目はそのままでCSSの構造を改善するためのリファクタリングツールをご紹介します。 Backs