無職です。はたらいてます。 旧ブログ: 1 Entry per Day

CircleCIの実行時間を3分の2くらいにした、というLTをした


CircleCIのLT会で、会社のCIをどうやって早くしたのかというLTをしてきました。 一人で全部やったわけじゃありませんが、なかなか早くなって満足している一方、もう少し余地がありそうだなとか思ってます。

増枠: CircleCI ユーザーコミュニティミートアップ 【LT会】 - connpass https://circleci.connpass.com/event/140666/

社内のKibelaには、これにどういう意味があって、エンジニアにはこういう良い影響があるんだ、というポエムを書いたんですが、そっちで満足したので自分のblogはあっさりにしておきます。

FACTFULNESSを読んだ雑感想

FACTFULNESS(ファクトフルネス) 10の思い込みを乗り越え、データを基に世界を正しく見る習慣

FACTFULNESS(ファクトフルネス) 10の思い込みを乗り越え、データを基に世界を正しく見る習慣

とても良かった。

知識がある人ほど先入観で物事を判断してしまう、何故人は思い込みをしてしまうのか、思い込みを解消するにはどうしたら良いか、という解説を丁寧にしてくれる本。 著者の実体験を口語調で書いているので、読みやすい。

エンジニアにもオススメ。

データを読むとき、何も考えず平均値みるんじゃなく中央値とか最頻値とかが大事だぞ、という話とか地味に大事だと思ったり。 病気の感染拡大を防ぐために道路封鎖したら物流が止まり食糧難になり別の犠牲者を出してしまったというエピソードは、規模は比べるべくもないが、動いているシステムに手を入れることがおおいエンジニアに身につまされるものがあった。

C96戦利品

C96に行って技術書漁ってきました。

f:id:mstssk:20190812180826j:plain

Hello world カルタ

いろいろなプログラミング言語Hello worldでカルタするやつ。マストバイ。

helloworldkaruta.mystrikingly.com

妄想実行報告書

サークル妄想実行部隊さんのごった煮本。 Vue,VuexアンチパターンとかGitHub Actionsの章が目当てで購入。

booth.pm

Firestore Mastery

Firestore童貞なので買ってみた。

shiodaifuku.io

hifumiフルセット

自作キーボード初心者キット的なやつ。

riconken.bitbucket.io


会場脱出してからてくぶ買ってない事に気がついた。

GitHubリポジトリをAWS CodeBuildでビルドするためBotアカウントで連携したらハマった

GitHubリポジトリAWS CodeBuildでビルドするためBotアカウントで連携したらハマってしまった。

TL;DR

  • GitHubアカウントに対象のリポジトリの管理権限がないとWebhook設定をできないのでエラーになる

以下、凡ミスを自戒のために書き残します。

GitHubリポジトリAWS CodeBuildでCI回そうと考え設定しょうとしました。

はじめはCodeBuildからそのまま個人のGitHubアカウントでOAuth接続して弄っていました。しかし、それだとそのAWSアカウントが扱える他の開発者が、GitHubアカウントが権限のある他のOrganizationのリポジトリなどまで見えるようになってしまいます。 そこで、OAuth接続するGitHubアカウントは開発チーム共用のBotアカウントを使うことにしました。

改めて、Botアカウントを使いOAuth接続し、対象のGitHubリポジトリを選択します。 そして設定を保存しようとすると以下のエラーメッセージが表示されました。

repository not found or permission denied.

「なんでやねん。リポジトリは見えてるんだから権限ないっちゅーことはないやろ!」と東北出身の癖にエセ関西弁で驚き、小一時間悩みました。 先輩に相談しつつ弄っているとWebhookの設定のチェックを入れているときだけエラーメッセージが出ることに気が付きました。

そこでやっとBotアカウントの権限は最小限にしてあり、リポジトリの管理権限がないのでWebhook設定ができず permission denied. と言っていることに気が付きました。

Safariでinput要素にbackground:none;を指定しつつcolorで一定より薄い文字色を指定すると完全に文字が消える

雑なメモ

Safari 12で再現。PCもモバイルも。

再現のStackBlitz stackblitz.com

chrome 75 safari 12
chrome safari

あるUIフレームワークをつかっていて、inputのdisabled時のcolorを指定していたら発生してびっくりした。 UIフレームワークのdisabled時のスタイル指定がなかったので、仮に color: #ccc; を当てていたら偶然踏み抜いた不具合のようななにか。 UIフレームワークのバージョンアップで既にこのcolor指定は不要になっていたので記述をcssから取り除いて事なきを得た。

どうもinput要素にbackground:none;を指定している状態でcolorを設定したときは発色が普通より薄く表示されているような感じ。

対処案

  • 問題が発生するcss記述を削除する
  • color 指定をもっと濃い色にする
  • Appleに泣きつく

SPAでvideo要素とsource要素を組み合わせるときに気をつけること

video要素を使うときにsource要素を使って動画リソースを指定する場合、source要素の生成タイミングに気を使う必要があります。

例えば、Vue.js で動画リソースのvideoUrl という変数をHTMLテンプレートにバインディングなら下のHTMLように書きます。

<video>
    <source :src="videoUrl" >
</video>

この書き方だと、video要素とsource要素は最初から書き出されます。 しかし、src属性は videoUrl に値が設定された後に追加されるので、空のsource要素となってしまっている瞬間がありえます。 ちゃんと仕様を調べたわけではないのですが、どうやら既に存在しているsource要素のsrc属性が後から変更されてもvideo要素のリソースとしては読み込んでくれません。

こういう場合、とりあえずはsource要素も videoUrl を設定するタイミングで新たに書き出してあげる挙動にしておけばよいようです。

<video>
    <source v-if="videoUrl" :src="videoUrl" >
</video>

もっとも、このくらい単純な実装の場合、source要素を使わずにvideo要素に直接src属性を書いてもいいのですけど。

CIをスキップするコミットメッセージをよく間違えるのでcommitフックでチェックする

CIサービスを使っていて「このコミットはドキュメント変えただけだからCI走らせなくていいや」みたいない場合、コミットメッセージに[ci skip]と含めてあげると、CI実行をスキップしてくれます。

ただ、このマジックワードをうろ覚えなので、いつもskip-ciとか微妙にミスった内容でコミットしてしまうことがありました。

なので、gitのコミットフックでチェックしてみます。

以下の内容で .git/hooks/commit-msg というファイルを用意してあげればフックが動きます。ファイルに実行権限を付け忘れないように注意。

#!/usr/bin/env node

// Check typo for "[ci skip]".
// FYI: https://srz-zumix.blogspot.com/2018/03/ci-ci-20183.html
const fs = require("fs");
const msg = fs.readFileSync(process.argv[2], { encoding: "utf8" });
const regexp = /\[?(skip[\s-]ci|ci[\s-]skip)\]?/gmi;
const expected = ["[ci skip]", "[skip ci]"];
const matched = msg.match(regexp);
if (matched && matched.length > 0 && !expected.includes(matched[0])) {
  console.error("Not commited!");
  console.error(`Use "[ci skip]" instead of "${matched[0]}", because it's wrong or not generaly.`);
  process.exit(1);
}

正規表現でそれっぽい文字列を引っ掛けて、各CIサービスで対応しているマジックワード[ci skip] または [skip ci])ではなかったらエラー扱いでコミットさせません。

慣れているJavaScriptで書くためにNode.jsで実行するスクリプトにしましたが、普通のshやRubyとかPearlとか好きな言語で書いてもいいと思います。

参考