テスターちゃん【4コマ漫画】

ソフトウェアテストの用語、やり方などを4コマ漫画でわかりやすく説明する(予定の)ブログです。脱線も多いです。



バグを故障/欠陥/エラーとわけて何がうれしいの?

テスト業界ではバグ、つまり問題のことを故障/欠陥/エラーとわけて呼んだりします。

このことが話題に上がっていたので話を書いてみます。

 

言葉の意味

それぞれの言葉の意味からです。

故障

コンポーネントやシステムが定義された範囲内で要求する機能を実行しないこと。

ISTQB Glossary

JSTQBの用語集からです。難しい言葉が並んでいますね(笑)

簡単に説明すると、アプリを動かした結果、プロフィールが表示されないとかメッセージが送信できないといった「発生した問題(出来事)」を指しています。

ちなみに期待結果との相違を不正(アノマリー)と言ったりしますが今回は置いておきましょう。余計にややこしくなりそうです(笑)

欠陥

作業成果物に存在する、要件または仕様を満たさない不備または欠点。

ISTQB Glossary

欠陥は、例えばプログラムで (x < 10)と書くところを(x < 9)と書いてしまったとか、エラーの時の処理を書き忘れたといったような「埋め込まれている問題」を指しています。

その問題の部分(欠陥がある部分)が実行されるまでは表に出てこない――つまり故障という出来事として現れることはありません。

エラー

間違った結果を生み出す人間の行為。

ISTQB Glossary

この言葉がテスト業界の人と開発の人で使い方が一番異なる言葉な気がします。

ここは説明そのままです。例えば業務知識が不足していたので間違った設計をしてしまった、前の人が「ヨシ!」と言ってたので僕も「ヨシ」としてしまった、などでしょうか。

開発の人が「エラーが発生してる」といった場合は「僕は寝不足で寝不足で間違ったことをしています」と自己申告をしているのではなく、「故障が発生した」になりそうです。

 

エラーにより欠陥が埋め込まれ、欠陥が実行されて故障として現れる

まとめると上記のような流れになります。

プロセスがいい加減だった結果、うっかりプログラムを書き損じてしまって、実行したら動かなかった。

こんな感じでしょうか。

欠陥と故障は原因(欠陥)と結果(故障)の関係であり、エラーと欠陥も原因(エラー)と結果(結果)の関係にあります。

また、1つの欠陥から複数の故障が起こる場合もあります。

例えば、様々な場所から呼び出される共通のプログラムで書き損じがあった場合です。

この場合、テストをすると

「機能Aのレスポンスが来ない!」

「機能Bはnullって表示されている!」

このような問題(出来事)を観測できます。故障ですね。

それぞれの出来事について我々はバグ票(この場合故障票と呼ぶの?呼ばない)を記載します。

そして、共通するプログラムを修正するとどちらの故障も発生しなくなります。

別々の出来事(故障)が、共通の欠陥から発生することがあるということです。

同様に、1つのエラーから複数の欠陥が埋め込まれる場合もあります。

 

そんなに言葉をわけてなにか嬉しいの?

ふわっとした概念に「名前」を付けることによって扱いやすくなります。

名前を付けることで形を持つといったところでしょうか。古くから我々は、様々なことに名前を付けて扱えるようにしてきました。

では、今はひっくるめて「バグ」と言ってみましょうか。

 

例えば。

レスポンスが悪化する「バグ」があります。

ユーザーからも「バグ」の問い合わせが複数あります。CSからどう対応したらいいか聞かれています。

けれどこの「バグ」の原因となるプログラムの「バグ」がわかりません。

はやくこの「バグ」に対応しなければなりません。

そこで我々テスターはこの「バグ」に対応するために、CS/開発/企画含め緊急の「バグ対応ミーティング」を開くことにした。

 

さて。

この状況では、レスポンスが悪化する出来事――「故障」が発生しています。

ユーザーからも問い合わせがあって、CS側としては「ユーザーに返答する、故障への対応の方法」を求められています。

ただ開発で調べたけれどレスポンス悪化という「故障」がどこの「欠陥」によって引き起こされているかわかりません。

その状態で、我々テスターは緊急のミーティングを開くのですが、この緊急ミーティングは「何に対応したい」ミーティングでしょうか。

欠陥をどう直すか?いやいやその前に欠陥を見つけるためにどういったテストをすればいいか?

というよりは、まずは「今発生している出来事(故障)」に対応したいのです。

そのために、例えば開発側ではスケールアウト(サーバーの台数を増やす)といったサーバーサイドの対応でしのげるのか、テスター側ではスリープにすれば直る?wifiをつなぎ直せばいい?といったクライアント側での回避策(ワークアラウンド)で対処できるのか、それとも直近の変更をリバート(元に戻す)のか……といった故障への対応方針が優先されます。

 

このように「名前」を付けてあげることで「何を指しているか」がわかりやすくなり対応しやすくなります。

 

言葉(名前)は共通理解が大事

エンジニア的に言うと、言葉は通信プロトコル(通信するための約束事)です。

異なると「何を指しているかがわかる」という利点が失われます。

そこでテスト界隈では基本的にはJSTQBをベースとしていることが多いです。

これによって、共通の理解で話ができます。

https://jstqb.jp/syllabus.html

 

じゃあテスターちゃんの人は社内で故障/欠陥/エラーとわけて話してるんですか?

話してません。

僕はバグ、またはissue(イシュー)と言っています。テスター以外には伝わらないからです。

先ほど書いた通り言葉は共通理解が大事なのです。

例えば開発の人と話すときに「エラーを防ぐプロセスを考えたい」といった場合は意図が伝わりそうでしょうか?

それよりなら「うっかりミスを防ぐプロセスを考えたい」と言ったほうが伝わりそうですね。

ですがこれがテスターだけのミーティングではどうでしょうか?

こちらなら問題なく意図が伝わりそうです。

 

通信プロトコルは、受け取る相手によって変更する必要があります。

受け取る相手が、こちらの意図を正しく理解できるように、相手に合わせた言葉選びをする必要があるということです。

 

DockerでPlaywrightを実行/確認するコードの配布【仮想ディスプレイもレポートも見れるよ版】

作者です。

dockerでPlaywrightを実行するDockerfileを書いたので配布します。

dockerを起動すればもうPlaywrightのテスト実行可能です。

github.com

あと久しぶりにyoutubeでどう使うかも実演付きで説明してみましたので、そちらもよろしければ見てみてください。

youtu.be

 

ネットを見ていたら、dockerでPlaywrightをヘッドレス(実行中の様子が見えない状態)で実行する記事はあるのですが、docker内部で自動テストが実行されている様子が見えるようにするにはどうしたらいいか、が書かれた場所が作者が探す限りでは見つからなかったので、それをできるようにしてみました。

通常dockerでplaywrightを実行するときは「できあがったテスト」を実運用する場合なので動いている様子を見る必要がない、といったところはあるかと思います。

ただdockerには「手軽に、かつ自分の環境を汚さないで開発環境を作る」ことにも使われたりします。

あとは簡単にメンバーの自動テスト環境を整えるというようなことにも使えます。

今回のコードはそれがメイン……と言いつつ、ぶっちゃけ作者が「説明ないし作ってみよ~」といったところではありますw

テスト結果レポートを見るのもシンプルな形で実現しています。

使い方については、githubに全て説明を書いているのでそれをご参照ください。

 

次回youtubeは「じゃあこのdockerfileで何してるのさ?」という技術の話をしようかなーと考えています。

 

いや、マンガの続き描けよという話ですよねw

 

2023クリスマススペシャル「バグバッシュ大会」その2

2023クリスマススペシャル「バグバッシュ大会」その2

うっかり長い話にしてしまいました。

1月までクリスマスを引っ張ってしまいましたが、描いてみたかったのだからしようがないです(笑)

次で最後予定です。

最後の回の時にまとめて「バグバッシュ」についてのブログを書きます。

 

テスターちゃん小ネタ

開発のかいさんの髪型は、作者の前々職でご一緒した開発の方の髪型です。

(髪がつんつくしてました)

 

2023クリスマススペシャル「バグバッシュ大会」その1

2023クリスマススペシャル「バグバッシュ大会」その1

今回はバグバッシュのお話です。

クリスマススペシャルということで、普通のマンガを意識して描いてみています。

ネームを書いたら意外と長くなってしまい……。

このあと

* リーザ主任・カイさん(開発)チーム

* きゅんちゃん・ノリエ(企画)チーム

* まとめ

このような感じで、大体あと8ページほど描きます。

 

バグバッシュについてのブログは最後の回のときに書きます。

【END】ChatGPTを用いたTDD part.7 (実行ファイル作成編)

[END]ChatGPTを用いたTDD part.7 (実行ファイル作成編)

ChatGPTを用いたTDD part.6の続きです。

 

  • [END]ChatGPTを用いたTDD part.7 (実行ファイル作成編)
    • 実行できるコードを作る
  • ファイル名を受け取って、エラー処理、またはget_top_allで処理し、csvを返す
    • テストコードを書く
    • 最初のテストでレッドを出す
    • 最短でグリーンになるコードを書く
    • 詳細を実装する
    • テストを追加する
    • 機能追加、リファクタリング
  • 最後に実行できるコードにする
  • 最後のシステムテスト
    • 実行結果
  • 最後に所感
  • 今回の成果物のgithub

 

実行できるコードを作る

必要な部品をすべて作りました。

最後はコマンドプロンプト(terminal)で実行できるようにします。

イメージは以下です。

  1. コマンドプロンプトで実行し、第一引数をファイル名とする
  2. read_fileでファイルを読み込む
  3. 配列の最初に"Error"があったらその配列を表示し、異常終了させる
  4. 読み込んだファイルの内容をget_top_all(string_array)に渡す
  5. get_top_allの戻り値をconvert_csv(string_array)に渡す
  6. ラベル部分を出力する
  7. convert_csvの戻り値を出力する

これを書いていて、2~5までのプロセスはまとめてしまったほうがテストが楽かと思いましたので、TODOを追加します。

ファイル名を受け取って、エラー処理、またはget_top_allで処理し、csvを返す
    ファイル名を受け取って、read_fileでエラーが出た場合は終了させる
    [] ファイル名を受け取って、read_fileができた場合はget_top_allで処理し、csvを返す

ファイル名を受け取って、エラー処理、またはget_top_allで処理し、csvを返す

まずはエラーがない場合のテストを考えます。

すでに用意してある以下を使います。

test_file.txt

期待結果は以下となります。

13:52:54,00:06,16.2,20.3,5.0

テストコードを書く

続きを読む

ChatGPTを用いたTDD part.6 (最後の部品作り編)

ChatGPTを用いたTDD part.6 (最後の部品作り編)

ChatGPTを用いたTDD part.5の続きです。

今回で作る部品がすべて完成します。

まずはcsvにするメソッドを作ります。

 

  • ChatGPTを用いたTDD part.6 (最後の部品作り編)
  • csvにして画面出力を行う
    • テストコードを書く
    • テストを実行しレッドを確認する
    • 最短でグリーンになるコードを実装
    • 詳細の実装
    • テストがグリーンになるまで修正を続ける
  • ファイルを読み込み、1行1行に分解して出力する
    • テストコードを書く
    • テストを実行しレッドを確認する
    • 最短でグリーンになるコードを実装
    • 詳細の実装をする
    • テストがグリーンになるまで修正を行う
    • エラー時のテストを追加する

 

csvにして画面出力を行う

最初このように書いたのですが画面出力にしてしまうとテストが大変です。

これから作るメソッドは、文字列配列を受け取ったらカンマで結合して、その文字列を返すメソッドにします。

なのでTODOを書き換えます。

文字列配列をcsvの文字列にして返す
    与えられた文字列配列をcsv形式に結合して返す

テストデータは以下です。

["13:52:54","00:06","16.2","20.3","5.0","2.6\n","13:52:54","00:06","16.2","20.3","5.0","2.6\n"]

期待結果は以下です。

"13:52:54,00:06,16.2,20.3,5.0,2.6\n13:52:54,00:06,16.2,20.3,5.0,2.6\n"

テストコードを書く

続きを読む

ChatGPTを用いたTDD part.5 (Integration test編)

ChatGPTを用いたTDD part.5 (Integration test編)

ChatGPTを用いたTDD part.4の続きです。

次は、1行1行分かれている文字列データを順次読み取っていって、データを収集させる部分を作ります。

 

  • ChatGPTを用いたTDD part.5 (Integration test編)
  • 文章全体のデータを収集して、集めたデータを返す
    • テストコードを書く
    • 最短でグリーンになるコードを実装
    • 詳細の実装
    • テストを変更する

 

文章全体のデータを収集して、集めたデータを返す

イメージとしては、ファイルを読み込んだら1行1行に分解して、それをこれから作るメソッドに投げれば、必要なデータが全部取得できる、です。一続きの長い文字列配列を得られることを想定しています。

ファイルの読み込み部分とcsv出力部分は最後に作ります。

今回はMockなしで結合して確認します。

テストデータは以下です。

[

"top - 13:52:54 up 6 min,  0 users,  load average: 0.01, 0.07, 0.03",

"Tasks:   2 total,   1 running,   1 sleeping,   0 stopped,   0 zombie",
"%Cpu(s):  16.2 us,  20.3 sy,  5.0 ni,63.5 id,  0.0 wa,  0.0 hi,  0.0 si,  0.0 st",
"KiB Mem : 40979980 total, 37696840 free,  1050480 used,  2232660 buff/cache",
"KiB Swap: 10485760 total, 10485760 free,        0 used. 39463640 avail Mem"

]

期待結果は以下です。

[

"13:52:54","00:06",

"16.2","20.3","5.0",

"2.6\n"

]

テストコードを書く

続きを読む

ChatGPTを用いたTDD part.4 (Mock編)

ChatGPTを用いたTDD part.4 (Mock編)

ChatGPTを用いたTDD part.3の続きです。

TDDでTODOを行っていきます。

次は、これまで作ったget_time,get_cpu,get_memを入力された文字列に応じて処理をわける部分の実装です。

ここはMockを使ってテストを実装していきます。

 

  • ChatGPTを用いたTDD part.4 (Mock編)
  • top,cpu,memを判別してそれぞれのデータを返す
    •  
    • テストコードを書く
    • 最初のテスト実行(レッドの状態)
    • 最短でグリーンになるコードを実装
    • 詳細の実装
    • テストコードを追加し、すべてがグリーンになるまでテストを行う

 

top,cpu,memを判別してそれぞれのデータを返す

top,cpu,memを判別してそれぞれのデータを返す
    文字列の先頭がtopだった場合、topに対応するメソッドを呼び出し戻り値を返す
    文字列の先頭が%Cpu(s)だった場合、cpuに対応するメソッドを呼び出し戻り値を返す
    文字列の先頭がKiB Memだった場合、memに対応するメソッドを呼び出し戻り値を返す

イメージとしては、topが含まれた行を受け取った時はget_timeを呼び出し、cpuが含まれた行を受け取った時はget_cpuを呼び出し、memを含んだ行を受け取った時はget_memを呼び出し、それぞれに応じた戻り値を得るメソッドです。

まずは最初のtopだったときの戻り値を確認するテストコードを書きましょう。

top - 13:52:54 up 6 min,  0 users,  load average: 0.01, 0.07, 0.03

これを受け取った時に期待結果は以下です。

["13:52:54", "00:06"]

 

テストコードを書く

続きを読む

ChatGPTを用いたTDD part.3 (TODO実装続き)

ChatGPTを用いたTDD part.3 (TODO実装続き)

ChatGPTを用いたTDD part.2の続きです。

TDDでTODOをこなしていきます。

次はCPUの値を抜き出すところです。

 

  • ChatGPTを用いたTDD part.3 (TODO実装続き)
  • 与えらえた文字列からus、sy、niを抜き出して返す
    • テストコードを書く
    • 最初のテスト実行(レッドの状態)
    • 最短でグリーンになるコードを実装
    • 詳細の実装
    • リファクタリング
  • 与えられた文字列からメモリ使用率を計算して返す
    • テストコードを書く
    • 最初のテスト実行(レッドの状態)
    • 最短でグリーンになるコードを実装
    • 詳細の実装
    • グリーンになるまで修正
    • テストを追加し、グリーンにする

 

与えらえた文字列からus、sy、niを抜き出して返す

与えらえた文字列からus、sy、niを抜き出して返す
    文字列を引数として、us、sy、niを文字列配列にして返す

まずはテストコードを書きます。ChatGPTが。

テストデータは以下として、us,sy,niを抜き出して文字列配列で返すことを目標とします。

%Cpu(s):  16.2 us,  20.3 sy,  5.0 ni,63.5 id,  0.0 wa,  0.0 hi,  0.0 si,  0.0 st

※ChatGPT4.0だとテストコードを書いてもらおうとしてもテストコードを実行しようとするのでChatGPT3.5で書いています。

 

テストコードを書く

続きを読む

ChatGPTを用いたTDD part.2 (最初の実装編)

ChatGPTを用いたTDD part.2 (最初の実装編)

ChatGPTを用いたTDD part.1の続きです。

TDDを実践していきます。

時刻とup_timeを抜き出すTODOからやっていきます。

 

最初に、最後に書いた結果を記載すると

テストの実行結果/エラー文をひたすら与えるとChatGPTはテストを満たすコードを書くことができた

です。

 

  • ChatGPTを用いたTDD part.2 (最初の実装編)
    • 与えられた文字列から時刻とup_timeを抜き出して返す
    • テストコードを書く
    • 最初のテスト実行(レッドの状態)
    • 最短でグリーンになるコードを実装
    • 最初のグリーン
    • 詳細の実装
    • テスト実行
    • リファクタリング
    • リファクタリングとテストを繰り返す
    • おまけ

 

与えられた文字列から時刻とup_timeを抜き出して返す

ファイルの読み込み、csv出力は後にして細かい部品から作ります。

与えられた文字列から時刻とup_timeを抜き出して返す
    文字列を引数として、時刻、up_timeを文字列配列にして返す

TDDなのでまずはテストを作ります。ChatGPTを使います。

テストデータは以下として、この時間とup timeを抜き出して文字列配列で返すことを目標とします。

top - 13:52:54 up 6 min,  0 users,  load average: 0.01, 0.07, 0.03

 

テストコードを書く

続きを読む