Bootsrap 4 popover ошибка выделения текста в input

https://jsfiddle.net/xrudnovo/3/

HTML

<button data-toggle="popover">Ссылка</button>

CSS

.custom_popover {
  border: 1px solid red;
  padding: 60px;
  left: 250px !important;
  background-color: red;
  opacity: 1;
}

JS

$('[data-toggle="popover"]').popover({
        title: 'calculator',
        template: '<div class="custom_popover">' +
        '<i class="close" title="Закрыть"></i>' +
        '<div class="row m-b-2">' +
        '<div class="col-xs-9">' +
        '<input class="form-control form-control-sm currency-foreign" placeholder="Введите сумму" value="" type="text">' +
        '</div>' +
        '<div class="col-xs-3">' +
        '<span class="type_currency" data-type-currency-field=""></span>' +
        '</div>' +
        '</div>' +
        '<div class="row">' +
        '<div class="col-xs-9">' +
        '<input class="form-control form-control-sm currency-domestic" placeholder="Введите сумму" value="" type="text">' +
        '</div>' +
        '<div class="col-xs-3">' +
        '<span class="type_currency">RUR</span>' +
        '</div>' +
        '</div>' +
        '</div>',
        placement: 'bottom'
    }534554
)

Нашел такой баг или это правильное поведение, не знаю Bootstrap 4 - Popover

При выделение текста в инпуте, если курсор мыши вытащить за пределы popover(не сбрасывая выделение), то выделение пропадает когда курсор выходит за пределы popover

Это возникает из-за свойства transform translate, с помощью которого позиционируется popover

В bootstrap 3 позиционирование работает через top и left, поэтому там все ок

Вопрос Как избавиться от данного поведения?

Примечание браузер chromiun или chrome.

Firefox - все ок