Как правильно сделать градиентный border кнопки с анимацией?

Есть кнопка, нужно сделать градиентный border с двух ее углов, при наведении обводка должна становиться сплошной. Я сделал это таким образом -
Но есть две проблемы (обе видны на гифке) -

1. В хроме анимация дерганая
   
2. Нижняя граница почему-то не всегда отображается
   

Как их можно исправить, либо возможно есть какой-то более правильный способ реализации подобного эффекта?