【翻訳】mablを使ったローコード・テスティングでプログラミングの概念を学ぼう

弊社では最近[mabl](https://www.mabl.com/)という自動テストツールの社内導入をはじめました。
mablはプログラミング知識がなくともテスト自動化を始められる手軽さがある一方で、プログラミングの考え方に慣れ親しんでいればより効率的にテストを記述できる奥深さも持ち合わせていて、なかなか良いツールだと感じています。

先日mabl公式ブログでちょうどmablの機能とプログラミングの概念の関係性を説明した[「How Low-code Testing Can Help You Learn Programming Concepts」](https://www.mabl.com/blog/how-low-code-testing-can-help-you-learn-programming-concepts)という記事が公開されましたので、今回はこの記事を翻訳してご紹介したいと思います。（mablの方より許可をいただいています）

## 対象読者

- mablやAutifyのようなツールを使ってテスト自動化をこれからはじめる(あるいははじめたばかりの)プログラミング初心者の方
- mablの基本的な機能を知りたい方

## 翻訳

### はじめに

mablのようなローコードテストツールの大きな利点は、例えば手動テスター、プロダクトオーナー、サポート担当者など、基本的なQAの概念を知っている人なら誰でもテスト自動化ができるようになることです。
ここで私たちが「ノーコード」ではなく「ローコード」と呼んでいるのには理由があります。ツールの使い方を学んでいくにつれて、プログラミングの強力な概念を使ってテストをより効果的なものにしたり、JavaScriptのようなプログラミング言語を学ぶのに役立つ知識を習得したりすることができるようになるからです。
この記事では、そのいくつかの例について説明します。

### ローカル変数とグローバル変数
変数を使用すれば、テストのすべてのステップに値を直打ち(ハードコーディング)することなく、より柔軟かつ効率的に文字列や数値を生成・保存・操作・使用することができます。

例えば、あるテスト中に3回使用するメールアドレスがあったとしましょう。このとき、アドレスを3度ハードコーディングするのではなく、変数"email_address"を作成して、3つのステップのそれぞれでその変数を参照するようにしてみましょう。そうすれば、そのメールアドレスを更新したい場合に、変数"email_address"を定義した一箇所で値を更新すればよくなります。

![lowcode110420_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/9a19c05f-ce9c-6b41-82ee-be03615e0519.png)

他のプログラミング言語と同様に、mablでも変数のスコープを定義することができます。特定のテスト中のみ有効な変数を定義すること[^1]も、複数のテストや実行時全体にまたがる変数を定義すること[^2]も、或いは外部のデータソース（データテーブル）を使って、テスト実行時にパラメータを渡すことも可能です。

[^1]: プログラムの一部分で利用される変数をローカル変数と呼びます。
[^2]: プログラム全体で利用される変数をグローバル変数と呼びます。

再び"email_address"を例に取ると、例えばそれぞれが異なる権限を有するような、複数のメールアドレスを含むデータテーブルを使用することができます。[^3]この機能を使えば、各メールアドレスを使用したテストを並行実行できたり、後に続く一連のテストをそのアドレスを使って実行することもできます。

[^3]: 一般にデータ駆動テストと呼ばれるものです。

### 関数（フロー）

プログラミングにおける関数や手続きのように、mablではフローという機能を利用することが出来ます。フローは順次実行される一連のステップをまとめたものです。
フローも関数と同じように、前のステップの値を入力として取り込んだり、後のステップに値を渡したり、値を書き出したりすることができますし、他のフローから再利用したり、参照したりすることもできます。

フローを使うことで、より効率的にローコードテストの作成や保守をすることができます。例えば、ログインフローを作成すれば、それぞれのテストでログインステップを作成しなくとも、ログインフローを再利用すればよくなります。そうすれば、テスト対象のアプリケーションのログイン画面が変更された場合でも、ログインフロー部を変更するだけで済むようになります。

![lowcode110420_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/e50637aa-5eac-84e6-2284-573e032fe4cf.png)

### 条件式（if/then/else）
プログラミングでは、条件式を使用することで、その式の評価の真偽(True/False)に基づいて実行する処理を分岐させることができます。mablにも条件式が用意されているため、これを使用すれば実行するテストステップを分岐させることができます。

例えば、テストを終了する前にアプリのチェックボックスが特定の状態にセットされていることを確認したい場合を考えてみましょう。チェックボックスの状態を確認し、望んだ状態でない場合はチェックを再設定する条件式をシンプルに作成することができます。

![lowcode110420_3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/cd73740a-17ab-05c7-476a-f4abae1783aa.png)

### ループ

ループは、指定した条件が満たされるまで一連のステップを繰り返す強力なプログラミング構造です。これにより、同じコードの繰り返しをなくし、テストの作成やメンテナンスの時間を節約することができます。mablでは、テスト中にフローを挿入して、フローのループ回数を指定して実行できる上、その回数は変数に基づいて設定することもできます。

例えば、あるリスト内の全てのアイテムに対して同じ操作を実行したい場合には、まずアイテムの総数をカウントし、その値を変数に格納してみましょう。その変数を使えば、リスト内の各アイテムに対して一度だけループを繰り返すフローを設定することができます。

![lowcode110420_4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/89e42ef1-8cd2-26ea-16cb-1037fbc7201f.png)


### JavaScriptスニペット

mablではmabl Trainerというツールを使ってテストを作成していきます。
mabl Trainerの基本操作をマスターしたあとには、mablのJavaScriptスニペット機能を使って自作関数を書き、それをmablのテストステップとして実行することで、JavaScriptに挑戦することができます。

JavaScriptスニペットを使うことで、操作やアサーションを定義する際の幅が無限に広がります。まずはJavaScriptの関数と構文について少し学ぶことから始めてみてはいかがでしょうか。学習スタイルにもよって、一から関数を自作してもいいですし、[mablのGitHubリポジトリにある便利なサンプルスニペット](https://github.com/mablhq/mabl-javascript-snippets)を使うことから始めてみてもいいでしょう。

![lowcode110420_5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/2a86fdc8-f63a-00b1-779b-0aa38982d900.png)

### コマンドラインインタフェース

コマンドラインインタフェース(CLI)がグラフィカルインタフェースよりも効率的だと感じている開発者の方も多いのではないでしょうか。もしまだCLIに慣れていないなら、mabl CLIは始めるのに最適です。とても使いやすく、ウェブ版では利用できない多くの機能が含まれています。シェルスクリプトを使ってCLIを自動化することもできます。

![lowcode110420_8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/96cede2f-0a55-ec99-d356-c27e1e5aa84c.png)

### ウェブブラウザの概念

一般的な開発者、特にウェブアプリケーション開発者は、ブラウザセッションからの診断データを使用してトラブルシューティングをする必要があります。
クラウド上でmablのテストを実行すると、**mablはDocument Object Model (DOM)、Http Archive (HAR) ファイル、Tracesなどのスナップショットなど、各ステップごとに大量のブラウザデータを自動的に取得します。**[^4]
特に、Failしたテストのトラブルシューティングをすることは、これらの重要なデータソースに慣れるための素晴らしい方法であり、ウェブブラウザの内部の仕組みをより深く理解するのにも繋がることでしょう。

[^4]: 訳者的に激推し機能です。

![lowcode110420_6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/69ffd1bf-ec36-2989-fe59-ff92d5873713.png)

### APIテスト

APIは現代のアプリケーションの内部やアプリケーション間のシステムをつなぐ”接着剤”の役割を果たしていますが、開発初心者の方はその扱いに戸惑うかもしれません。mablのAPIステップを使えば、コードを書かなくてもAPIリクエストとレスポンスに慣れることができます。

例えば、テストの最初にAPIからデータを取得するステップを追加して、テストの後半でそのデータを使用することができます。また、アサーションを使ってAPIからのレスポンスが正しいかどうかを検証することもできます。mablのAPIテスト機能を利用することで、構文やプロトコルなどにとらわれることなくAPIについて学ぶことができます。

![lowcode110420_7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/527184/459fca15-1f04-e303-0681-8868c59973d0.png)

### 学べ、そして改善し続けよ！グッドラック！

これらのローコードプログラミングの概念をテストに組み込むことを楽しんでいただければ幸いです。
もしmablで行き詰ったら[公式ドキュメント](https://help.mabl.com/)をチェックしてみてください。