Weird empty cart redirect on insufficient stock

[plfunkymusic]

We have two problems caused when there's insufficient stock of a product.  Firstly, if a customer tries to add more than the available product into the basket, it appears that nothing happens. (you don't get the added to basket message, or insufficient stock message).  Then when they look in the basket, they see there's only the maximum available that's been added.  This isn't great, but it's no big deal.  For example, customer adds 3 t-shirts in a certain size into their basket, but only 2 are in stock.  Basket icon looks empty, but after looking at basket it updates to show 2 t-shirts.

The second problem is more annoying.  If said customer then increases the number of that t-shirt in the basket from 2 to 3, the basket redirects to "Your basket is empty" page.  Then when going back to the basket, it again shows the 2 available t-shirts.  Why is there a redirect on error, rather than a message indicating insufficient stock?  Any help much appreciated.  

The end of our cart-template.liquid looks like this:

  <div class="empty-page-content{% if cart.item_count > 0 %} hide{% endif %} text-center" data-empty-page-content>
    <h1>{{ 'cart.general.title' | t }}</h1>
    <p class="cart--empty-message">{{ 'cart.general.empty' | t }}</p>
    <div class="cookie-message">
      <p>{{ 'cart.general.cookies_required' | t }}</p>
    </div>
    <a href="https://oursiteaddress.com/" class="btn btn--has-icon-after cart__continue-btn">{{ 'general.404.link' | t }}{% include 'icon-arrow-right' %}</a>
  </div>
</div>

[plfunkymusic]

I should add, that if I remove that last piece of code from cart-template.liquid, then I get the error message in the cart when trying to add too many items of one product, but don't get the "your cart is empty" redirect on an empty cart...

[plfunkymusic · Accepted solution]

I've found a nice work-around for this problem.  I discovered the reason for the strange behaviour is the 422 error caused by the AJAX return that stops any more code from running.  I flip the logic and default the page to only show cart is empty (rather than hiding it), and now it works way better:

  {%  if cart.item_count == 0 or cart.empty? %}
  <div class="empty-page-content text-center" data-empty-page-content>
    <h1>{{ 'cart.general.title' | t }}</h1>
    <p class="cart--empty-message">{{ 'cart.general.empty' | t }}</p>
    <div class="cookie-message">
      <p>{{ 'cart.general.cookies_required' | t }}</p>
    </div>
    <a href="https://oursite.com/" class="btn btn--has-icon-after cart__continue-btn">{{ 'general.404.link' | t }}{% include 'icon-arrow-right' %}</a>
  </div>
  {% endif %}