CSS疑似クラス:visitedのプロパティcolorは取得することができません。
なぜなら、リンク先の色を取得すると、そのリンク先を訪れたことがあるかどうかを識別できてしまうからです。
<a id="hoge" href="https://example.com/">リンク</a>
<style type="text/css">
a { color:red; }
a:visited { color:green; }
</style>
const style = window.getComputedStyle(document.querySelector("#hoge"));
console.log(style.color); // red
このgetComputedStyle().colorは、リンク先を訪れたことがあるか否かに関わらず、必ず『未訪問』の色になります。
色だけでなく、訪問済か否かを識別可能なあらゆる情報は取得不可能です。
実は2010年ごろまではリンク色を取得することが可能で、そのためトラッキングやターゲティング広告に悪用されていました。
これが問題視された結果、Firefoxを皮切りにChrome・Safariもリンク先が訪問済か否かをJavaScriptから取得できないように改修されました。
現在では、リンク先を訪問したかどうかを一般的な方法では調べることはできません。
とはいえこれらの対策は場当たり的なものであったため、先日根本的な解決策としてPartitioning :visited links historyという対応が行われました。
詳しくは先日解説を書いたのでそちらを見てください。
簡単にまとめると、自分のサイトからリンクを踏んだときは自分のサイトからのリンクが訪問済になるけど、別のサイトからリンクを踏んだとしても自分のサイトからのリンクは訪問済にならない、というものです。
この対応によって、訪問済か否かの情報はセキュリティ上の問題ではなくなりました。
つまり、プロパティの取得を制限する意味がなくなるのでは？
ということでgetComputedStyle() returns true visited colorsという提案がなされました。
getComputedStyle() returns true visited colors
getComputedStyle()がリンクについて未訪問の色を返すという特別なルールを削除します。
互換性の理由から、:visitedセレクタで許可されるプロパティは引き続き制限されたままです。
本提案は、getComputedStyle()が返す値だけについての変更です。
Motivation
Partitioning :visited links historyの対応によって、:visitedリンクの色にセキュリティ上の問題はなくなりました。
従って、getComputedStyle()が返す色の特別なルールを削除します。
ロードマップ
いまのところ、どのバージョンでリリースされるかは未定です。
他ブラウザの反応
Firefoxはポジティブです。
この変更によって、流出するプライバシーやセキュリティ情報が増えることはないからです。
Safariは無反応です。
そもそもPartitioning :visited links historyもまだですからね。
そちらに対応した後で対応されるのではないかと思います。
感想
現在、a hrefについてはほとんどのプロパティを設定・取得することができません。
設定可能なのはcolor・background-colorといった色要素だけであり、heightやfont-sizeといった大きさなどの要素は一切の操作ができません。
つまり、たとえば訪問済のリンクは小さくするとかその他の装飾などを行うことができず、レイアウト上の制約になっていました。
しかしリンクによるセキュリティ上の問題が解消したため、これらを制限する合理的な理由がなくなりました。
今回は色の取得だけの対応でしたが、もしかしたら今後、他のプロパティの取得および設定も可能になっていくかもしれませんね。