bootstrap-selectの1.13.8以前では、val()でoptionを選択した時のpreviousValueが取得できなかった

Bootstrapを使っている環境にて、select要素の見栄えを良くしたい場合、 bootstrap-select を使うことがあります。
snapappointments/bootstrap-select: The jQuery plugin that brings select elements into the 21st century with intuitive multiselection, searching, and much more.

　
bootstrap-selectにはいくつかイベントがあり、例えば changed.bs.select を使うと選択した値が変更された時にイベントが発火します。
https://developer.snapappointments.com/bootstrap-select/options/#events

ドキュメントにもある通り previousValue には変更前の値が入ってきます。

ただ、1.13.8以前の古いバージョンを使っている場合、previousValueが取得できなかったため、メモを残します。

環境
原因
対応
再現
- bootstrap-selectのバージョンが1.13.8の場合
- bootstrap-selectのバージョンが1.13.9の場合
ソースコード

環境

Bootstrap 4.3.1
bootstrap-select 1.13.8/1.13.9
jQuery 3.5.1
popper 1.14.7

原因

以下にある通り、バグがあったようです。

対応

bootstrap-selectを1.13.9以降にアップデートします。

再現

以下のようなHTMLがあるとします。

<div style="padding: 10px">
  <div>
    <h1>1.13.8</h1>

    <select id="ringo"  class="selectpicker">
      <option value="1">フジ</option>
      <option value="2">紅玉</option>
      <option value="3">シナノゴールド</option>
    </select>
  </div>

  <div style="padding-top: 10px">
    <button id="auto" class="btn btn-primary">自動選択</button>
  </div>
</div>

　
表示はこんな感じ。

f:id:thinkAmi:20201123135256p:plain:w400

　
　
ここで、

$(document).ready(function() {
  $('#ringo').on('changed.bs.select', (event, clickedIndex, isSelected, previousValue) => {
    console.log(previousValue);
  });

  $('#auto').on('click', () => {
    $('#ringo').selectpicker('val', 3);
  })
});