Bloggerのラベル検索で総件数以上に前の投稿へ戻れる

問題現象

Bloggerのラベル検索結果でラベル総数を超えても前の投稿を表示しようとする。

前提

  • ラベル：WSHLibrary
  • ラベル総数：12件（記事作成時点）
  • 1ページ表示数：10件

例

  1. ラベル検索ページを表示する
  2. 1次検索結果を表示する
    • 6件分が表示される
      • 補足：Bloggerでは、指定件数よりも表示件数が少なくなることがる
  3. 前の投稿をクリックする
  4. 2次検索結果を表示する
    • 4件分が表示される
  5. 前の投稿をクリックする
  6. 3次検索結果を表示する
    • 2件分が表示される
    • 12件すべての検索結果が表示されたことになる
    • 前の投稿をクリックできる状態にある ← これが問題
      • data:olderPageUrlがある
  7. 前の投稿をクリックする
  8. 4次検索結果を表示する
    • 「「WSHLibrary」のラベルが付いた投稿はありません。」を表示する
    • 0件分が表示される
    • 次の投稿も前の投稿もクリックできない
      • data:newerPageUrlとdata:olderPageUrlがない

対応方法

ラベル総数まで検索結果を表示した場合、前の投稿のリンクを表示しないようにする。

具体的には、ラベル総数をフィードから取得して、検索結果件数をクエリパラメータのstartとページ上の検索結果数から取得します。後は、ラベル総数まで検索結果を表示した場合、前の投稿へのリンクを無効化しています。

ソースコード

<span id='blog-pager-older-link' expr:data-label='data:view.search.label' expr:data-home-page='data:blog.homepageUrl.canonical.https' expr:data-num-posts='data:posts.size'><a class='template-link' expr:href='data:olderPageUrl'>前の投稿</a></span>
<b:if cond='data:view.search.label'>
<script>
//<![CDATA[
(function() {
  window.onPageNavigation = function(root) {
    const older = document.getElementById('blog-pager-older-link');
    const total = root.feed.openSearch$totalResults.$t - 0;
    const start = new URLSearchParams(window.location.search).get('start');
    const end = (start ? start-0 : 0) + (older.dataset.numPosts - 0);

    if (end >= total) {
      older.classList.add('not-link');
      older.innerHTML = older.firstElementChild.innerHTML;
    }
  };

  const main = function() {
    const older = document.getElementById('blog-pager-older-link');
    if (older && 'URLSearchParams' in window) { // 本機能は、必須機能ではないため、IE11を切り捨てる
      const ad = document.createElement('script');
      ad.type = 'text/javascript';
      ad.async = true;
      ad.src = older.dataset.homePage+'feeds/posts/summary/-/'+older.dataset.label.replace(/\+/g, '/')+'?alt=json&callback=onPageNavigation&max-results=0';
      const sc = document.getElementsByTagName('script')[0];
      sc.parentNode.insertBefore(ad, sc);
    }
  };

  main();
  //window.addEventListener('lazy', main);
})();
//]]>
</script>
</b:if>

関連