Magento – Knockout HTML template being cached

cacheknockoutjsmagento2static-contenttemplate

Does anyone know how to stop Knockout HTML templates from being cached (for dev purposes)? I don't have this issue with any other files (CSS, PHTML, XML, JS), it only happens with HTML templates.

As an example I will add the word test to the checkout button in the minicart. The file already exists, the only change I'm making is to add the word test.

<!-- ko i18n: 'Go to Checkout TEST' --><!-- /ko -->

File: app/design/frontend/VENDOR/THEME/Magento_Checkout/web/template/minicart/content.html

These are the steps I usually have to take to display my changes:

  1. Clear Magento cache (php bin/magento c:f)
  2. Clear browser cache
  3. Refresh

No change.

  1. Clear browser cache again
  2. Refresh

The change is now visible. This time I got lucky, sometimes it requires more cache clears and other times I give up and delete the caches, var/view_preprocessed and pub/static/frontend.

My questions are:

What causes this?

Why does it only affect HTML files?

Is there a workaround?

Best Answer

From my experience, we should disable Browser Cache when developing. It's one of the way for preventing Browser Cache, not full answer to this quesion.

For example:

Chrome: Network tab > Disable cache

enter image description here

UPDATE:

-Cache on the server side: my team had the same problem with Vagrant box and Puppet. The Puppet Master had the Opcache on the server side. So, the content was cached(can be some days). So, we need to clean the Opcache server.