Видео не воспроизводится с первого раза при наведении

Решение

Попробуй проверять состояние проигрывания видео следующим образом, данная проверка подходит для любых типов медиа-файлов:

Object.defineProperty(HTMLMediaElement.prototype, "playing", {
  get: function get() {
    return !!(
      this.currentTime > 0 &&
      !this.paused &&
      !this.ended &&
      this.readyState > 2
    );
  }
});

То есть, если видео не проигрывается, то ты можешь это проверить следующим образом:

let videoBlock = $(this).find(".video");
if (!videoBlock.playing) {
  video.play();
  console.log('видео можно воспроизвести!')
}

Пример

"use strict"; 
 
Object.defineProperty(HTMLMediaElement.prototype, "playing", { 
  get: function get() { 
    return !!( 
      this.currentTime > 0 && 
      !this.paused && 
      !this.ended && 
      this.readyState > 2 
    ); 
  } 
}); 
 
$("body").on("mouseover", ".services__item", function() { 
  var videoBlock = $(this).find(".video"), 
    video = videoBlock.get(0); 
 
  if (!videoBlock.playing) { 
    video.play(); 
    videoBlock.css("background-color", "black"); 
  } 
}); 
$("body").on("mouseleave", ".services__item", function() { 
  var videoBlock = $(this).find(".video"), 
    video = videoBlock.get(0); 
    video.pause(); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="services__item"> 
    <div class="services__media-wrp"> 
      <div class="services__media"> 
        <video class="video"loop> 
          <source src="https://upread.ru/video/art144-1.mp4" type="video/mp4" /> 
        </video> 
      </div> 
    </div> 
</div>

Данная проблема возникает, потому что play() и pause() в каком-то смысле соревнуются, и вам необходимо четко определять когда видео не воспроизведено.

Решение с muted

Вы так же можете использовать muted для video:

<video ... muted="muted"></video>

Но это не лучшее решение, потому что звук будет выключен, а если у вас видео или аудио со звуком, вам понадобиться совершать лишние действия для активации звука.

Вы ошибку читали в консоле? Там же написано, что воспроизведение не удалось, потому что пользователь НЕ взаимодействовал с документом. Это политика автовоспроизведения.

Т.е. он считает, что раз ничего не делалось (не было клика) в DOM то это автовоспроизведения.

Для примера сделайте клик в любой части DOM потом наведите на видео. Будет работать.

Как вариант, может отключить звук по умолчанию

<video class="video" loop  muted="muted">
    <source src="https://upread.ru/video/art144-1.mp4" type="video/mp4" />
</video>