長いタイトルですいません。
今回は表記の通り、手元の Windows 10
マシンからVSCode Insider
のSSHリモート
プラグインでUbuntu 18.04
に接続し、リモートのUbuntu上でWebDriverからブラウザを立ち上げ
て、E2Eテスト
を実行したい、ということでございます。
いろいろ紆余曲折がありましたので備忘録として手順を貼っておきます。
Ubuntu での GUI(デスクトップ) ログインをしておく
今回は Ubuntu 上でブラウザを実行させようということですので、あらかじめSSH接続するユーザーでログインし、ロック状態にしておきます。
SSH 接続の確保
まず本作戦の生命線といも言うべき兵站線である Windows 10 からのパスワードなしSSHでUbuntu18.04にログインできるようにする、というのが最重要でございます。(当然ですw)
キーペアの生成
git for windows
のbash
から以下のような感じでパスワードなしのキー生成を行いました。
$ cd ~/.ssh
$ ssh-keygen -t ed25519 -P "" -f vscode.remote.pem -C "myaccount"
生成された公開鍵をscp
などで Ubuntu 側に送信しておきます。
$ scp vscode.remote.pem.pub 192.168.1.xxx:/home/xxxx/
権限の設定
VSCode Insider の SSH プラグインは 手元の git for window
や MinGW64
、WSL
などのことは一切知らないので PowerShell から ssh
コマンドを発行します。
ですので、git for windows
のbash
からchmod
しても効かないのです。。。(´・ω・`)
エクスプローラーからvscode.remote.pem
ファイルのプロパティを開き、所有者以外のユーザーやロールからの書き込み
を拒否
しておきます。
こんな感じです。久々にやるとこのファイルのプロパティ画面の使い方もちょっと変わってて戸惑う。
公開鍵の登録
Ubuntu側でログインし、先ほどの公開鍵を ssh に通知します。パーミッションも所有者のみが参照できるようにしておきます。
$ cat vscode.remote.pem.pub >> .ssh/authorized_keys
$ chmod 600 .ssh/authorized_keys
Ubuntu 18.04 での SSH の設定がデフォルトのままでは公開鍵でのログインができませんので設定を有効にします。
...
PubkeyAuthentication yes # -> コメントアウトを外す
...
sed
コマンドだとこんな感じです。
$ sudo sed -i -e "s/#PubkeyAuthentication/PubkeyAuthentication/g" /etc/ssh/sshd_config
設定ファイルの書き換えが終わったらサービスを再起動しておきます。
$ sudo service sshd restart
Windows 10 からの接続
この Ubuntu へのSSH接続は、指定したユーザーと上記で生成した秘密鍵で常に行うように、Windows 10 側で以下のような設定ファイルを作っておきます。
Host 192.168.1.xxx
HostName 192.168.1.xxx
User xxxxxx
IdentityFile c:\Users\xxxxxx\.ssh\vscode.remote.pem
接続の確認
WindowsのコマンドプロンプトかPowerShellからssh接続できるかテストを行いましょう。
> ssh 192.168.1.xxx
うまくいけばOKです。
パーミッションエラーが出た場合。
パーミッションの設定に不備がある場合は出ますよ~。以下のショッキングなエラーメッセージが。。。
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@ WARNING: UNPROTECTED PRIVATE KEY FILE! @
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
Permissions 0644 for 'vscode.remote.pem' are too open.
It is required that your private key files are NOT accessible by others.
This private key will be ignored.
Load key "vscode.remote.pem": bad permissions
上記の権限設定の手順で権限をチェックしてください。
この辺りはエラーメッセージが不親切だから動けばOKというかトライアンドエラーでご機嫌を伺うことになってしまいますね。。。
VSCode Insider のダウンロードとインストール
VSCode での作業はこちらのページにて丁寧に解説頂いているのでここでは割愛します。
VSCode Insider インストールして Remote Extention Pack プラグインをインストールしてください。
Remote Connection の一覧に上記の 192.168.1.xxx
が表示されていると思います。ここから接続してみましょう!
接続後のターミナルにて
無事に VSCode から Ubuntu 上のプロジェクトが開けたと思います。これだけでもだいぶ満足なんですが、開発サーバーをリモートにするのはいいけど、WebDriver 使ったテストでChrome などのブラウザの立ち上げに失敗しますよね~ということで、VS Code のターミナルにて以下のおまじないをしておきます。
$ export DISPLAY=:0
そうすると、
$ npm run test
などやった時に実行される WebDriver がリモートのUbuntu上でブラウザを立ち上げるようになります。
これでめでたく、手元の Windows 10
マシンからVSCode Insider
のSSHリモート
プラグインでUbuntu 18.04
に接続し、リモートのUbuntu上でWebDriver+Chromeを立ち上げ
て、E2Eテスト
を実行、できるようになりました!