Customization templates as external file not working with Gatsby

Support
#1

Hi there!

I’m trying to add a custom snipcart templates file with Gatsby but failed miserably. I followed the documentation here in french (couldn’t find the english version of that part). Snipcart is initialized as expected and everything work pretty well but I can’t manage to make it work with a custom templates for some reasons. It’s like the data-templates-url attribute is totally ignored at the initialization even if the path seems good and the templates file content itself as well.

Here’s my snipcart-templates.html file as a test which I put in the static folder:

<!DOCTYPE html>
<html>
  <head>
    <title>Templates</title>
  </head>

  <body>
    <div id="snipcart-templates">
      <empty-cart>
        <section class="snipcart-empty-cart">
          <h1
            class="snipcart-empty-cart__title snipcart__font--secondary snipcart__font--xlarge snipcart__font--bold"
          >
            Empty like us without you :(
          </h1>
          <button-secondary
            icon="back-arrow"
            label="actions.back_to_store"
            has-icon-left
            is-fit-content
            @click="$actions.goBack"
          ></button-secondary>
        </section>
      </empty-cart>
    </div>
  </body>
</html>

Here’s my div#snipcart:

<div hidden="" id="snipcart" data-api-key="<MY_PUBLIC_SNIPCART_API_KEY>" data-currency="usd" data-config-modal-style="side" data-templates-url="/snipcart-templates.html"></div>

First I thought it was because I work on dev environment and access to a static file would failed. Then I tested using gatsby build && gatsby serve to spin up a local server which I though would probably work but it didn’t. Even though I can access the template html file directly with the url.

So do you guys have any ideas what am I doing wrong here? Any suggestions are very welcomed.

–
Snipcart version: 3.4.0
Gatsby version: 4.24.7
MacOS version: 12.6.1