CSSのテストとは JavaScriptのテストであれば、ある条件のもとに正しい値を返しているか、要素が存在するかなどのテスト項目を挙げることができるかと思います。 ではJavaScriptではなく、CSSをテストするとしたらどういったことをテストすればよいか考えたことはあるでしょうか。筆者は次のような項目を考えました。 CSSが適切な書き方がされているか確認したい Sassで作成した関数(@function)が正しい値を返しているか確認したい ある部分が正しい見た目をしているか確認したい それぞれの項目に関して簡単にですが、なぜそれをテストする必要があるか、またテストの概要を解説していきます。 なお、このシリーズで紹介するサンプルは次のリポジトリにまとめてあります。併せて、参照してください。 GitHub - codegrid/css-testing 1. CSSが適切な書き方がされてい
![CSSのテスト | 前編 何をテストするのか](https://cdn-ak-scissors.b.st-hatena.com/image/square/a369da6588a45a0ae14660ce9a6dcb905daed6ad/height=288;version=1;width=512/https%3A%2F%2Fcodegrid.imgix.net%2Fimage.png%3Fixlib%3Djs-3.8.0%26w%3D1200%26h%3D630%26mark%3Dhttps%253A%252F%252Fcodegrid.imgix.net%252F~text%253Fixlib%253Djs-3.8.0%2526w%253D1000%2526txt%253D%2525E4%2525BD%252595%2525E3%252582%252592%2525E3%252583%252586%2525E3%252582%2525B9%2525E3%252583%252588%2525E3%252581%252599%2525E3%252582%25258B%2525E3%252581%2525AE%2525E3%252581%25258B%2526txt-fit%253Dmax%2526txt-size%253D57%2526txt-font%253DHiragino%252520Sans%252520W5%2526txt-color%253Dfff%26mark-x%3D90%26mark-y%3D195%26blend%3D%2523BD1818%26blend-mode%3Doverlay%26txt%3DCSS%25E3%2581%25AE%25E3%2583%2586%25E3%2582%25B9%25E3%2583%2588%2520%257C%2520%25E5%2589%258D%25E7%25B7%25A8%26txt-align%3Dtop%252Cleft%26txt-font%3DHiragino%2520Sans%2520W5%26txt-size%3D30%26txt-pad%3D100%26txt-color%3Dfff)