WebDriverIO で 複数のモディファイアキーを押して離すコード

プロジェクトで Ctrl + Alt + Shift + X を押す機能のE2Eテストを書くときに困ったのでメモ。

キーイベントを送るには keys() を使う。そこまでは変わらない。

webdriver.io

しかし、素直に browser.keys(['Control', 'Alt', 'Shift', 'KeyX']); とするとモディファイアキーが押しっぱなしになってしまい、意図した動作とならなかった。

これを解決するには、以下のように末尾にNULLを追加する。

browser.keys(['Control', 'Alt', 'Shift', 'KeyX', 'NULL']);

これで、最後には全キーを離した状態になるようになった。

Selenium実践入門 ―― 自動化による継続的なブラウザテスト (WEB+DB PRESS plus)

実践 Selenium WebDriver

エキスパートが教えるSelenium最前線 (CodeZine Digital First)

Angular + Sentry でやたらとUpdateが走る現象を解決する

Angular + Sentry 環境でやたらと Update （ツリーの更新）が走る現象を指摘されたところ、 微妙な問題があったので解決した。

どうやら zone.js と Sentry の Breadcrumb の両方で console.log() を置き換えようとしているのがいろいろまずいらしい（斜め読み）。

github.com

これについてエレガントな解決方法はどうやら観測範囲には見当たらないそうなので、シンプルにSentryのBreadcrumbを停止させた。

Sentry.init({
    dsn: (DSN),
    integrations: [
        // console.*() の置換に起因してChange Detectionが連発するので
        // Breadcrumb を諦めて console.*() の置換をやめる
        // Ref.
        // https://github.com/getsentry/sentry-javascript/issues/1883
        // https://docs.sentry.io/platforms/javascript/default-integrations/#breadcrumbs
        new Sentry.Integrations.Breadcrumbs({ console: false }),
    ],
});

これで現象は収まった。

Angularアプリケーションプログラミング

AngularによるモダンWeb開発 基礎編 第2版

Angular Webアプリ開発 スタートブック

Angular + Sentry で、 ErrorHandler から console.log() を呼び出すときの落とし穴

あんまりないと思うのだが、Angular と Sentry (Ravenではなく) を同時に使っているとき、ErrorHandler で Sentry にエラーを送ると同時に console.log() にエラー内容を出したいことがあるかもしれない（うちのプロジェクトではなぜかある）。

しかし、そのまま console.log() するとまずいことが起きたので、回避方法をここに書いておく。

発生したまずいこと、というのは再帰呼出しで、ブラウザの制限を食いつぶすまで再帰呼び出しが続いていたようだ。

これを回避するには、以下のようにする。

import { consoleSandbox } from '@sentry/utils/misc';

class MyErrorHandler extends ErrorHandler {

    handleError(err: any) {
         consoleSandbox(() => {
              console.error(err.originalError || err);
         });
    }
}

これで再帰呼び出しは起こらないようになった。

Angularアプリケーションプログラミング

Angularデベロッパーズガイド 高速かつ堅牢に動作するフロントエンドフレームワーク