商品バリエーションに「色（color_rgb.value）」と「カラー名の単一テキスト（color_name.value）」の2つのメタフィールドを登録し、色はスウォッチ表示できたが、スウォッチ（カラーバリエーション）をクリックした際に表示されるテキストを、通常のオプション名ではなくメタフィールドのカラー名へ動的に切り替えたいという相談。
現状はLiquidで <span>{{ product.variants[option.position].metafields.color_name.value }}</span> のように表示を試したものの、クリックに追従して更新されず、選択時はメタフィールドではなく標準のオプション名が表示されてしまう。
求めているのは data-tooltip ではなく、画面上の表示テキスト自体を動的に変更する方法。解決策や具体的な実装方法はまだ提示されておらず、議論は未解決のまま。
メタフィールドのバリエーションに色と単一のテキスト、２つを登録しています。
色をスウォッチ表示させることが出来ましたが、色を選択時に動的にカラー名（単一テキスト）を変更させたいと考えています。（data-tooltipではなく）
方法はありますでしょうか。どうぞよろしくお願いいたします。
単一テキスト：color_name.value
色：color_rgb.value
{{ product.variants[option.position].metafields.color_name.value }} ※オプションポジションで表示させましたが、動的に変更されません。（クリックするとメタフィールドではなく通常のオプション名が表示されてしまいます。）