QA Wolf を使ってブラウザテストしてみる

QA Wolf ブラウザテストを作成 、実行できるツールです。 https://www.qawolf.com/ ブラウザ操作からリアルタイムで Jest のテストコードを作成してくれるのが特徴で、ブラウザの自動操作には Playwright が使われています。 github.com この記事では QA Wol…

typescript-plugin-styled-components 導入メモ

Styled Components を適用したコンポーネントは sc- からはじまるクラス名が HTML に付与されます。 どこで定義されているコンポーネントなのか確認したいとき、そのままだとちょっとわかりにくいです。 React Dev tool から確認してもコンポーネント名は表…

Jest Styled Components メモ

Styled components を使ったコンポーネントをテストする場合、どのスタイルが変更されたかの検知はできません。 例えば、下のような styled components で作成されたボタンを Jest の snapshot 機能 + react-testing-library でテストすることを考えてみます…

WebStorm で command + shift + A 押下時に apropos window を表示されないようにする

結論 ショートカットキーを変える 起きていたこと ある時から WebStorm で Find Action のショートカット(command + shift + A) を押すたびに apropos ~ みたいなウィンドウが出るようになってしまいました… ターミナルがこのウィンドウを出してるっぽいとい…

Magic Trackpad 2 買ってみた

なるほど。 pic.twitter.com/1BtvW0UREz— つるすけ (@turusuke) 2019年12月6日 Magic Trackpad 2 を買いました。 普段のお仕事は Macbook Pro + 外部ディスプレイに接続して作業しています。 カーソル移動はキーボード下のトラックパッドで行っているのです…

taiko を使って Chrome を操作する

taiko? Taiko, free and open source browser automation Chrome を Node.js から扱うことができるブラウザ操作を自動化するためのツール taiko と puppeteer の違い 同じように Node.js から Chrome 操作できるツールで puppeteer がある puppteteer の場合…

yarn をインストールする際に node.js をインストールさせない

$ brew install yarn をすると、Homebrew 以外(ex.nodenv, nodebrew)で node.js を管理していても /usr/local/bin へ node.js をインストールします。 これは yarn が node.js を依存パッケージとして指定しているからです。 yarn — Homebrew Formulae Homeb…