notebook

都内でWEB系エンジニアやってます。

GoogleCloudのDataformで編集中にショートカットキーでプレビューしたい

先日GoogleCloud版のDataformに移行してねというアナウンスが流れたので重い腰を上げてプライベートのDataformプロジェクトを移行し始めた

色々試していく中で旧版のDataformではCtrl+EnterでSQL実行できたのにな…という気持ちが強くなってきたためさっとブックマークレットを書いた

本当はCtrl+Enterが良かったがどこかでイベントを拾われているのか動いてくれなかったのでAlt+EnterでPreview実行できるようにした

2023-09-10時点ではこれで動くっていうやつ

もしUIが変わったりしたらquerySelectorの指定方法を変える

  • dataform_preview.js
(() => {
  document.addEventListener('keydown', (e) => {
    if (e.altKey && e.key === 'Enter') {
      const btn = document.querySelector('#_0rif_preview-query-button');
      if (btn) {
        btn.click();
      };
    };
  });
})();

これを1行にして先頭にjavascript:をつけてブックマークに追加する

ワンライナーだとこんな感じ

cat dataform_preview.js | sed -e ':loop;N;$!b loop;s/\n/ /g' -e 's/ \+/%20/g' -e 's/^/javascript:/'

keydownイベントで取れるデータを見てみると

altKey,ctrlKey,shiftKey,metaKey(Macのcmd)などあるので、やろうと思えば色々ショートカットを作成できる

  • keydownイベントの中身

結局ショートカットを覚えるコストも掛かるので普段そんなにやらないがDataformのPreviewはどうしても欲しかったのでやってみた

やはり快適

でもできれば本家で機能追加してもらえると嬉しいやつ