title: Swiper.js slidesPerGroup or slidesPerView not grouping the odd items
body: <p>I'm using Swiper.js for a slider on a website I'm building for a client. Their requirement is something like this: There are 10 items inside the slider, 4 will be visible at one time, and everytime you click on the arrow, 4 items will slide out with 4 new items sliding in. So if I had slides 1-10, this is how the slider should behave:</p>
  <p>First view: 1-4 slides
  Second view: 5-8 slides
  Third view: 9, 10, 1, 2 slides
  Fourth view: 3-6 slides.... and so on.</p>
  <p>It is an infinite loop, and will always slide 4 at a time. I tried to create such a slider using swiper.js and got very close, but not quite there. Here's what I was able to create: <a href="https://i.gyazo.com/3ef7e1d8f35b067bce961c853214150a.mp4" rel="nofollow noreferrer">https://i.gyazo.com/3ef7e1d8f35b067bce961c853214150a.mp4</a></p>
  <p>You'll notice that it is fine in the first two clicks, going as expected, but once there are slide 9, 10, 1 and 2 in view and I click next, it only moves 2 slides at a time, bringing slides 1-4 in view. I need to avoid this from happening, and ensure it always moves 4 slides at a time, in an infinite loop. Here's my code:</p>
  <pre><code>var swiper = new Swiper('.swiper-container', {
      slidesPerView: 4,
      spaceBetween: 10,
      slidesPerGroup: 4,
      loop: true,
      loopFillGroupWithBlank: false,
      navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev',
      },
  });
  </code></pre>
  <p>Thanks in advance!
  Cheers</p>