惰性フラペのブログ

だらだら生きてるQAエンジニアの垂れ流し

毎日チャレンジ6日目 Chrome拡張その3 文字数カウント機能とテキストのコピー機能を追加

今日は昨日作ったテスト実施をサポートするChrome拡張に機能追加した。

- 文字数カウント

- 生成したテキストのコピー

をできるようにした。

こんな感じ。

文字数の表示とコピーアイコン

今日は疲れたから詳細は割愛。
というか特に書くこともない。
文字数カウントできるようにしたのと、アイコンからクリップボードにコピーできるようにしただけ。

次は何作ろっかなぁ。

正直もう少しガッツリ楽できる機能を足したい。

テストデータ作成とか久々にやったら面倒だったし、やっぱり単純作業を以下に楽にできるかがポイントだと思う。

GitHub Copilotとかでプログラミング作業は効率化できるのに対して、テストの効率化は思ったほど進んでない感覚がある。

もちろん価値の検証って人間が見ないと判断できない部分が大きいし、テストはプログラミング言語のように統一化されたルールに基づいていないから難しいのだけれど。

なんとかしたい。

毎日チャレンジ5日目 Chrome拡張その2 ダミーテキスト生成

毎日チャレンジと言いながら1週間ぶりになってしまった。反省。

 

引き続きChrome拡張を色々触ってみている。

画像比較や画面の変化を検知できないか色々試してたけど、今の自分にはちょっと難しかったので気分を改めてみた。

今回はダミーテキストを生成できる拡張機能を作った。

github.com

ダミー文字列生成

きっかけは以下の記事。

自分も使ったことあるし、シンプルで使いやすかったな〜という感想。

www.itmedia.co.jp

そして、文字数の生成とか文字数カウントってよく使うけど、わざわざ何かしらのサービスを使う必要ないな〜と思ったので、自分で気軽に使えるように作ってみた。
(悪意のあるサイトだったら情報漏洩のリスクとかあるし)

とりあえず100文字、255文字、500文字、1000文字、2000文字のダミーテキストを生成できるようにした。

文字数は自分がよぅ使うイメージのある文字数を入れた。

明日は任意の文字数で生成できるようにするのと、入力されているテキストの文字数を表示できるようにする。

毎日チャレンジ4日目 画面の差分を検知するChrome拡張(途中)

ちょっと空いてしまったが、Chrome拡張機能を作成中。

github.com

内容としては、テストしている時に画面の変更を検知して教えてくれる拡張として作っている。

作るモチベーションとしては、自分はQAなのに細かい箇所を注意深く確認するのが苦手なので、意図しない細かい変更があった時に気付けないことがある。

画面の変更に関してはある程度機械的に検出して、問題ないかをチェックできればテストしやすいよね、という感じ。

多分余計な変更を検出しまくって、そう簡単にはいかないんだろうな〜とは思う。

けど、とりあえずデータを取って有効な検出とよろしくない検出をラベル付けして、機械学習とかで上手いこと分類できるようになれば有効的に使えそう。

ただそうなると推論にマシンパワーが必要になって拡張機能だけじゃ済まなくなってきそう。

難しい。

今回学んだこと

- Chrome拡張はContent script, Popup, Service workerに分かれて動いている

- Content scriptは画面上のconsoleと同じイメージ

- Popupは拡張機能のアイコンを押した時に出てくるやつで、その中で動いている

- Service workerは昔はbackgroundとか呼ばれてたやつで、Chromeが動いている間は裏で動いているやつ

- それぞれで必要な処理を行い、storageはContent scriptとPopup & Service workerで分かれているらしい(ここは実際に試してない)

- Content script, Popup, Service workerで情報のやりとりが必要なときはonMessageを使う

まだわかってないこと

- service workerでimportしようとするとエラーになるのはなぜか?

 

とりあえず以下などを参考に頑張ってる。

結構楽しいね。

developer.chrome.com

↓で詰まった

qiita.com

毎日チャレンジ 3日目 ページ内の画像を全てフラペチーノにするChrome拡張

2日目で早速毎日チャレンジじゃなくなったけど、そんな時もある。しゃーない。

3日目はChrome拡張を作った。

Chrome拡張はずっと作ってみたかったけど、なんやかんや手が出せなかったので、いい加減手を出してみた。

とりあえずページ内のimgタグによって表示されている画像を全てフラペチーノ画像に置き換える拡張を作った。

https://github.com/frappuccino2316/override-image-to-frappuccino

これが

f:id:frappuccino2316_ja:20240321235155p:image

こうなる。

f:id:frappuccino2316_ja:20240321235215p:image

Chrome拡張を扱う技術は、今までで1番QAエンジニアとしての実務に役に立ちそう感ある。

探索的テストしてる時のログ残したり、記録から不具合の再現条件を探ったりとか、最近の開発スタイルに合ってる動きができるんじゃないかな〜と思ったり。

 

もうちょっと触って磨いてみようかな。

毎日チャレンジ 2日目 Flutterでブロック崩し作成

2日目

とりあえずFlutterでゲームを作る経験をしたかったので、ブロック崩しを作った。

https://github.com/frappuccino2316/demo_brick_breaker

作ったと言っても以下の写経しただけ。

https://codelabs.developers.google.com/codelabs/flutter-flame-brick-breaker#0

 

わかったこと

- Flutterでゲームを作るときはGameWidgetを使う

- Flameという概念がある(Widgetとの違いはまだよくわからない)

- FrameにはWidgetじゃなくてComponentという概念がある(これもわからない)

- 当たり判定とかは専用の機構がある

 

まだあまり深ぼって見れてないが、ゲーム開発ってやっぱりWeb開発とは違うなと感じた。

アクション性があると、業務システムだと意識しない部分の重要度が跳ね上がる。

「面白さ」という品質指標が自分はよく理解できてない。

毎日チャレンジ 1日目

先月28歳になった。

人生単位で考えれば若手かもしれないが、30歳という区切りのような年齢が近づくにつれて焦りを感じるようになった。

仕事に関しても、今のままで30歳になったらマズイという気持ちはあるが、何を変えたらいいのかわからないという、学生から成長していないような焦り方をしてしまっている。

とりあえず何かしようと思ったので、毎日何かしらアウトプットを出して、ブログに書こうと決めた。

三日坊主になりそうだが、一旦やってみよう。

 

# 1日目 FlutterでToDoを作った

https://github.com/frappuccino2316/flutter_todo

とりあえずコードでも書くかと思い、FlutterでToDoアプリを作った。

Flutterにしたのは、アプリ開発については知っておいて損はなさそうだからというのと、以前触ったことがあってある程度環境構築ができていたから。

ToDoアプリを作ったのは、シンプルで何をするかわかりやすくてDartやFlutterについて思い出すには最適だったから。

とりあえず文法やStateの扱いはなんとなく思い出せた。

あとは初めてSQLiteでデータ永続化した気がする。

ChatGPTに聞いたら爆速で実装できた。

いくつか無駄なコードもあるけど。

LLM様々だなぁ。

 

とりあえずしばらくはFlutterでいくつかアプリ作ろうかな。

C++を触ってみるのも中途半端な状態だからどこかで戻りたいけど。