パルカワ2

PerlとRubyとイチャラブ

finickyを使い始めた

こういうツイートをした。

家用アカウントで会社のGCPにアクセスするとエラーになるので、毎回右上のアカウント切り替えで切り替えてるんだけど、めんどくさいな〜という話。

色々と教えてもらった。みなさん、ありがとうございます!

そのなかで、まさにこれがほしかったという感じのを教えてもらった。

リンクをクリックした時にURLなどで開くブラウザを変えたり、URLを書き換えたりできるアプリたち。

finickyが、JSで設定できるのでUIでポチポチやらなくてよさそうなので使うことにした。
UIポチポチが苦手なんです

Consoleがあるのでテストしやすい。
ドキュメントもあるので書きやすい
Configuration · johnste/finicky Wiki · GitHub

ただ設定ファイルを書き換えたあとにリロードされるときとされないときがあったり、実際にSlackからテストするとConsoleが消えたりとそういうのは不便だった。

実際の設定ファイルはこれ

module.exports = {
  defaultBrowser: "Google Chrome",
  rewrite: [
    {
      match: ({url}) => url.host.includes(".google.com") && (url.search.includes("project=stailer") || url.search.includes("project=tabely")),
      url: ({url}) => {
          return {
              ...url,
              search: url.search + "&authuser=1"
          }
      }
    },
  ],
  handlers: [
  ]
};

これでSlackにアラートがきたときにGCPのリンクをクリックするだけで会社用アカウントで開くようにできた。
いつもエラー画面を見て「めんどくせ〜」と思っていたので助かる。

enableFlutterDriverExtension() を使用するとキーボードがでなくなる

api.flutter.dev

native_webviewのテストのために example/lib/main.dartenableFlutterDriverExtension() を有効にしていたのだけど、example アプリをビルドしてみるとキーボードが出なかった。普通にアプリに組み込むとキーボードは出るのでなんで?と思って原因を探してみたらenableFlutterDriverExtension()がないときはキーボードが出た。

native_webviewの場合は、exampleアプリのコードには依存していないので、flutter drive用に別のmain.dartを作って解決

The keyboard is not displayed in the example application. by hisaichi5518 · Pull Request #45 · hisaichi5518/native_webview · GitHub

FlutterでWebViewをがんばる その2

github.com

FlutterでWebViewを扱うために webview_flutter を使って、flutter_inappwebviewを使ってきたが、結局native_webviewというライブラリを自分で作り始めた。

webview_flutterもflutter_inappwebviewもどちらとも良い面があるので採用してきたのだけど、不満もあった。

webview_flutterの不満は、必要な機能が足りていないこと。足りないのであれば自分でforkしてプルリクすればいいのだけど、結構放置されているプルリクが多くリリースまでに間に合いそうにないなと感じた。また機能が少ない分実装はシンプルなのだけど、Objective-CJavaで実装されていて、自分でforkしてそれを継続的にメンテナンスしていくのは大変だなという印象だった。

flutter_inappwebviewの不満は、現状メンテンスが行われていないこと。また色んな機能があるため僕自身が使っていない部分が多く、自分でforkしてメンテナンスしていくのは大変そうで嫌だった。またCIでテストが実行されていないからか、結構バグってるなという印象だった(数ヶ月前はイシューを書けば反応があったので良かったんだけど、今は反応がなくなってしまった…) あとflutter_inappwebviewをforkして出されたプルリクをマージしてるリポジトリもあるのだけど、テストがなかったり動かなくなるようなプルリクもマージしていてちょっとやだなあという印象だったので使わなかった。

native_webviewの利点

僕が気づいているwebivew_flutterやinappwebviewにあるバグはなるべく直して、テストがありCIでもテストを動かしている。

Fix HTTPCookie.secure by xtyxtyx · Pull Request #311 · pichillilorenzo/flutter_inappwebview · GitHub

これはそのまま対応してある

NPE when window.prompt · Issue #261 · pichillilorenzo/flutter_inappwebview · GitHub

これはwindow.promptだけ起きることではないようで、使ってないページでも再現することがあった。つまり、時々ページを開くとアプリがクラッシュすることがある。

これの原因はAndroid WebViewを作るときにActivity contextを使っているから起きている。Presentation contextを使うと起きなくなるがPresentation contextを使うと以下の問題が起きる。

webview_flutter crash with HTML dropdown · Issue #34248 · flutter/flutter · GitHub

inappwebviewと違い、webview_flutterはAndroid WebViewをつくるときにPresentation contextを使っているのだが、Presentation contextを使っているとDropdownをタップするとアプリがクラッシュする。 inappwebviewのようにActivity contextを渡していると起きないのだが、すでに書いたようにページを開くと時々アプリがクラッシュすることがある。

これをどうにかするには、flutter/engine側の修正(Fix AlertDialogs built by platform views by amirh · Pull Request #17511 · flutter/engine · GitHub) がリリースされるのを待つか自分でContextをラップするしかない。native_webviewはContextをラップしたので現在のFlutter stableでも再現しない。

TypeError: Promise._immediateFn is not a function. · Issue #288 · pichillilorenzo/flutter_inappwebview · GitHub

これは、inappwebviewが自動でJavaScriptを実行しているゆえの問題でnative_webviewはJSを自動で読み込むことをほぼしないのでこういうことは起きない。またテストもCIで動かしているので起きたとしても多分わかる。

iOSの実機で一瞬画面が暗くなる

背景色が指定されていないのが原因

Androidの実機で一瞬画面が暗くなることがある

コメントによるとPlatformViewで使っているVirtualDisplayのバグっぽい。どうしようもないので、native_webviewではライブラリ側で対処するようにした。

google_maps_flutter I am getting black screen before loading maps · Issue #39797 · flutter/flutter · GitHub

Android V2 embedding対応

inappwebviewはAndroid V2 embeddingを使うとクラッシュする。native_webviewはAndroid V2 embedding対応している

Causes the app to crash on Android Emulator · Issue #327 · pichillilorenzo/flutter_inappwebview · GitHub

逆にいうとnative_webviewはV1にあえて対応してないので、V1を使ってるアプリはV2に移行しましょう。

native_webview のだめなところ

これはあえてそうしているのだけど、新しめのバージョンでしか動かない。

例えばAndroid 7以上でしか動かない。ぼくが作ってるアプリの要件がAndroid 7以上で、それ未満に対応する意味がないからというのとAndroidはOSのバージョンによってChromeに同梱されたWebViewが使われたり、Android WebView Systemが使われたりと実行環境が変わるので、なるべくそういう違いを少なくしたかった。(Android 10でまた変わったのだけど……)

また自分に必要な機能しかいれていないので、inappwebviewと比べるとまだまだ機能は少ない。JSに依存しないで実現できるものは、対応していく予定

まとめ

webview_flutter, flutter_inappwebviewと使ってきたが、結局自分で作り始めた。webview_flutterやinappwebviewのイシューを見ていると大変だな………という感じなのですが、まあがんばります。

自分の作業環境 2020

おうち大好きマンなので、3年前くらいに今の家に引っ越してから作業環境を整えている。 自宅で働くことが増えて整えてきてよかったと思っているので、現状を書き出しておく。10年後とかに見たら面白いのではないか。2030年……41歳………

ぬいぐるみ

hobby.dengeki.com

これのクッキーモンスターを抱きしめながら働くとかなりいいんですが、いま転売品しか買えないので別のぬいぐるみを買いましょう。

Mac

つよいMacだとビルドが早くてよい。

  機種名: MacBook Pro
  機種ID: MacBookPro14,3
  プロセッサ名:   Quad-Core Intel Core i7
  プロセッサ速度:    3.1 GHz
  プロセッサの個数: 1
  コアの総数:  4
  二次キャッシュ(コア単位):  256 KB
  三次キャッシュ:    8 MB
  ハイパー・スレッディング・テクノロジ:   有効
  メモリ:    16 GB

買ってからすでに2年経っている+会社のiMacはメモリがもっと多いので新しくしたい。

クラムシェルモードで使っているので立てて置くやつがある。

机・椅子

イタリア製 fantoni/ファントーニ パソコンデスク GT 幅140 奥行71 高さ72cm テレワーク 在宅 の通販 | デスク | ガラージ 【 Garage 】

机は、でかくて重いのがよい。軽い机は揺れたりするし、狭いと雑にものを置けない。 また奥行きがあると書類を片すときとかご飯を食べるときなど、ディスプレイを使わないときは奥に寄せておけるので便利。

買った当時は立つと疲れるし疲れることはしない主義だったので昇降デスクは買わなかったけど、今は30もすぎたし健康に気を使う必要が出てきて買ってもよかったかもと思ってる。

中古の美品を4万くらいで買った。追加で新品のヘッドレストも買った。 ヘッドレストはなくてもいいけど、あると疲れたときに首をおけて楽なので買ってよかったと思ってる。 ヘッドレストだけ新品で買ったのは、中古で売ってなかったから。

バロンチェアを選んだのは、前の会社で使ってよかったからで色々と座り比べたりとかはしてない。

ディスプレイ・ディスプレイアーム

EIZOは高いなという印象なのだけど、サポートは丁寧だし保証も5年と長いし安心感がある。 前はDellのディスプレイを3年ほど使っていたのだけど、電源がつくまでが遅くて待つ時間が嫌だったけどEIZOにしてからあんまり感じない。 あと会社で使ってるiMacと比べて目の疲れも少ないように感じる。 Type-C1本あれば充電もモニターに写すのも同時にできるんだけど、ディスプレイの電源を切ると充電されなくなるのがつらい。 後述するディスプレイアームを使えばディスプレイのコードは見えないところにまとめられるので、僕はType-Cを使わずDisplayPortを使っている。

27インチを買った理由は、32インチが大きくて逆に使いにくいなと思ったからで、好き嫌いあると思う。 僕は色んなリポジトリを触るので、IDEをたくさん立ち上げることが多く切り替えがめんどうだとは思っている。

Macbook Proは閉じてクラムシェルモードで使っているので、ディスプレイは使ってない。

人によって座高は違うので、自分に合わせやすいディスプレイアームほしい〜と思って誰か買って〜〜とツイートしたら本当に買ってもらえた。(どういうこと?)

アームの中にコードを入れれるやつだとコードがまとめやすいので机がごちゃつかない。あと家でISUCON予選に参加するときに人に見せやすいという利点がある。

マウス・キーボード

大きさが自分の手に合う。カーソルを動かすために手首を動かす必要がない。斜めになっているので手がかなり楽。 前はロジクールロジクール ワイヤレスマウス トラックボール 無線 SW-M570 Unifying 5ボタン トラックボールマウス 電池寿命最大18ケ月 国内正規品 1年間無償保証を使っていたんだけど、思い切って乗り換えたらめちゃくちゃよかった。会社もこれ。

BT買おうかな〜と思いつつも、コードがなくなる以外のメリットが特にないので、今使ってるのが壊れるまではまだいいかなと思ってる。 吸振マットは必須ではないけどつけてる。会社にもある。

手首が貧弱なのか、ないとめっちゃしんどい。会社にもある。

ヘッドホン・スピーカー

換気扇とか洗濯機とかルンバとかってかなりうるさいのであってよかった。 あとノイズキャンセリングがあるヘッドホンをつけると一気に静かになるので集中できる。

ただ重いのとこれからの季節は汗でべたつきやすいという問題がある。 おじさんゆえにヘッドホンが臭くなるのは避けたいので洗えるカバーであるmimimamoをつけている。ちょっと耳が抑えられる感じがあってしんどいが臭いよりはマシと思って我慢してる。

AirPods Proに置き換えるかも。

ヘッドホンつけてて疲れた!!!!ってときに使ってる。大きめのスピーカーを持っていたけど、必要ないなと思ってSonyの小さいのに変えた。ケーブル1本で動くので机の上がさっぱりして便利

ライト

調光・調色できるのを買った。目に優しい

Nature Remo + Google Home Nest mini

夜になったら部屋の明かりを自動で暖色にしたりする。 音声で操作をやる前は、声を出す方がしんどいと思っていたのだけど、そんなことはなかった。

コーヒーメーカー

以下で書いた。

hisaichi5518.hatenablog.jp

マッサージ

定期的に整体に行ってたんだけど、自分でどうにかできんかな〜と思って買った。 整体に行くほうが楽になるんだけど、ないよりマシという感じ

整体とか、意味や効果に対してのエビデンスがあるのかと言われると正直知らないんだけど、やらないよりやったほうが僕はマシになるのでやってる。

買ってないもの

マイク

必要にかられてないので買ってない。 Mac内蔵はさすがによくないかなと思うので、ヘッドホンについてるのを使ってる。音質の確認とかはしてないので、聞き取りにくいとかあるかも。 仕事でSlack callを使ってしゃべるのはよくあるので、1,2万のを買うかもしれない。そしたらアームが欲しくなって3,4万…………うーん、まだいいかな!

参考: 全社リモートワークになったので通話のプラクティスを考えた | ishkawa

カメラ

必要にかられてないので買ってない。

まとめ

快適に過ごしていくぞ!

コーヒーメーカー買った

今まで会社に行く前にコンビニに寄ってコーヒーを買って出社するというのがルーチンになっていたのだけど、新型コロナウイルス感染症の影響で自宅で働くようになってからコンビニまでコーヒーを買いに行くのがめんどくさくなってしまった。

なので、家でコーヒーをいれるようにするか〜と思ったのだけど、寝起きに手で淹れる元気もないのでコーヒーメーカーを買おうと思った。ナイスカットミルという自動で豆を挽くやつは持ってるので、普通のコーヒーメーカーでもいいかなーとも思ったのだけど、昔コーヒーメーカーを持ってる時に豆を挽いてからコーヒーメーカーに移すというのが案外めんどくさいと思っていたのを思い出したので、全自動のコーヒーメーカーを買うかという気持ちになっていたのであった。

豆を挽いてそのままコーヒーを淹れてくれるコーヒーメーカーと考えるとかなり絞られて、掃除しやすそうな象印のコーヒーメーカーを買おうかなあと思っていた。

コーヒーメーカー "珈琲通" EC-RS40|コーヒーメーカー|商品情報 | 象印

ただコーヒーメーカー全般に言えることだけど、コーヒーメーカー自体が大きいのでひとり暮らしの家には置く場所が悩ましく、買うまでには至っていなかった。そのときに教えてもらったのがネスプレッソのコーヒーメーカー

サイズ感をヨドバシカメラに見に行ってみたところ、案外小さかったのと担当のネスプレッソおばちゃんが色々と一生懸命教えてくれてコーヒー面白いな〜と思えたので買った。
カプセル式で正直なところ味が不安だったんだけど、試飲してみたところ普通にうまかった。コーヒーの種類は29種類くらいあっていろんな味が楽しめるし、29種類くらいなら全部頼んでみて最終的に好きなの選べばいいなとも思う。
今回買ったコーヒーメーカーだと作れる量が少ないのがネックなのだけど、冷めてまずくなるよりはいいかと思っている。

Cirrus CI使い始めた

cirrus-ci.org

最近OSSでFlutterでWebViewを表示するプラグインを書いていて、AndroidエミュレータiOSシミュレータを利用してそれぞれのプラットフォームでテスト(flutter drive)を動かしたいという欲求があった。 最初は、iOSの実装だけやっていたので使ったことのあるBitriseを利用して動かしていたのだけど、Androidのテストを動かそうとしたら無料では2種類のワークフローを動かすことはできないっぽいのと1ビルド10分制限が厳しいなという感じだった。

業務で利用しているCircleCIは、iOSをビルドするのにお金を払う必要があり、お金払うかなぁと思っていたところ、FlutterがCirrus CIを使っていたので、僕も使ってみることにした。

シンプルでほしい機能があり制限も緩いので、ほんまに無料でええんか?という感じ

tmux 3.0a にする

tmux 2.8からアップデートでもするか〜と思ってした。 どうせ動かなくなるだろと思って雑にupgradeしたら動かなくなった。ガッハッハ

-fg みたいなのが廃止されて、-styleになったらしい

/Users/hisaichi5518/.tmux.conf:11: invalid option: pane-active-border-fg   [0/0]
/Users/hisaichi5518/.tmux.conf:12: invalid option: pane-active-border-bg
/Users/hisaichi5518/.tmux.conf:14: invalid option: mode-bg
/Users/hisaichi5518/.tmux.conf:15: invalid option: mode-fg
/Users/hisaichi5518/.tmux.conf:16: invalid option: window-status-bg
/Users/hisaichi5518/.tmux.conf:17: invalid option: window-status-fg
/Users/hisaichi5518/.tmux.conf:18: invalid option: window-status-current-bg
/Users/hisaichi5518/.tmux.conf:19: invalid option: window-status-current-fg
/Users/hisaichi5518/.tmux.conf:20: invalid option: window-status-current-attr
/Users/hisaichi5518/.tmux.conf:24: invalid option: pane-border-fg
/Users/hisaichi5518/.tmux.conf:25: invalid option: pane-active-border-fg

以下を見ながらなおした http://man7.org/linux/man-pages/man1/tmux.1.html http://man7.org/linux/man-pages/man1/tmux.1.html#STYLES