
Flutter Golden Testsと私のことを紹介させてください!
Flutter Golden Testsの概要を解説しています。
実際のアプリ開発にすぐにFlutter Golden Testsを始められるように、Flutter Golden Testのコマンド一覧とテストのテンプレートをまとめてあります。
Flutter Golden TestsをFlutterのプロジェクトにインストールするため、pubspec.yamlを編集します。
実際にFlutter Golden Testsを実行して、動作を理解します。
Flutter Golden Testsでは、Ahemというフォントがデフォルトになります。その場合、文字が出ないので、ちゃんとした文字がでるようにフォントの設定をします
Flutter Golden Testsで、日本語フォントを使用する方法を説明します。
次のレクチャーで実施することの概要を説明しています
Flutter Golden Testsを実行させて、どのような流れでGUIの差分を抽出するのか学習します。
Flutter Golden Testsでは、アプリ全体だけでなく、Widget単体でもGUIのテストができます。そのための前準備の方法を学習します。
Flutter Golden TestsでWidget単体で実行したときの動作を確認します。
Widget単体でテストするとき、Widgetの状態を変化させて出力の異なるWidgetを一覧で表示する方法を学習します
Flutter Golden Testsで画像の一覧を作成するときの2種類のレイアウトを学習します
Flutter Golden TestsでテストするWidgetに含まれるTextのフォントサイズを変更する方法を学習します
Flutter Golden Testsで出力する画像の大きさを変更する方法を学習します。
Flutter Golden Testsで画像やアイコンが表示されることを確認します。
Flutter Golden Testsを使って、色々なデバイス(の大きさ)で画面キャプチャを出力する方法を学習します。
Fltuter Golden Testsと通常のWidget Testで画面の状態変化を確認する方法を学習します。タップ動作を使って、タップすると画面が変化することをアプリ全体で確認します。
Flutter Golden Testsを使って、タップ動作で画面が変化することを確認したので、同じ処理を色々なデバイスで実施する方法を学習します。
Flutter Golden Testsを使って、複数のデバイスの大きさで、複数のアプリの状態を、同じファイルに出力する方法を学習します
複数のデバイスの大きさで、複数のアプリの状態を、同じファイルに出力する方法を学習しましたが、そのときの引数のKeyは何を表しているのか、失敗例を見て理解します。
Gitを使ったFlutter Golden Testsの運用方法を学習します
Flutter Golden Testsで特定のファイルやテストのゴールデン(良好な参照スクリーンショット)を更新する方法を学習します
アプリ開発は作成だけでなく、長くメンテナンスやアップデートが必要になります。Flutterも同じで、しかもFlutter自体やプラグインの開発も早いですので、あなたのアプリを保守するのは年々難しくなっていきます。
Flutterやプラグインのアップデートで、コンパイルが通らなくなる。直しても、本当に以前と同じ動作をするのか。GUIは変わってないか、不安だからといって、全部確かめている時間もない。解決法の一つがテスト駆動型開発となりますが、GUI面ではFlutterの通常のテストでは対応できない。だからと言って、目視して画面を確認するのはもうやめましょう。
eBayが抜け出す方法を開発してくれました。それが「Flutter Golden Tests」です。目視確認済の画像を良好な参照データをして、テストをするたびに、Widgetやアプリ全体のGUIに変化がないか確認してくれます。
「Flutter Golden Tests」って、難しいのか、あなたの開発プロセスに導入できるのか、そう不安になります。WEB上で情報が散見してて大変でしたが、私の方でわかりやすくテンプレートにまとめました。やっぱり難しい、使えないという方には、30日間返金しますので、ご安心ください。
Flutterの初心者向けの解説はしていません。通常のWidgetTestを知っている、もしくは、チャレンジするとお考えの方向けです。そしてなによりも、テストを作ってアプリを保守する意思のある方向けです。
一緒に「Flutter Golden Tests」を学んで、実践して行ければ嬉しいです!プレビューだけ見ていただければ、「Flutter Golden Tests」について他人にドヤれる知識が得られますので、ぜひ、プレビューだけでも見ていってください!
それでは、コースでお会いできるのを楽しみにしてます。
【本講座で学べること】
FlutterのWidget Testで実際に表示されるアプリ画面やWidgetを色々な画面サイズでキャプチャする方法
事前に目視したキャプチャ画像と、テスト実施時のキャプチャ画像を比較し、差分を取得する方法(差分がなければ合格!)
Flutter Golden Testsのインストール方法と、上記の機能を実施する方法
【動画撮影時のバージョン】
Flutter : 2.2.3 channel stable
Dart : 2.13.4(NullSafty対応)
Android Studio: version 4.1.0
golden_toolkit: 0.9.0