Chromeの閲覧履歴を敢えて一括でチェックONにするブックマークレットなど

2021-06-08

GoogleChrome

概要とか

昨今のブラウザ(ここではChromeが主語ですが)では、特定の期間などに閲覧した履歴を削除する機能がありますが、
「敢えて履歴管理ページを観ながら、半手動でチェックを入れる」方法をメモがてら紹介します。

いや、ほら、あると思うんですよ。「この前見た〇〇なんだっけかな～？」って履歴からしらみつぶしに探したりするケースが。

注意点とお詫び

便宜上「ブックマークレット」という表現を用いていますが、
chrome:// スキーマ上ではブックマークレットが使えない様に感じました。
( 特殊な手法を踏まないといけないのか、セキュリティ上の制約などがあるのかも？ )

このため、DevTools の Console から直接実行させてください

「DevTools console」でググってみる

スクリプト

((sr)=>{
    const _items = sr.querySelectorAll("#infinite-list>history-item");
    _items.forEach(_d=>{
        const _cbox = _d.shadowRoot.querySelector("#checkbox:not([checked])");
        if(_cbox){
            _cbox.click();
        }
    });
})(document.querySelector("history-app").shadowRoot.querySelector("#history").shadowRoot);

性質

閲覧履歴上で、まだチェックの入っていない項目にチェックを入れます。

「一括」という表現を用いていますが、ページ上のすべてに隅から隅までチェックを入れる訳ではなく、レンダリング処理か何かの影響を受けているのか(shadow DOMだから？) 自分が見えている一定範囲内の領域のみがチェックをれる対象となっています。

ちょろっと解説

色々弄った結果、自分は上記の様な感じに落ち着きました。

DevTools から chrome://history/ を覗いてみると、自分はほぼ無縁の #shadow-root (shadow DOM) がめちゃんこ使われてました。
なので、セレクタで掘り下げるのも .shadowRoot プロパティ経由となっています。

チェック関連のノードで、有無判別が以下の様な差異だったように感じました。

// チェック無し
<cr-checkbox id="checkbox" focus-row-control focus-type="cr-checkbox" class="no-label">

// チェックあり
<cr-checkbox id="checkbox" focus-row-control focus-type="cr-checkbox" class="no-label" checked>

このため、CSSセレクタ,疑似クラスである :not() にて checked 要素の有無で拾っています
参考 : MDN > CSS > :not()

その他の事

文字数詰めるなら (?.) で繋げられる Optional chaining を使っても良かったかもしれない...
参考 : MDN > Optional chaining (?.)

プロフィール