docker環境でシステムテストを途中で止めてブラウザで画面を確認する

savanna日報から改変してブログに書く試み

ref: slackのhuddle良さそう - savanna.io

  • Railsがdocker環境でなければheadlessではないchromeを使うのが楽
  • Railsがdocker環境であれば、remote debuggingを有効にする
    • remote-debugging-port=9222
    • remote-debugging-address=0.0.0.0
    • この2つをオプションにつけてheadless chromeを立ち上げる
  • もちろんdocker-compose.ymlで9222ポートにアクセスできるようにしておく必要がある
  • binding.pryなどのブレークポイントをしかけてテストを実行し、ブレークポイントで止まったらおもむろに localhost:9222 にアクセスするとその時の画面が表示できる
  • このとき、テストを実行する環境をdocker-compose runで実行していると表示できない
    • デフォルトだと、たとえdocker-compose.ymlに適切にportsの設定をしてもホスト側からは接続できないという仕様
    • docker-compose upしている状況でdocker-compose runでワンタイムなコマンドを実行するときにportが被ってエラーになる、というのを防ぐため
    • ref: https://github.com/docker/compose/issues/1259
    • docker-compose run --service-ports hogeのようにservice-portsオプションを付けるとホストからつなぐことができる

2024/01/23追記

  • 原因はわからないのですが、現時点では localhost:9222 にアクセスしても真っ白なページが表示されるだけになっています。
  • chrome://inspect/ にアクセスして、↓の Remote Target のinspectリンクをクリックするとデバッグ用の画面に遷移できます。

脆弱性情報をどこまでどうやって共有するのが良いのか

脆弱性が見つかって、対応パッチが入ったgemの新しいバージョンがリリースされるということはよくあります。そういうときに僕は内容を把握して「こういう脆弱性があるので早くバージョン上げましょうね」と各お手伝い先に共有しています。

各お手伝い先にとどまらず、ブログに書いて広く周知したほうがいいのかな…と思いつつしないほうが良い理由もあり、現状では公開しない、を選択しているけどどうするのがいいんでしょうねえ…。

なぜ公開しないのか

  • どれくらい危険な脆弱性なのかわかりやすくするために、具体的な攻撃方法を調査できる範囲でまとめ共有することが多い
  • そのため、これを公開すると悪意を持っている人にとっての便利情報になってしまいそうだなあ…と感じる
  • ので公開をしないという選択をしている
  • しかし公開したほうが良い、という理由も思いつく
    • 本当に悪意を持っている人は僕が公開するまでもなく攻撃情報を自ら得るはず
    • 「これくらい危険な脆弱性なんですよ」というのを周知すると対策を取る企業は増えそう
      • とはいえ基本的にはセキュリティアップデートをする企業はするし、しない企業はしないだろうと思うので公開するメリットをデメリットが上回りそうではある
  • 悪意を持っていない人にだけいい感じに情報を届けられるのがベストなんだけど、だれかいい案ないですかね…

n_plus_one_controlはrequest specで使うのが良いという話とrequest specでログイン後のリクエストを投げるための方法について

savanna.io の日報からの転載。ちゃんと整形したり説明詳しく入れてメインのブログで公開しようと思ってたんだけど時間がなさすぎた

  • palkan/n_plus_one_control: RSpec and Minitest matchers to prevent N+1 queries problem
    • N+1をテストで検出できて便利
    • 実際に同じテストを、DBレコード数だけ変えて複数回実行して発行したクエリ数を比較する
    • クエリ数が違うとN+1では?となりテストを失敗させることができる
  • N+1が起きるのは実際のユーザがアクセスしたときなので、システムスペックでは、と思いそうしていた
  • しかしsystem specだと、ajaxを利用しているページを表示したときにタイミング次第でajaxリクエスト処理時のSQLを計算に入れてしまいテストがコケる
  • 具体的にはturbo-frameで遅延ロードを追加ところこれが発覚したけど、turbo-frameに限らずajax使っているページでは起こり得る
  • 他になんかいい方法あるかな、と考えたがN+1をチェックするところはrequire specを使うのがいいんじゃないか、という結論に達した

request specでログイン後のリクエストを投げる

  • ↑ということでrequest specを久しぶりにちゃんと書こうと思ったらログインどうやるんだっけ?となったのでまとめた

1. allow_any_instance_of

  • 手っ取り早いがハック感ある
before do
  allow_any_instance_of(ApplicationController).to receive(:current_user).and_return(ログインさせたいユーザオブジェクト)
end

2. session

get root_path
session[:user_id] = user.id
get after_login_path
  • これはうまく動かなかった
  • 最初にroot_pathにアクセスしているのは、sessionメソッドが@requestが存在している前提で書かれており、最低一度アクセスしないといけないため
  • 昔はこれで実装していたような記憶がうっすらあるが、Rails5からはできなくなったのかも

3. ログイン用のリクエストを事前に投げる

  • request specもE2Eの一種と考えると、ちゃんとログイン用のリクエストを投げるのがお行儀が良いのでは、という気がする
  • dhhも推奨している方式
  • これはOmniAuthでtwitterログインしている前提
OmniAuth.config.test_mode = true
OmniAuth.config.mock_auth[:twitter] = OmniAuth::AuthHash.new(
  provider: 'twitter',
  uid: idをいれる,
  info: {
    nickname: ユーザ名をいれる
  }
)  
post '/auth/twitter'
follow_redirect! # OmniAuthはリダイレクト後にログインセッションを生成しているのでこれがないとログインできない

type="date"なフォームをcapybara+chromeでテストするには

Docker環境でRubymineを使う

  • Rubymineはコードジャンプがべんり
  • gemのソースコードにもサッとジャンプできる
  • しかしDockerで開発していると、gemのコードはコンテナの中なのでそのままだとジャンプできない
  • これまではやむを得ずホスト側でbundle installとかしてたけど、設定でコンテナ側のgemを参照できるのだった(当たり前)

やり方

Preferences→Languages & Frameworks→Ruby SDK and Gemsで+を選択、New remoteを選択して次のようにして新しい設定を作成し、それを選択してapplyすればOK(appとしているところは各自のrails用コンテナに読み替えてください)

f:id:willnet:20210223142323p:plain

USキーボード環境で英数キーを⌘+スペースに割り当てた

ずっと左コマンドを単体で押したときに英数、右コマンドを単体で押したときにかなとしていたけど、左コマンドキーを押してすぐキーをタイプするとミスってタブを閉じてしまったりなどすることがよくあった。

我慢して使っていたのだけど、だれかのツイートでコマンドとスペースを利用して切り替えるようにした、というのを見かけてこれ良いのでは?となったのでkarabinerの設定を↓のように変えた。左コマンドだけスペースが必要にしてみた。右コマンドは単体でしか押さないので従来どおり。

~/.config/karabiner/karabiner.json を以下のように編集した

               "rules": [
                    {
                        "description": "右コマンドキーを単体で押したときに、かなキーを送信する",
                        "manipulators": [
                            {
                                "from": {
                                    "key_code": "right_command",
                                    "modifiers": {
                                        "optional": [
                                            "any"
                                        ]
                                    }
                                },
                                "parameters": {
                                    "basic.to_if_held_down_threshold_milliseconds": 100
                                },
                                "to": [
                                    {
                                        "key_code": "right_command",
                                        "lazy": true
                                    }
                                ],
                                "to_if_alone": [
                                    {
                                        "key_code": "japanese_kana"
                                    }
                                ],
                                "to_if_held_down": [
                                    {
                                        "key_code": "right_command"
                                    }
                                ],
                                "type": "basic"
                            }
                        ]
                    },
                    {
                        "description": "左コマンドキーとスペースを押したときに英数キーを送信する",
                        "manipulators": [
                            {
                                "from": {
                                    "key_code": "spacebar",
                                    "modifiers": {
                                        "mandatory": [ "left_command" ]
                                    }
                                },
                                "to": [
                                    {
                                        "key_code": "japanese_eisuu"
                                    }
                                ],
                                "type": "basic"
                            }
                        ]
                    }
                ]
            },

追記

右コマンドキーは単純にかなキーに入れ替えたほうが安定したので、結局上記の右コマンドキー側の設定は削除しました。