TypeScriptで特定のプロパティがユニオンの全要素を持つオブジェクト配列の検出

まず初めにこちらの記事を目にしました。

qiita.com

ユニオンの全要素を満たす配列の検出ができるなら、 プロパティにユニオン値をもつオブジェクト配列に対しても、同じようなことができないかと考えました。

今回の例ではプロパティに Fruit のユニオンを持たせて、FruitInfo型でFruitそれぞれに対しての情報を定義したいとします。

type Fruit = 'apple' | 'orange' | 'banana';
type FruitInfo = {
    fruit: Fruit;
    stock: number;
    isDisplay: boolean;
}

no-floating-promises への対処

typescript-eslint に怒られました。

no-floating-promises は Promiseを返す関数について await, then, catch もしくは finally で処理しておくべきというルールです。 これは await 忘れや Promise の処理忘れを発見してくれるのに役立ちます。

イベントリスナーでの非同期関数

実装してるポイントはイベントリスナーの内部であり、Promiseも返り値が void で何もありません。 このコードでは待つ必要が無いため、意図的に追加処理は省いていました。 lintで指摘されたのはこの部分です。

addListener(() => { 
    if (conditionA) {
      voidPromise1(); // <-- error
    } else if (conditionB){
      voidPromise2(); // <-- error
    } else if ...
});

CIE L*c*h* を RGB に変換したい

Rainmeter で CIELCH を扱いたいという理由で、CIELCHからRGBへの変換を Luaで実装したというものです。 ちなみに Rainmeter ではRGB値しか扱えません。

CIE L*c*h* (CIELCH) とは CIE L*a*b* (CIELAB) 空間を極座標で表したものです。RGB と HSL のような関係と言ったほうがわかりやすいでしょうか。なので本質は CIE L*a*b* 色空間 になります。

CIE L*a*b* は人が知覚する色の感度と座標距離が比較的一致するように定義した色空間です。 グラデーションなどで HSV や HSL を利用すると、同じ距離のRGB値でも人が知覚する実際の明るさは色によって差があります。

上：HSLによるグラデーション 　下：CIELCHによるグラデーション

知覚的な明るさを合わせた色を配置することで、より滑らかな配色を実現できるツールになります。

Chrome拡張機能で起きるメッセージングエラー

Chrome拡張機能の開発において、バックグラウンドとコンテンツスクリプト間のやりとり等は Web Extensions API をベースとした Chrome Extensions API のメッセージングを利用したものです。その際に起こり得る2つのエラーを詳細と共にまとめます。 他の記事ではこれを書いておけば回避できるようなものしか見つけられなかったので、 これらのエラーがどのように起きるかを調査しました。

Unity WebGLビルドの問題について（ホスティングとサウンド）

この記事では バージョン 2020.2.0f1 において書いています。

Unityで制作したアプリをWebGLアプリとしてビルドして、実際にテストしたときにかなりハマりそうな部分に出会いました。ここでは大きくWebGLビルドで発生した２つの問題の紹介と対策を書くことにします。